fixed pickup so it works with variables
This commit is contained in:
parent
5336cb4f90
commit
1ca31ec033
2 changed files with 77 additions and 215 deletions
|
|
@ -1,142 +0,0 @@
|
|||
@use "sass:map"
|
||||
@use "sass:color"
|
||||
@use 'variables' as *
|
||||
@use 'fonts' as fonts
|
||||
@use '../../../../../_share/media/sass/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)
|
||||
|
||||
/* Table of Contents Link */
|
||||
.toc
|
||||
font-weight: bold
|
||||
color: $primary-color
|
||||
|
||||
/* 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
|
||||
margin: 1em 0 1em 2em
|
||||
padding-left: $list-padding-left
|
||||
|
||||
ul
|
||||
list-style-type: disc
|
||||
|
||||
ol
|
||||
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
|
||||
font-family: $secondary-font
|
||||
font-weight: bold
|
||||
|
||||
h2 a
|
||||
&:hover
|
||||
text-decoration: none
|
||||
color: #ca9ca0
|
||||
|
||||
// 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-text-3
|
||||
margin-left: 1em
|
||||
|
||||
p
|
||||
margin-left: 1em
|
||||
|
||||
.outline-text-4
|
||||
margin-left: 1.5em
|
||||
|
||||
p
|
||||
margin-left: 1.5em
|
||||
|
||||
div#table-of-contents
|
||||
h2
|
||||
margin-left: 0
|
||||
text-transform: uppercase
|
||||
|
|
@ -1,79 +1,46 @@
|
|||
@use "sass:map"
|
||||
@use "sass:color"
|
||||
@use 'variables' as *
|
||||
@use 'fonts' as fonts
|
||||
@use '../../../../../_share/media/sass/mixins' as mixins-basic
|
||||
|
||||
// Colors for the theme
|
||||
$primary-color: #d10094 // Dark pink for headers
|
||||
$secondary-color: #5b8ee8 // Rich blue for secondary headers
|
||||
$tertiary-color: #228b22 // Dark green for subheaders
|
||||
$text-color: #f8f8f2 // Off-white for body text
|
||||
$background-color: #282a36 // Dark black-gray background
|
||||
|
||||
$link-color: #1e90ff // Dodger blue for links
|
||||
$link-hover-color: #e0006f// Vibrant pink for link hover
|
||||
@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)
|
||||
|
||||
$table-header-bg: #44475a // Steely blue for table headers
|
||||
$table-border-color: #6272a4 // Muted blue-gray for borders
|
||||
$code-bg-color: #1e1f29 // Very dark blue for code blocks
|
||||
$code-text-color: #f8f8f2 // Off-white for code text
|
||||
|
||||
// Fonts
|
||||
$primary-font: 'Fira Mono', monospace
|
||||
$secondary-font: 'Roboto', sans-serif
|
||||
|
||||
// Base styles
|
||||
body
|
||||
font-family: $primary-font
|
||||
font-size: 16px
|
||||
line-height: 1.6
|
||||
color: $text-color
|
||||
background-color: $background-color
|
||||
margin: 0 auto
|
||||
max-width: 800px
|
||||
padding: 1em
|
||||
|
||||
// Headers
|
||||
h1, h2, h3, h4, h5, h6
|
||||
font-family: $secondary-font
|
||||
/* Table of Contents Link */
|
||||
.toc
|
||||
font-weight: bold
|
||||
margin-top: 1.5em
|
||||
margin-bottom: 0.5em
|
||||
|
||||
h1
|
||||
font-size: 2.5em
|
||||
color: $primary-color
|
||||
|
||||
h2
|
||||
font-size: 2em
|
||||
color: $secondary-color
|
||||
|
||||
h3
|
||||
font-size: 1.5em
|
||||
color: $secondary-color
|
||||
|
||||
a
|
||||
/* Base Styles */
|
||||
body
|
||||
font-family: $primary-font
|
||||
font-size: 1em
|
||||
text-transform: uppercase
|
||||
line-height: 1.6
|
||||
|
||||
h4, h5, h6
|
||||
font-size: 1.2em
|
||||
color: lighten($text-color, 10%)
|
||||
color: $text-color
|
||||
background-color: $background-color
|
||||
|
||||
// Links
|
||||
margin: 0 auto
|
||||
max-width: 900px
|
||||
padding: 1em
|
||||
|
||||
/* Link Styles */
|
||||
a
|
||||
color: $link-color
|
||||
color: $anchor-color
|
||||
text-decoration: underline
|
||||
text-underline-offset: 2px
|
||||
&:hover
|
||||
color: $link-hover-color
|
||||
|
||||
// Paragraphs
|
||||
p
|
||||
margin-bottom: 1em
|
||||
&:hover
|
||||
color: $anchor-hover-color
|
||||
|
||||
// Lists
|
||||
ul, ol
|
||||
margin: 1em 0
|
||||
padding-left: 1.5em
|
||||
list-style-position: inside
|
||||
margin: 1em 0 1em 2em
|
||||
padding-left: $list-padding-left
|
||||
|
||||
ul
|
||||
list-style-type: disc
|
||||
|
|
@ -88,9 +55,11 @@ li
|
|||
blockquote
|
||||
border-left: 4px solid $secondary-color
|
||||
padding-left: 1em
|
||||
color: lighten($text-color, 10%)
|
||||
color: color.adjust($text-color, $lightness: 10%)
|
||||
margin: 1.5em 0
|
||||
|
||||
font-family: $secondary-font
|
||||
|
||||
// Tables
|
||||
table
|
||||
width: 100%
|
||||
|
|
@ -108,31 +77,66 @@ th
|
|||
color: $text-color
|
||||
|
||||
tr:nth-child(even)
|
||||
background-color: lighten($background-color, 5%)
|
||||
background-color: color.adjust($background-color, $lightness: 5%)
|
||||
|
||||
// Code Blocks
|
||||
/* Code Block Styles */
|
||||
pre, code
|
||||
background-color: $code-bg-color
|
||||
background-color: $code-background-color
|
||||
color: $code-text-color
|
||||
font-family: $primary-font
|
||||
|
||||
font-family: $secondary-font
|
||||
|
||||
border-radius: 4px
|
||||
padding: 0.5em
|
||||
display: block
|
||||
overflow-x: auto
|
||||
|
||||
pre
|
||||
padding: 1em
|
||||
// Section
|
||||
section
|
||||
margin-bottom: 2em
|
||||
|
||||
code.inline
|
||||
display: inline
|
||||
padding: 0.2em 0.4em
|
||||
border-radius: 3px
|
||||
/* Header Styles */
|
||||
h1, h2, h3, h4, h5, h6
|
||||
font-family: $secondary-font
|
||||
font-weight: bold
|
||||
|
||||
h2 a
|
||||
&:hover
|
||||
text-decoration: none
|
||||
color: #ca9ca0
|
||||
|
||||
// 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
|
||||
|
||||
// Postamble
|
||||
div#postamble
|
||||
border-top: 1px dashed $table-border-color
|
||||
border-top: 1px dashed $note-border-color
|
||||
margin-top: 2em
|
||||
padding-top: 1em
|
||||
color: lighten($text-color, 20%)
|
||||
color: color.adjust($note-border-color, $lightness: 20%)
|
||||
font-size: 0.9em
|
||||
|
||||
.outline-text-3
|
||||
margin-left: 1em
|
||||
|
||||
p
|
||||
margin-left: 1em
|
||||
|
||||
.outline-text-4
|
||||
margin-left: 1.5em
|
||||
|
||||
p
|
||||
margin-left: 1.5em
|
||||
|
||||
div#table-of-contents
|
||||
h2
|
||||
margin-left: 0
|
||||
text-transform: uppercase
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue