updated a bunch of themes, as well as categories. added the social category
This commit is contained in:
parent
2d4194d958
commit
094a1277b6
12 changed files with 453 additions and 68 deletions
|
|
@ -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
|
||||||
|
|
|
||||||
|
|
@ -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
|
||||||
|
|
|
||||||
|
|
@ -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
98
categories/social.sass
Normal 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
|
||||||
|
|
@ -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
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -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
81
themes/chroma-sepia.sass
Normal 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
|
||||||
|
|
@ -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
|
||||||
|
|
||||||
|
|
|
||||||
82
themes/mint-chockolate.sass
Normal file
82
themes/mint-chockolate.sass
Normal 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
|
||||||
|
|
||||||
|
|
@ -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
75
themes/sandy-peach.sass
Normal 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
|
||||||
|
|
||||||
|
|
@ -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
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue