refactored

_share/media/sass/facebook.sass

@@ -1,36 +1,29 @@
 @use "sass:map"
 @use "sass:color"
+
+@use 'default-org-mode'
+
 @use 'variables' as * 
 @use 'fonts' as fonts
 @use 'mixins' as mixins-basic
 
+@use 'collapsible'
+
 @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
@@ -39,37 +32,18 @@ a
 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
+  border-color: $secondary-color
   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
+  border-color: $table-border-color
 
 th
   background-color: $table-header-bg
@@ -85,85 +59,31 @@ pre, code
 
   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
+  border-color: $note-border-color
   color: $text-color
 
 div#postamble
-  border-top: 1px dashed $note-border-color
-  margin-top: 2em
-  padding-top: 1em
+  border-color: $note-border-color
   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
+div#table-of-contents ul li 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