updated a bunch of themes, as well as categories. added the social category

This commit is contained in:
ronny abraham 2025-01-22 04:11:14 +02:00
parent 2d4194d958
commit 094a1277b6
12 changed files with 453 additions and 68 deletions

View file

@ -34,32 +34,25 @@ ul, ol
.note .note
background-color: $note-background-color background-color: $note-background-color
border-color: $note-border-color border-color: $note-border-color
padding: 1em
p p
color: $note-color color: $note-color
font-weight: bold
font-size: 1em
// Blockquotes // Blockquotes
blockquote blockquote
border-color: $secondary-color color: $blockquote-color
color: $note-color border-color: $blockquote-border-color
font-family: $primary-font
font-style: italic
// Tables // Tables
table table
color: $text-color color: $table-color
font-size: 1em
th, td th, td
border-color: $table-border-color border-color: $table-border-color
th th
background-color: $table-header-bg background-color: $table-header-bg
color: $text-color color: $table-header-color
font-family: $secondary-font font-family: $secondary-font
font-size: 1.3em
tr:nth-child(even) tr:nth-child(even)
@ -69,7 +62,7 @@ tr:nth-child(even)
pre, code pre, code
color: $code-text-color color: $code-text-color
background-color: $code-background-color background-color: $code-background-color
font-family: $primary-font border-color: $code-border-color
/* Header Styles */ /* Header Styles */
h1, h2, h3, h4, h5, h6 h1, h2, h3, h4, h5, h6
@ -90,11 +83,6 @@ h3
&:hover &:hover
color: color.adjust($anchor-hover-color, $lightness: -12%) color: color.adjust($anchor-hover-color, $lightness: -12%)
// Notes
.note
background-color: $note-background-color
border-color: $note-border-color
color: $text-color
div#postamble div#postamble
border-color: $note-border-color border-color: $note-border-color

View file

@ -30,32 +30,39 @@ a
ul, ol ul, ol
padding-left: $list-padding-left padding-left: $list-padding-left
// Notes
.note
background-color: $note-background-color
border-color: $note-border-color
p
color: $note-color
// Blockquotes // Blockquotes
blockquote blockquote
border-color: $secondary-color color: $blockquote-color
color: color.adjust($text-color, $lightness: 10%) border-color: $blockquote-border-color
font-family: $secondary-font
// Tables // Tables
table table
color: $text-color color: $table-color
th, td th, td
border-color: $table-border-color border-color: $table-border-color
th th
background-color: $table-header-bg background-color: $table-header-bg
color: $text-color color: $table-header-color
font-family: $secondary-font
tr:nth-child(even) tr:nth-child(even)
background-color: color.adjust($background-color, $lightness: 5%) background-color: color.adjust($background-color, $lightness: 5%)
/* Code Block Styles */ /* Code Block Styles */
pre, code pre, code
background-color: $code-background-color
color: $code-text-color color: $code-text-color
background-color: $code-background-color
border-color: $code-border-color
font-family: $secondary-font font-family: $secondary-font
/* Header Styles */ /* Header Styles */
@ -77,11 +84,6 @@ h3
&:hover &:hover
color: color.adjust($anchor-hover-color, $lightness: -12%) color: color.adjust($anchor-hover-color, $lightness: -12%)
// Notes
.note
background-color: $note-background-color
border-color: $note-border-color
color: $text-color
div#postamble div#postamble
border-color: $note-border-color border-color: $note-border-color

View file

@ -1,7 +1,8 @@
@use "sass:map" @use "sass:map"
@use "sass:color" @use "sass:color"
@use '../default-org-mode' @use '../org-base'
@use '../themes/muted_pulse' as * @use '../themes/muted_pulse' as *
@use '../fonts' as fonts @use '../fonts' as fonts
@use '../mixins' as mixins-basic @use '../mixins' as mixins-basic
@ -29,48 +30,59 @@ a
ul, ol ul, ol
padding-left: $list-padding-left padding-left: $list-padding-left
// Notes
.note
background-color: $note-background-color
border-color: $note-border-color
p
color: $note-color
// Blockquotes // Blockquotes
blockquote blockquote
border-color: $secondary-color color: $blockquote-color
color: color.adjust($text-color, $lightness: 10%) border-color: $blockquote-border-color
font-family: $secondary-font
// Tables // Tables
table table
color: $text-color color: $table-color
th, td th, td
border-color: $table-border-color border-color: $table-border-color
th th
background-color: $table-header-bg background-color: $table-header-bg
color: $text-color color: $table-header-color
font-family: $secondary-font
tr:nth-child(even) tr:nth-child(even)
background-color: color.adjust($background-color, $lightness: 5%) background-color: color.adjust($background-color, $lightness: 5%)
/* Code Block Styles */ /* Code Block Styles */
pre, code pre, code
background-color: $code-background-color
color: $code-text-color color: $code-text-color
background-color: $code-background-color
font-family: $secondary-font border-color: $code-border-color
/* Header Styles */ /* Header Styles */
h1, h2, h3, h4, h5, h6 h1, h2, h3, h4, h5, h6
font-family: $secondary-font font-family: $secondary-font
h4
text-transform: uppercase
h4[id="timestamp"]
color: color.adjust(map.get($default-header-colors, 'h2'), $lightness: 20%)
h4[id="playlist"]
color: color.adjust(map.get($default-header-colors, 'h3'), $lightness: -10%)
h3 h3
a a
color: color.adjust($anchor-color, $lightness: -12%) color: color.adjust($anchor-color, $lightness: -12%)
&:hover &:hover
color: color.adjust($anchor-hover-color, $lightness: -12%) color: color.adjust($anchor-hover-color, $lightness: -12%)
// Notes
.note
background-color: $note-background-color
border-color: $note-border-color
color: $text-color
div#postamble div#postamble
border-color: $note-border-color border-color: $note-border-color

98
categories/social.sass Normal file
View file

@ -0,0 +1,98 @@
@use "sass:map"
@use "sass:color"
@use '../org-base'
@use '../themes/chroma-sepia.sass' 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)
/* Base Styles */
body
font-family: $primary-font
color: $text-color
background-color: $background-color
/* Link Styles */
a
color: $anchor-color
&:hover
color: $anchor-hover-color
// Lists
ul, ol
padding-left: $list-padding-left
// Notes
.note
background-color: $note-background-color
border-color: $note-border-color
p
color: $note-color
// Blockquotes
blockquote
color: $blockquote-color
border-color: $blockquote-border-color
// Tables
table
color: $table-color
th, td
border-color: $table-border-color
th
background-color: $table-header-bg
color: $table-header-color
font-family: $secondary-font
tr:nth-child(even)
background-color: color.adjust($background-color, $lightness: 5%)
/* Code Block Styles */
pre, code
color: $code-text-color
background-color: $code-background-color
border-color: $code-border-color
/* Header Styles */
h1, h2, h3, h4, h5, h6
font-family: $secondary-font
h4
text-transform: uppercase
h4[id="timestamp"]
color: color.adjust(map.get($default-header-colors, 'h2'), $lightness: 20%)
h4[id="playlist"]
color: color.adjust(map.get($default-header-colors, 'h3'), $lightness: -10%)
h3
a
color: color.adjust($anchor-color, $lightness: -12%)
&:hover
color: color.adjust($anchor-hover-color, $lightness: -12%)
div#postamble
border-color: $note-border-color
color: color.adjust($note-border-color, $lightness: 20%)
/* Table of Contents Link */
.toc
color: $primary-color
div#table-of-contents ul li a
color: $toc-anchor-color
&:hover
color: $toc-anchor-hover-color

View file

@ -37,11 +37,18 @@ ol
li li
margin-bottom: 0.5em margin-bottom: 0.5em
// Notes
.note
padding: 1em
p
font-weight: bold
// Blockquotes // Blockquotes
blockquote blockquote
border-left: 4px solid border-left: 4px solid
padding-left: 1em padding-left: 1em
margin: 1.5em 0 margin: 1.5em 0
font-style: italic
// Tables // Tables
table table
@ -49,6 +56,9 @@ table
border-collapse: collapse border-collapse: collapse
margin-bottom: 1em margin-bottom: 1em
th
font-size: 1.3em
th, td th, td
border: 1px solid border: 1px solid
padding: 0.75em padding: 0.75em
@ -57,7 +67,7 @@ th, td
/* Code Block Styles */ /* Code Block Styles */
pre, code pre, code
border-radius: 4px border-radius: 4px
padding: 0.5em padding: 1.5em
display: block display: block
overflow-x: auto overflow-x: auto
@ -81,7 +91,7 @@ p
// Notes // Notes
.note .note
padding: 0.5em padding: 1em
border-left: 3px solid border-left: 3px solid
margin-bottom: 1em margin-bottom: 1em

View file

@ -11,25 +11,32 @@ $tertiary-color: #4caf50 // Softer green for tertiary elements
$quaternary-color: #60c8d2 // Light turquoise for highlights and links $quaternary-color: #60c8d2 // Light turquoise for highlights and links
$quinary-color: #ffd966 // Subtle warm yellow for accents $quinary-color: #ffd966 // Subtle warm yellow for accents
$background-color: #1e1e2f // Dark, neutral grayish-blue background // Text and Background
$text-color: #d1d1e0 // Soft off-white for text $text-color: #d1d1e0 // Soft off-white for text
$code-background-color: #2a2a3d // Slightly lighter gray for code blocks $background-color: #1e1e2f // Dark, neutral grayish-blue background
$code-text-color: #eaeaea // Very light gray for code text
$code-text-color: #eaeaea // Very light gray for code text
$code-background-color: #2a2a3d // Slightly lighter gray for code blocks
$code-border-color: $secondary-color // edit
$note-color: color.adjust($text-color, $lightness: -15%)
$note-background-color: #2c2c3a // Muted gray-blue for note background $note-background-color: #2c2c3a // Muted gray-blue for note background
$note-border-color: $quinary-color // Matches the warm yellow accent $note-border-color: $quinary-color // Matches the warm yellow accent
$blockquote-color: $note-color
$blockquote-border-color: $secondary-color
$anchor-color: color.adjust($secondary-color, $lightness: 10%) $anchor-color: color.adjust($secondary-color, $lightness: 10%)
$anchor-hover-color: color.adjust($primary-color, $lightness: -10%) $anchor-hover-color: color.adjust($primary-color, $lightness: -10%)
$toc-anchor-color: color.adjust($secondary-color, $lightness: -5%) $toc-anchor-color: color.adjust($secondary-color, $lightness: -5%)
$toc-anchor-hover-color: color.adjust($primary-color, $lightness: -5%) $toc-anchor-hover-color: color.adjust($primary-color, $lightness: -5%)
// Tables
$table-color: $text-color
$table-header-color: $text-color
$table-header-bg: #343449 // Muted gray-purple for table headers $table-header-bg: #343449 // Muted gray-purple for table headers
$table-border-color: #4e4e5f // Neutral gray for borders $table-border-color: #4e4e5f // Neutral gray for borders
$primary-font: 'Noto Sans', sans-serif // Clean and highly readable sans-serif font
$secondary-font: 'Noto Serif', serif // Complementary serif for headers
// Header Sizes and Colors // Header Sizes and Colors
$default-header-sizes: () $default-header-sizes: ()
$default-header-sizes: map.set($default-header-sizes, h1, 2.5em) $default-header-sizes: map.set($default-header-sizes, h1, 2.5em)
@ -64,3 +71,8 @@ $default-header-margins-vertical: map.set($default-header-margins-vertical, h3,
$default-header-margins-vertical: map.set($default-header-margins-vertical, h4, (top: 1em, bottom: 0.5em)) $default-header-margins-vertical: map.set($default-header-margins-vertical, h4, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h5, (top: 1em, bottom: 0.5em)) $default-header-margins-vertical: map.set($default-header-margins-vertical, h5, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h6, (top: 3.5em, bottom: 0.5em)) $default-header-margins-vertical: map.set($default-header-margins-vertical, h6, (top: 3.5em, bottom: 0.5em))
// Fonts
$primary-font: 'Noto Sans', sans-serif // Clean and highly readable sans-serif font
$secondary-font: 'Noto Serif', serif // Complementary serif for headers

81
themes/chroma-sepia.sass Normal file
View file

@ -0,0 +1,81 @@
// _variables.sass (Enhanced Theme with Primary-Quinary Colors)
@use "sass:map"
@use "sass:color"
@use '../fonts' as fonts
$list-padding-left: 1.2em
// Color Variables
// Colors
$primary-color: #1D2526 // Deep navy-gray
$secondary-color: #A69F92 // Soft beige-gray
$tertiary-color: #734432 // Rich brown
$quaternary-color: #BF8069 // Warm peach
$quinary-color: #A62E2E // Bold red
// Text
$text-color: color.adjust($primary-color, $lightness: 50%) // Softer white for text on darker backgrounds
$background-color: color.adjust($primary-color, $lightness: -5%) // Slightly darker neutral for overall background
$code-text-color: color.adjust($primary-color, $lightness: 70%) // Brightened for readability
$code-background-color: color.adjust($primary-color, $lightness: 0%) // Slightly darker for contrast
$code-border-color: color.adjust($primary-color, $lightness: 20%)
$note-color: $secondary-color
$note-background-color: $primary-color // Subtle contrast for notes
$note-border-color: $quinary-color // Matches the bold red accent
$blockquote-color: $note-color
$blockquote-border-color: $secondary-color
// Links, Anchors
$anchor-color: color.adjust($tertiary-color, $lightness: 0%) // Slightly brighter brown for links
$anchor-hover-color: color.adjust($tertiary-color, $lightness: 20%) // Darkened for hover effect
$toc-anchor-color: color.adjust($secondary-color, $lightness: -10%) // Slightly muted peach for TOC links
$toc-anchor-hover-color: color.adjust($secondary-color, $lightness: -30%) // Slightly darker peach for hover
// Tables
$table-color: $text-color
$table-header-color: $tertiary-color
$table-header-bg: color.adjust($secondary-color, $lightness: 0)
$table-border-color: color.adjust($primary-color, $lightness: 10%) // Darkened navy-gray for borders
$default-header-sizes: ()
$default-header-sizes: map.set($default-header-sizes, h1, 2.5em)
$default-header-sizes: map.set($default-header-sizes, h2, 2em)
$default-header-sizes: map.set($default-header-sizes, h3, 1.8em)
$default-header-sizes: map.set($default-header-sizes, h4, 1.4em)
$default-header-sizes: map.set($default-header-sizes, h5, 1.2em)
$default-header-sizes: map.set($default-header-sizes, h6, 1.1em)
$default-header-colors: ()
$default-header-colors: map.set($default-header-colors, h1, color.adjust($primary-color, $lightness: 40%))
$default-header-colors: map.set($default-header-colors, h2, $secondary-color)
$default-header-colors: map.set($default-header-colors, h3, $tertiary-color)
$default-header-colors: map.set($default-header-colors, h4, $quaternary-color)
// Initialize empty maps
$default-header-margins-sides: ()
$default-header-margins-vertical: ()
// Dynamically populate sides map
$default-header-margins-sides: map.set($default-header-margins-sides, h1, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h2, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h3, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h4, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h5, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h6, (left: 0, right: 0))
// Dynamically populate vertical map
$default-header-margins-vertical: map.set($default-header-margins-vertical, h1, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h2, (top: 1em, bottom: 0em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h3, (top: 0em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h4, (top: 0em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h5, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h6, (top: 1em, bottom: 0.5em))
// Fonts
$primary-font: 'Work Sans', sans-serif // Modern sans-serif for secondary content
$secondary-font: 'Kanit', sans-serif // Geometric and blocky sans-serif for headers

View file

@ -21,15 +21,23 @@ $tertiary-color: #66bb6a // Green for tertiary elements
$quaternary-color: #ab47bc // Light purple for highlights $quaternary-color: #ab47bc // Light purple for highlights
$quinary-color: #ff7043 // Coral orange for subtle accents $quinary-color: #ff7043 // Coral orange for subtle accents
$code-background-color: #20232a // Dark gray-blue for code blocks // Text
$code-text-color: #ffffff // Pure white for code text $text-color: #cfd8dc // Light gray-blue for text
$text-color: #a8bbc4
$background-color: #263238 // Very dark gray-blue background
$code-text-color: #ffffff // Pure white for code text
$code-background-color: #20232a // Dark gray-blue for code blocks
$code-border-color: $secondary-color
$note-color: $text-color
$note-background-color: #2c313c // Dark gray for note background $note-background-color: #2c313c // Dark gray for note background
$note-border-color: $quinary-color $note-border-color: $quinary-color
// Text $blockquote-color: $note-color
$text-color: #cfd8dc // Light gray-blue for text $blockquote-border-color: $secondary-color
$background-color: #263238 // Very dark gray-blue background
// Links, Anchors // Links, Anchors
$anchor-color: color.adjust($secondary-color, $lightness: 15%) $anchor-color: color.adjust($secondary-color, $lightness: 15%)
@ -38,6 +46,8 @@ $toc-anchor-color: color.adjust($secondary-color, $lightness: -5%)
$toc-anchor-hover-color: color.adjust($primary-color, $lightness: -5%) $toc-anchor-hover-color: color.adjust($primary-color, $lightness: -5%)
// Tables // Tables
$table-color: $text-color
$table-header-color: $text-color
$table-header-bg: #37474f // Dark blue-gray for table headers $table-header-bg: #37474f // Dark blue-gray for table headers
$table-border-color: #546e7a // Muted teal-gray for borders $table-border-color: #546e7a // Muted teal-gray for borders

View file

@ -0,0 +1,82 @@
// _variables.sass (YO-CHI-BURLEIGH-MURAL Theme)
@use "sass:map"
@use "sass:color"
@use '../fonts' as fonts
$list-padding-left: 1.2em
// Color Variables
// Colors
$primary-color: #A2BF95 // YO-CHI-BURLEIGH-MURAL-1
$secondary-color: #594834 // YO-CHI-BURLEIGH-MURAL-2
$tertiary-color: #D98F4E // YO-CHI-BURLEIGH-MURAL-3
$quaternary-color: #A6826D // YO-CHI-BURLEIGH-MURAL-4
$quinary-color: #D9663D // YO-CHI-BURLEIGH-MURAL-5
// Text and Background
$text-color: $primary-color // Softer for text on darker backgrounds
$background-color: color.adjust($secondary-color, $lightness: -20%) // Slightly darker neutral for overall background
$code-text-color: color.adjust($primary-color, $lightness: 70%) // Brightened for readability
$code-background-color: color.adjust($secondary-color, $lightness: -18%) // Slightly darker for contrast
$code-border-color: $secondary-color
$note-color: color.adjust($quaternary-color, $lightness: 10%)
$note-background-color: color.adjust($secondary-color, $lightness: -18%) // Subtle contrast for notes
$note-border-color: $quinary-color // Matches the bold red accent
$blockquote-color: $note-color
$blockquote-border-color: $secondary-color
// Links, Anchors
$anchor-color: color.adjust($tertiary-color, $lightness: 15%) // Slightly brighter for links
$anchor-hover-color: color.adjust($tertiary-color, $lightness: -10%) // Darkened for hover effect
$toc-anchor-color: color.adjust($quaternary-color, $lightness: 10%) // Slightly muted for TOC links
$toc-anchor-hover-color: color.adjust($quaternary-color, $lightness: 0%) // Darker for hover
// Tables
$table-color: color.adjust($secondary-color, $lightness: 15%)
$table-header-color: color.adjust($secondary-color, $lightness: 10%)
$table-header-bg: color.adjust($background-color, $lightness: 2%)
$table-border-color: color.adjust($background-color, $lightness: 10%)
$default-header-sizes: ()
$default-header-sizes: map.set($default-header-sizes, h1, 2.5em)
$default-header-sizes: map.set($default-header-sizes, h2, 2em)
$default-header-sizes: map.set($default-header-sizes, h3, 1.8em)
$default-header-sizes: map.set($default-header-sizes, h4, 1.4em)
$default-header-sizes: map.set($default-header-sizes, h5, 1.2em)
$default-header-sizes: map.set($default-header-sizes, h6, 1.1em)
$default-header-colors: ()
$default-header-colors: map.set($default-header-colors, h1, $primary-color)
$default-header-colors: map.set($default-header-colors, h2, $secondary-color)
$default-header-colors: map.set($default-header-colors, h3, color.adjust($tertiary-color, $lightness: -10%))
$default-header-colors: map.set($default-header-colors, h4, $quaternary-color)
// Initialize empty maps
$default-header-margins-sides: ()
$default-header-margins-vertical: ()
// Dynamically populate sides map
$default-header-margins-sides: map.set($default-header-margins-sides, h1, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h2, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h3, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h4, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h5, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h6, (left: 0, right: 0))
// Dynamically populate vertical map
$default-header-margins-vertical: map.set($default-header-margins-vertical, h1, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h2, (top: 1em, bottom: 0em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h3, (top: 0em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h4, (top: 0em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h5, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h6, (top: 1em, bottom: 0.5em))
// Fonts
$primary-font: 'Fira Mono', monospace
$secondary-font: 'Kanit', sans-serif

View file

@ -14,16 +14,21 @@ $tertiary-color: #abb2bf // General text color (new tertiary role)
$quaternary-color: #d19a66 // Highlight color (updated) $quaternary-color: #d19a66 // Highlight color (updated)
$quinary-color: #e06c75 // Accent for headers (updated) $quinary-color: #e06c75 // Accent for headers (updated)
$code-background-color: #2c313c // Code block background (updated)
$code-text-color: #abb2bf // Text color for code blocks (updated)
$note-background-color: #333842 // Note background (unchanged)
$note-border-color: $quinary-color // Note border color (unchanged)
// Text // Text
$text-color: $tertiary-color // General text color (updated) $text-color: $tertiary-color // General text color (updated)
$background-color: color.adjust($tertiary-color, $lightness: -53%) $background-color: color.adjust($tertiary-color, $lightness: -53%)
$code-text-color: #abb2bf // Text color for code blocks (updated)
$code-background-color: #2c313c // Code block background (updated)
$code-border-color: #6272a4
$note-color: color.adjust($tertiary-color, $lightness: 10%)
$note-background-color: #333842 // Note background (unchanged)
$note-border-color: $quinary-color // Note border color (unchanged)
$blockquote-color: $note-color
$blockquote-border-color: $secondary-color
// Links, Anchors // Links, Anchors
$anchor-color: color.adjust($primary-color, $lightness: 15%) $anchor-color: color.adjust($primary-color, $lightness: 15%)
$anchor-hover-color: color.adjust($quaternary-color, $lightness: 10%) $anchor-hover-color: color.adjust($quaternary-color, $lightness: 10%)
@ -31,11 +36,13 @@ $toc-anchor-color: color.adjust($secondary-color, $lightness: -5%)
$toc-anchor-hover-color: color.adjust($primary-color, $lightness: -5%) $toc-anchor-hover-color: color.adjust($primary-color, $lightness: -5%)
// Tables // Tables
$table-color: $text-color
$table-header-color: $text-color
$table-header-bg: #44475a // Steely blue for table headers (unchanged) $table-header-bg: #44475a // Steely blue for table headers (unchanged)
$table-border-color: #6272a4 // Muted blue-gray for borders (unchanged) $table-border-color: #6272a4 // Muted blue-gray for borders (unchanged)
// Default Header Sizes and Colors // Default Header Sizes and Colors
$default-header-sizes: (h1: 2em, h2: 1.75em, h3: 1.5em, h4: 1.25em, h5: 1.1em, h6: 1em) $default-header-sizes: (h1: 2.2em, h2: 1.75em, h3: 1.5em, h4: 1.25em, h5: 1.1em, h6: 1em)
$default-header-colors: (h1: $quaternary-color, h2: $quinary-color, h3: $primary-color, h4: $secondary-color) $default-header-colors: (h1: $quaternary-color, h2: $quinary-color, h3: $primary-color, h4: $secondary-color)
// Initialize empty maps // Initialize empty maps

75
themes/sandy-peach.sass Normal file
View file

@ -0,0 +1,75 @@
// _variables.sass (Enhanced Theme with Primary-Quinary Colors)
@use "sass:map"
@use "sass:color"
@use '../fonts' as fonts
$list-padding-left: 1.2em
// Color Variables
// Colors
$primary-color: #1D2526 // Deep navy-gray
$secondary-color: #A69F92 // Soft beige-gray
$tertiary-color: #734432 // Rich brown
$quaternary-color: #BF8069 // Warm peach
$quinary-color: #A62E2E // Bold red
$code-background-color: color.adjust($primary-color, $lightness: -10%) // Slightly darker for contrast
$code-text-color: color.adjust($primary-color, $lightness: 70%) // Brightened for readability
$note-background-color: color.adjust($secondary-color, $lightness: 20%) // Subtle contrast for notes
$note-border-color: $quinary-color // Matches the bold red accent
// Text
$text-color: color.adjust($primary-color, $lightness: 10%)
$background-color: color.adjust($secondary-color, $lightness: 25%) // Slightly darker neutral for overall background
// Links, Anchors
$anchor-color: color.adjust($tertiary-color, $lightness: 0%) // Slightly brighter brown for links
$anchor-hover-color: color.adjust($tertiary-color, $lightness: 20%) // Darkened for hover effect
$toc-anchor-color: color.adjust($quaternary-color, $lightness: 0%) // Slightly muted peach for TOC links
$toc-anchor-hover-color: color.adjust($quaternary-color, $lightness: -20%) // Slightly darker peach for hover
// Tables
$table-header-bg: color.adjust($quaternary-color, $lightness: -20%) // Darker peach for table headers
$table-border-color: color.adjust($primary-color, $lightness: -20%) // Darkened navy-gray for borders
$default-header-sizes: ()
$default-header-sizes: map.set($default-header-sizes, h1, 2.5em)
$default-header-sizes: map.set($default-header-sizes, h2, 2em)
$default-header-sizes: map.set($default-header-sizes, h3, 1.8em)
$default-header-sizes: map.set($default-header-sizes, h4, 1.4em)
$default-header-sizes: map.set($default-header-sizes, h5, 1.2em)
$default-header-sizes: map.set($default-header-sizes, h6, 1.1em)
$default-header-colors: ()
$default-header-colors: map.set($default-header-colors, h1, color.adjust($primary-color, $lightness: 10%))
$default-header-colors: map.set($default-header-colors, h2, $secondary-color)
$default-header-colors: map.set($default-header-colors, h3, $tertiary-color)
$default-header-colors: map.set($default-header-colors, h4, $quaternary-color)
// Initialize empty maps
$default-header-margins-sides: ()
$default-header-margins-vertical: ()
// Dynamically populate sides map
$default-header-margins-sides: map.set($default-header-margins-sides, h1, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h2, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h3, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h4, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h5, (left: 0, right: 0))
$default-header-margins-sides: map.set($default-header-margins-sides, h6, (left: 0, right: 0))
// Dynamically populate vertical map
$default-header-margins-vertical: map.set($default-header-margins-vertical, h1, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h2, (top: 1em, bottom: 0em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h3, (top: 0em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h4, (top: 0em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h5, (top: 1em, bottom: 0.5em))
$default-header-margins-vertical: map.set($default-header-margins-vertical, h6, (top: 1em, bottom: 0.5em))
// Fonts
$secondary-font: 'Kanit', sans-serif // Geometric and blocky sans-serif for headers
$primary-font: 'JetBrains Mono' // Thicker monospaced font for primary content

View file

@ -16,15 +16,21 @@ $tertiary-color: #7b8a4f // Olive green for tertiary elements
$quaternary-color: #b4b7b4 // Muted gray for highlights $quaternary-color: #b4b7b4 // Muted gray for highlights
$quinary-color: #d67474 // Subtle coral for accents $quinary-color: #d67474 // Subtle coral for accents
$code-background-color: #fdf6e3 // Warm beige for code blocks // Text
$code-text-color: #657b83 // Muted teal-gray for code text $text-color: $primary-color
$background-color: #fdfaf6 // Warm light beige for background
$code-text-color: #657b83 // Muted teal-gray for code text
$code-background-color: #fdf6e3 // Warm beige for code blocks
$code-border-color: #e6e6e6
$code-border-color: $quaternary-color
$note-color: $secondary-color
$note-background-color: #f6eee0 // Soft beige for note background $note-background-color: #f6eee0 // Soft beige for note background
$note-border-color: $quinary-color // Matches the coral accent $note-border-color: $quinary-color // Matches the coral accent
// Text $blockquote-color: $primary-color
$text-color: #4d4d4d // Rich dark gray for text $blockquote-border-color: $secondary-color
$background-color: #fdfaf6 // Warm light beige for background
// Links, Anchors // Links, Anchors
$anchor-color: color.adjust($primary-color, $lightness: 10%) $anchor-color: color.adjust($primary-color, $lightness: 10%)
@ -33,6 +39,8 @@ $toc-anchor-color: color.adjust($secondary-color, $lightness: -5%)
$toc-anchor-hover-color: color.adjust($secondary-color, $lightness: -10%) $toc-anchor-hover-color: color.adjust($secondary-color, $lightness: -10%)
// Tables // Tables
$table-color: $text-color
$table-header-color: $text-color
$table-header-bg: #ede0d1 // Light warm tan for table headers $table-header-bg: #ede0d1 // Light warm tan for table headers
$table-border-color: #cabfa5 // Soft brown-gray for borders $table-border-color: #cabfa5 // Soft brown-gray for borders