notes/org-media-sass
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

updated

Browse source
This commit is contained in:
ronny abraham 2025-01-21 02:10:25 +02:00
parent 1a79c3af07
commit 656f12e3ce
5 changed files with 64 additions and 56 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
_tables.sass
View file

@ -26,7 +26,6 @@
// Thin Table for Calls/Username with Side Borders Only // Thin Table for Calls/Username with Side Borders Only
.thin-table .thin-table
width: auto width: auto
border: solid $table-header-bg
border-spacing: 0 border-spacing: 0
margin: 15px 0 margin: 15px 0
@ -39,10 +38,6 @@
padding: 12px 16px /* Increased padding for more width */ padding: 12px 16px /* Increased padding for more width */
text-align: center text-align: center
border-left: 1px solid $table-border-color
border-right: 1px solid $table-border-color
@mixin set-table-thin-color($table-border, $table-border-sides) @mixin set-table-thin-color($table-border, $table-border-sides)
.thin-table .thin-table
border: solid $table-border border: solid $table-border

10
_variables.sass
View file

@ -1,4 +1,5 @@
@use "sass:map" @use "sass:map"
@use "sass:color"
// Import the chosen theme (dark or light) // Import the chosen theme (dark or light)
// Or 'themes/light' // Or 'themes/light'
@ -15,7 +16,8 @@ $list-padding-left: 20px
text-decoration: none text-decoration: none
&:hover &:hover
color: darken($link-color-primary, 10%) // color: darken($link-color-primary, 10%)
color: color.adjust($link-color-primary, $lightness: -10%)
text-decoration: underline text-decoration: underline
@mixin link-secondary @mixin link-secondary
@ -23,7 +25,8 @@ $list-padding-left: 20px
text-decoration: underline text-decoration: underline
&:hover &:hover
color: lighten($link-color-secondary, 10%) // color: lighten($link-color-secondary, 10%)
color: color.adjust($link-color-secondary, $lightness: 10%)
@mixin link-inverse @mixin link-inverse
color: $inverse-link-color color: $inverse-link-color
@ -33,6 +36,7 @@ $list-padding-left: 20px
border-radius: 3px border-radius: 3px
&:hover &:hover
background-color: darken($link-color-primary, 10%) //background-color: darken($link-color-primary, 10%)
background-color: color.adjust($link-color-primary, $lightness: -10%)
color: $inverse-link-hover-color color: $inverse-link-hover-color

55
course_listings.sass
View file

@ -1,41 +1,44 @@
@import 'themes/course_listings/dark' @use "sass:map"
@import 'mixins' @use "sass:color"
@import 'collapsible'
@include toggle-section-numbers(h4, false) @use 'themes/course_listings/dark' as theme
@include remove-section-number(h2) @use 'mixins'
@use 'collapsible'
@include mixins.toggle-section-numbers(h4, false)
@include mixins.remove-section-number(h2)
// @include set-header-sizes($default-header-sizes) // @include set-header-sizes($default-header-sizes)
// @include set-header-color($text-color) // @include set-header-color($text-color)
// Base body styles // Base body styles
body body
font-family: $primary-font font-family: theme.$primary-font
font-size: 16px font-size: 16px
line-height: 1.6 line-height: 1.6
color: $text-color color: theme.$text-color
background-color: $background-color background-color: theme.$background-color
// Headers // Headers
@each $header, $props in $header-styles @each $header, $props in theme.$header-styles
#{$header} #{$header}
font-family: $secondary-font font-family: theme.$secondary-font
font-weight: bold font-weight: bold
color: map-get($props, color) color: map.get($props, color)
font-size: map-get($props, size) font-size: map.get($props, size)
margin-top: 20px margin-top: 20px
margin-bottom: 10px margin-bottom: 10px
div#postamble div#postamble
border-color: $text-color border-color: theme.$text-color
a a
color: $anchor-color color: theme.$anchor-color
text-decoration: none text-decoration: none
&:hover &:hover
color: $anchor-hover-color color: theme.$anchor-hover-color
border-bottom-color: $anchor-hover-color border-bottom-color: theme.$anchor-hover-color
text-decoration: underline text-decoration: underline
h2 h2
@ -52,7 +55,7 @@ h3 + .outline-text-3 p
h3 + .outline-text-3 p > a:first-of-type h3 + .outline-text-3 p > a:first-of-type
font-size: 1em font-size: 1em
margin-left: $first-anchor-margin-left margin-left: theme.$first-anchor-margin-left
h4 h4
text-transform: uppercase text-transform: uppercase
@ -107,19 +110,20 @@ ul.explanation
li li
color: darken($primary-color, 10) // color: darken(theme.$primary-color, 10)
color: color.adjust(theme.$primary-color, $lightness: -10%)
font-weight: bold font-weight: bold
font-family: $secondary-font font-family: theme.$secondary-font
text-transform: uppercase text-transform: uppercase
font-size: .9rem font-size: .9rem
a a
text-transform: none text-transform: none
font-weight: normal font-weight: normal
color: $anchor-secondary-color color: theme.$anchor-secondary-color
&:hover &:hover
color: $anchor-secondary-hover-color color: theme.$anchor-secondary-hover-color
/* /*
&:not(a) &:not(a)
color: darken($primary-color, 10) color: darken($primary-color, 10)
@ -138,12 +142,13 @@ ul.toc
text-transform: uppercase text-transform: uppercase
font-weight: bold font-weight: bold
font-size: 1rem font-size: 1rem
font-family: $secondary-font font-family: theme.$secondary-font
color: $tertiary-color color: theme.$tertiary-color
color: lighten($quinary-color, 5) color: color.adjust(theme.$quinary-color, $lightness: 5%)
text-transform: uppercase text-transform: uppercase
&:hover &:hover
color: lighten($quinary-color, 10) // color: lighten($quinary-color, 10)
color: color.adjust(theme.$quinary-color, $lightness: 5%)
&::after &::after
content: " Notes" content: " Notes"

46
org-mode.sass
View file

@ -1,26 +1,29 @@
@import 'fonts' @use "sass:map"
@import 'variables' @use "sass:color"
@import 'themes/light'
@import 'mixins' @use 'fonts'
@import 'tables' @use 'variables'
@use 'themes/light' as theme
@use 'mixins'
@use 'tables'
// Base styles // Base styles
body body
line-height: 1.6 line-height: 1.6
color: $primary-color color: theme.$primary-color
background-color: $background-color background-color: theme.$background-color
padding: 1em padding: 1em
max-width: 800px max-width: 800px
margin: 0 auto margin: 0 auto
// Headers // Headers
@each $header, $props in $header-styles @each $header, $props in theme.$header-styles
#{$header} #{$header}
font-family: $secondary-font font-family: theme.$secondary-font
font-weight: bold font-weight: bold
color: map_get($props, color) color: map.get($props, color)
font-size: map_get($props, size) font-size: map.get($props, size)
margin-top: 1.5em margin-top: 1.5em
margin-bottom: 0.5em margin-bottom: 0.5em
@ -33,20 +36,20 @@ h3
// remember to use toggle! // remember to use toggle!
@include remove-section-number(h3) @include mixins.remove-section-number(h3)
@include remove-section-number(h4) @include mixins.remove-section-number(h4)
p p
margin-bottom: 1em margin-bottom: 1em
a a
@include link-primary @include variables.link-primary
a.secondary a.secondary
@include link-secondary @include variables.link-secondary
a.inverse a.inverse
@include link-inverse @include variables.link-inverse
ul, ol ul, ol
@ -57,14 +60,14 @@ li
margin-bottom: 0.5em margin-bottom: 0.5em
blockquote blockquote
border-left: 4px solid $secondary-color border-left: 4px solid theme.$secondary-color
padding-left: 1em padding-left: 1em
color: $secondary-color color: theme.$secondary-color
margin: 1.5em 0 margin: 1.5em 0
pre, code pre, code
font-family: "Courier New", monospace font-family: "Courier New", monospace
background-color: $code-bg-color background-color: theme.$code-bg-color
padding: 0.2em 0.4em padding: 0.2em 0.4em
border-radius: 3px border-radius: 3px
@ -78,12 +81,13 @@ table
margin-bottom: 1em margin-bottom: 1em
th, td th, td
border: 1px solid $table-border-color border: 1px solid theme.$table-border-color
padding: 0.5em padding: 0.5em
text-align: left text-align: left
th th
background-color: lighten($background-color, 10%) //background-color: lighten(theme.$background-color, 10%)
background-color: color.adjust(theme.$background-color, $lightness: 10%)
font-weight: bold font-weight: bold

4
themes/course_listings/_dark.sass
View file

@ -1,4 +1,5 @@
@use "sass:map" @use "sass:map"
@use "sass:color"
$primary-color: red $primary-color: red
$secondary-color: blue $secondary-color: blue
@ -26,8 +27,7 @@ $header-styles: map.set($header-styles, h4, (size: 1.0em, color: $quaternary-col
// Colors // Colors
$anchor-color: $primary-color $anchor-color: $primary-color
$anchor-hover-color: lighten($anchor-color, 10) $anchor-hover-color: color.adjust($anchor-color, $lightness: 10%)
$anchor-secondary-color: #a19581 $anchor-secondary-color: #a19581
$anchor-secondary-hover-color: #ffad42 // A warm, light orange that pairs well with the yellow marker $anchor-secondary-hover-color: #ffad42 // A warm, light orange that pairs well with the yellow marker