media-facebook/_share/media/sass/facebook.sass
2024-11-29 07:15:36 +02:00

169 lines
3 KiB
Sass

@use "sass:map"
@use "sass:color"
@use 'variables' as *
@use 'fonts' as fonts
@use 'mixins' as mixins-basic
@include mixins-basic.set-header-sizes($default-header-sizes)
@include mixins-basic.set-header-colors($default-header-colors)
@include mixins-basic.set-header-margins-sides($default-header-margins-sides)
@include mixins-basic.set-header-margins-vertical($default-header-margins-vertical)
@include mixins-basic.remove-section-number(h2)
@include mixins-basic.remove-section-number(h4)
/* Base Styles */
body
font-family: $primary-font
font-size: 1em
line-height: 1.6
color: $text-color
background-color: $background-color
margin: 0 auto
max-width: 900px
padding: 1em
/* Link Styles */
a
color: $anchor-color
text-decoration: underline
text-underline-offset: 2px
&:hover
color: $anchor-hover-color
// Lists
ul, ol
padding-left: $list-padding-left
ul
margin: 1em 0em
list-style-type: disc
ol
margin: 1em .5em
list-style-type: decimal
li
margin-bottom: 0.5em
// Blockquotes
blockquote
border-left: 4px solid $secondary-color
padding-left: 1em
color: color.adjust($text-color, $lightness: 10%)
margin: 1.5em 0
font-family: $secondary-font
// Tables
table
width: 100%
border-collapse: collapse
margin-bottom: 1em
color: $text-color
th, td
padding: 0.75em
text-align: left
border: 1px solid $table-border-color
th
background-color: $table-header-bg
color: $text-color
tr:nth-child(even)
background-color: color.adjust($background-color, $lightness: 5%)
/* Code Block Styles */
pre, code
background-color: $code-background-color
color: $code-text-color
font-family: $secondary-font
border-radius: 4px
padding: 0.5em
display: block
overflow-x: auto
// Section
section
margin-bottom: 2em
/* Header Styles */
h1, h2, h3, h4, h5, h6
text-transform: capitalize
font-family: $secondary-font
font-weight: bold
h3
a
color: color.adjust($anchor-color, $lightness: -12%)
&:hover
text-decoration: none
color: color.adjust($anchor-hover-color, $lightness: -12%)
// Paragraphs
p
margin-bottom: 1em
// Notes
.note
background-color: $note-background-color
padding: 0.5em
border-left: 3px solid $note-border-color
margin-bottom: 1em
color: $text-color
div#postamble
border-top: 1px dashed $note-border-color
margin-top: 2em
padding-top: 1em
color: color.adjust($note-border-color, $lightness: 20%)
font-size: 0.9em
.outline-3
margin-left: .5em
.outline-4
margin-left: .5em
/* Table of Contents Link */
.toc
font-weight: bold
color: $primary-color
ul.links
padding-left: 2em
list-style-type: square
li
margin: 0
a
text-transform: capitalize
div#table-of-contents
ul
padding-left: 1em
margin: 0
list-style-type: none
li
margin: .4 0
a
color: $toc-anchor-color
text-transform: lowercase
text-decoration: none
&:hover
color: $toc-anchor-hover-color
h2
margin-left: 0
margin-bottom: .2em
text-transform: uppercase