From f81a42045e29cc396af78b5d87ead874ba26fa18 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Mon, 22 May 2023 23:12:14 -0700 Subject: All Variables Easy Override --- sass/_colors.scss | 50 ++ sass/_font-extend-COPY-ME.sass | 19 - sass/_font-extend.sass | 35 - sass/_functions.scss | 122 ++++ sass/_includes.scss | 58 -- sass/_syntax.scss | 39 ++ sass/_variables.scss | 192 ------ sass/abridge-auto.scss | 20 - sass/abridge-dark.scss | 12 - sass/abridge-light.scss | 12 - sass/abridge.scss | 1407 +++++++++++++++++++++++++++++++++++++++- sass/colors/_blue.scss | 26 - sass/colors/_blueshade.scss | 26 - sass/colors/_orange.scss | 26 - sass/colors/_syntax.scss | 21 - sass/function/_font.sass | 28 - sass/include/_button.scss | 46 -- sass/include/_code.scss | 35 - sass/include/_document.scss | 39 -- sass/include/_embedded.scss | 32 - sass/include/_form.scss | 38 -- sass/include/_grid.scss | 15 - sass/include/_hr.scss | 15 - sass/include/_icons.scss | 134 ---- sass/include/_misc.scss | 15 - sass/include/_nav.scss | 135 ---- sass/include/_scroller.scss | 17 - sass/include/_search.scss | 78 --- sass/include/_sectioning.scss | 88 --- sass/include/_syntax.scss | 200 ------ sass/include/_table.scss | 29 - sass/include/_toc.scss | 50 -- sass/include/_top.scss | 31 - sass/include/_typography.scss | 144 ---- sass/include/_zola.scss | 68 -- 35 files changed, 1608 insertions(+), 1694 deletions(-) create mode 100644 sass/_colors.scss delete mode 100644 sass/_font-extend-COPY-ME.sass delete mode 100644 sass/_font-extend.sass create mode 100644 sass/_functions.scss delete mode 100644 sass/_includes.scss create mode 100644 sass/_syntax.scss delete mode 100644 sass/_variables.scss delete mode 100644 sass/abridge-auto.scss delete mode 100644 sass/abridge-dark.scss delete mode 100644 sass/abridge-light.scss delete mode 100644 sass/colors/_blue.scss delete mode 100644 sass/colors/_blueshade.scss delete mode 100644 sass/colors/_orange.scss delete mode 100644 sass/colors/_syntax.scss delete mode 100644 sass/function/_font.sass delete mode 100644 sass/include/_button.scss delete mode 100644 sass/include/_code.scss delete mode 100644 sass/include/_document.scss delete mode 100644 sass/include/_embedded.scss delete mode 100644 sass/include/_form.scss delete mode 100644 sass/include/_grid.scss delete mode 100644 sass/include/_hr.scss delete mode 100644 sass/include/_icons.scss delete mode 100644 sass/include/_misc.scss delete mode 100644 sass/include/_nav.scss delete mode 100644 sass/include/_scroller.scss delete mode 100644 sass/include/_search.scss delete mode 100644 sass/include/_sectioning.scss delete mode 100644 sass/include/_syntax.scss delete mode 100644 sass/include/_table.scss delete mode 100644 sass/include/_toc.scss delete mode 100644 sass/include/_top.scss delete mode 100644 sass/include/_typography.scss delete mode 100644 sass/include/_zola.scss (limited to 'sass') diff --git a/sass/_colors.scss b/sass/_colors.scss new file mode 100644 index 0000000..46a21db --- /dev/null +++ b/sass/_colors.scss @@ -0,0 +1,50 @@ +@mixin dark( + $f1: #ccc, + $f2: #ddd, + $c1: #111, + $c2: #222, + $c3: #333, + $c4: #888, + $a1: #f90, + $a2: #fb0, + $a3: #f90, + $cg: #593, + $cr: #e33 +) { + #{--f1}: $f1;// Font Color Primary (ccc) + #{--f2}: $f2;// Font Color Headers (ddd) + #{--c1}: $c1;// Background Color Primary (111) + #{--c2}: $c2;// Background Color Secondary (222) + #{--c3}: $c3;// Table Rows, Block quote edge, Borders (333) + #{--c4}: $c4;// Disabled Buttons, Borders, mark background (888) + #{--a1}: $a1;// link color (f90) + #{--a2}: $a2;// link hover/focus color (fb0) + #{--a3}: $a3;// link h1-h2 hover/focus color (f90) + #{--cg}: $cg;// ins green, success (593) + #{--cr}: $cr;// del red, errors (e33) +} +@mixin light( + $f1: #333, + $f2: #222, + $c1: #fff, + $c2: #eee, + $c3: #ddd, + $c4: #555, + $a1: #c40, + $a2: #e60, + $a3: #f90, + $cg: #373, + $cr: #d33 +) { + #{--f1}: $f1;// Font Color Primary (444) + #{--f2}: $f2;// Font Color Headers (333) + #{--c1}: $c1;// Background Color Primary (fff) + #{--c2}: $c2;// Background Color Secondary (eee) + #{--c3}: $c3;// Table Rows, Block quote edge, Borders (ddd) + #{--c4}: $c4;// Disabled Buttons, Borders, mark background (677) + #{--a1}: $a1;// link color (c40) + #{--a2}: $a2;// link hover/focus color (e60) + #{--a3}: $a3;// link h1-h2 hover/focus color (f90) + #{--cg}: $cg;// ins green, success (373) + #{--cr}: $cr;// del red, errors (d33) +} diff --git a/sass/_font-extend-COPY-ME.sass b/sass/_font-extend-COPY-ME.sass deleted file mode 100644 index 148f883..0000000 --- a/sass/_font-extend-COPY-ME.sass +++ /dev/null @@ -1,19 +0,0 @@ -// This abridge theme extension allows you to append custom fonts to font-family of the: - // main font 'html' ('--ff' theme css variable in '_document.scss') - // code font 'pre','code','kbd','samp','tt','var' ('--fm' theme css variable in '_code.scss' ) -// copy this file to your 'sass' folder: - // either: remove the leading '_' and add 'font-extend-COPY-ME.css' to your 'stylesheets' in 'config.toml' - // or : import it with '@use "_font-extend-COPY-ME"' in whatever existing sass file you already load - -// delete the following two lines if you want to prepend your fonts... -$findFont-Main : "Segoe UI" // ← append custom MAIN font(s) AFTER this (full list @ '_variables.scss') -$findFont-Code : "Segoe UI Mono" // ← append custom CODE font(s) AFTER this -$fontExt-Main : ("MAIN FONT 1", "MAIN FONT 2") // list of custom MAIN font(s) to append -$fontExt-Code : ("CODE FONT 1", "CODE FONT 2") // list of custom CODE font(s) to append - -// ...and delete the corresponding variables ↓ -@use "../themes/abridge/sass/font-extend" with($findFont-Main:$findFont-Main, $findFont-Code:$findFont-Code,$fontExt-Main:$fontExt-Main,$fontExt-Code:$fontExt-Code) -// check ↑ relative path if you copy this file to some other location - -:root - @include font-extend.font-root diff --git a/sass/_font-extend.sass b/sass/_font-extend.sass deleted file mode 100644 index 9c612c4..0000000 --- a/sass/_font-extend.sass +++ /dev/null @@ -1,35 +0,0 @@ -@use "sass:meta" -@use "variables" as var -@use "function/font" as f - -$findFont-Main : null !default -$findFont-Code : null !default -$fontExt-Main : null !default -$fontExt-Code : null !default - -$typeMain : meta.type-of($fontExt-Main) -$typeCode : meta.type-of($fontExt-Code) - -@if ($typeMain == 'string') or ($typeMain == 'list') - @if ($findFont-Main == null) // prepend - var.$font : f.font-prepend(var.$font, $fontExt-Main) - @else // append - $iFoundFont-Main : index(var.$font , $findFont-Main) - @if $iFoundFont-Main - var.$font : f.font-append( var.$font, $fontExt-Main, $findFont-Main) - @else - @debug "⚠ Failed to find font '#{$findFont-Main}' in the list of '#{var.$font}'" - -@if ($typeMain == 'string') or ($typeMain == 'list') - @if ($findFont-Code == null) // prepend - var.$font-mono : f.font-prepend(var.$font-mono, $fontExt-Code) - @else // append - $iFoundFont-Code : index(var.$font-mono , $findFont-Code) - @if $iFoundFont-Code - var.$font-mono : f.font-append( var.$font-mono, $fontExt-Code, $findFont-Code) - @else - @debug "⚠ Failed to find font '#{$findFont-Code}' in the list of '#{var.$font-mono}'" - -@mixin font-root - #{--ff}: var.$font - #{--fm}: var.$font-mono //code diff --git a/sass/_functions.scss b/sass/_functions.scss new file mode 100644 index 0000000..13fd8be --- /dev/null +++ b/sass/_functions.scss @@ -0,0 +1,122 @@ +@use "sass:meta"; +@use "sass:list"; + +@function remove($list, $value, $recursive:false) { + $result: (); + @for $i from 1 through length($list) { + @if type-of(nth($list, $i)) == list and $recursive { + $result: append($result, remove(nth($list, $i), $value, $recursive), $separator: comma); + } @else if nth($list, $i) != $value { + $result: append($result, nth($list, $i), $separator: comma); + } + } + @return $result; +} + +@function font-append($base, $ext, $separator:comma) { + $base-pre: (); + $base-pos: (); + $iFontSep: index($base, $separator); + @if not $iFontSep {// didn't find the font separator, return + @debug "⚠ Failed to find '#{$separator}' in the list of '#{$base}'"; + @return $base; + } + @for $i from 1 through list.length($base) { + $iEl: list.nth($base, $i); + @if $i <= $iFontSep { + $base-pre: list.append($base-pre, $iEl, $separator:comma); + } @else { + $base-pos: list.append($base-pos, $iEl, $separator:comma); + } + } + @return list.join(list.join($base-pre, $ext), $base-pos); +} + +@function font-prepend($base, $ext) { + $ext-type: meta.type-of($ext); + @if not ($ext-type == 'string') and not ($ext-type == 'list') { + //@debug "⚠ Expected a string or a list, but got '#{$ext-type}' in '#{$ext}'"; + @return $base; + } @else { + @return list.join($ext, $base); + } +} + +@function font-var($base, $ext, $findFont:null) { + $typeFont: meta.type-of($base); + + @if ($typeFont == 'string') or ($typeFont == 'list') { + @if ($findFont == null) {// prepend + $font: font-prepend($base, $ext); + @return $font; + } @else { // append + $iFoundFont-Main: index($base, $findFont); + @if $iFoundFont-Main { + $font: font-append($base, $ext, $findFont); + @return $font; + } @else { + @debug "⚠ Failed to find font '#{$findFont}' in the list of '#{$base}'"; + } + } + } +} + +@function icon($icon-name,$stroke,$stroke-width:1,$fill:'none',$ic) { + $sc:"%23888";//stroke color + @if $ic { + $sc: $stroke + } + $p: ( + 's': $sc, + 'sw': $stroke-width, + 'f': $fill + ); + $icons: ( + //template-fill: "%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d=''/%3E%3C/svg%3E", + //template-stroke: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d=''/%3E%3C/svg%3E", + bitbucket: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M14.2 15.3H9.8L8.7 8.7h6.6ZM2.8 3.2A.7.7 0 0 0 2 4l3.4 16c.1.4.6.8 1 .8h11a.7.7 0 0 0 .6-.6l4-16.1a.7.7 0 0 0-.7-.9Z'/%3E%3C/svg%3E", + buymeacoffee: "%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='#{map-get($p, f)}' d='m7.9 11.7.8 8.3c.2 2 .8 2 3.6 2 2.3 0 2.8-.1 3-2l.8-9.3c-3.3-1-4 2-8.2 1z'/%3E%3Cpath fill='#{map-get($p, s)}' d='M18.8 4.3c-.6-.1-.6-1-.7-1.9-.2-1.6-1.2-2-4-2.2-3-.4-8.6-.2-8.5 1.6 0 1.7 4.8 2.2 9.7 1.6.8-.1.6-1.5-.2-1.4-3.6.5-7.4 0-7.4-.2 0-.3 3.3-.5 5-.4 4.5.3 3.7.3 4.2 2.2.2 1 0 .9-.7 1-3 .3-6 .2-9-.2C4.7 4 4.3 4.4 4 6c-.8 2.7 1 2.8 2.1 3 4.8.7 7.7.3 10.3.2.8-.1.6.5.6 1.2l-1.3 10.8c-.1 1.4-1.4 1.4-4 1.5-2.7.2-3.3-.5-3.5-1.6L7.1 10c-.1-1-1.5-.6-1.4.3l1.1 10.8C7.1 24 9.4 24 12.2 24c2.6 0 4.6-.3 5-3.2l1-11.3c.2-.9.3-.7 1-.9 1.8-.8 1-4.2-.4-4.3zm-.3 3a38 38 0 0 1-12.6.2c-1.4-.2-.9-2 0-1.9 4.5.7 8.7.7 12 0 1.4-.2 1.1 1.7.6 1.8z' /%3E%3C/svg%3E", + check: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E", + chevron: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E", + clock: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E", + codeberg: "%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='#{map-get($p, f)}' d='M12 1A11 11 0 0 0 1 12a11 11 0 0 0 1.7 6.4L12 6l9.3 12.4A11 11 0 0 0 23 12 11 11 0 0 0 12 1Z'/%3E%3Cpath fill='#{map-get($p, s)}' d='M21.3 18.4 12 6l4.4 16.8a11 11 0 0 0 4.9-4.4Z' /%3E%3C/svg%3E", + date: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cpath d='M16 2v4M8 2v4m-5 4h18'/%3E%3C/svg%3E", + discord: "%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M19.7 5.6a18.2 18.2 90 0 0-4.6-1.4 12.5 12.5 90 0 0-.6 1.2 17 17 90 0 0-5 0 12.5 12.5 90 0 0-.6-1.2 18.4 18.4 90 0 0-4.6 1.4A20 20 0 0 0 1 18a18.4 18.4 90 0 0 5.7 2.9 13.5 13.5 90 0 0 1.2-2A11.8 11.8 90 0 1 6 18l.5-.3a13.2 13.2 90 0 0 11 0l.5.3a12 12 90 0 1-1.9.9 13.3 13.3 90 0 0 1.2 2A18.2 18.2 90 0 0 23 18c.3-4.7-.9-8.8-3.3-12.4Zm-11.4 10c-1 0-1.9-1-1.9-2.2s.8-2.2 1.9-2.2 2 1 2 2.2-1 2.2-2 2.2Zm7.4 0c-1.1 0-2-1-2-2.2s.9-2.2 2-2.2 1.9 1 1.9 2.2-.9 2.2-1.9 2.2Z'/%3E%3C/svg%3E", + docker: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M4 19.8S7 20 8 18m-4-7h3v3H4Zm3 0h3v3H7Zm3 0h3v3h-3ZM7 8h3v3H7Zm3 0h3v3h-3Zm0-3h3v3h-3Zm10 8c-1 0-1 0-1.4-1.9C18.5 10 17 10 17 12c0 1 0 2-3 2H1a9 9 0 0 0 3 6c3 2 5 2 9 1a10.8 10.8 90 0 0 5-4c1-2 1-1 3-2s1-2 0-2Z'/%3E%3C/svg%3E%0A", + element: "%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C5 0 0 6 0 12s6 12 12 12 12-6 12-12A12 12 0 0 0 12 0Zm-1 4c4 0 6 3 6 6 0 2-2 2-2 0s-2-4-4-4-2-2 0-2Zm-7 9c0-4 3-6 6-6 2 0 2 2 0 2s-4 2-4 4-2 2-2 0Zm9 7c-4 0-6-3-6-6 0-2 2-2 2 0s2.4 4 4 4c2 0 2 2 0 2Zm1-3c-2 0-2-2 0-2s4-2 4-4 2-2 2 0c0 4-3 6-6 6Z'/%3E%3C/svg%3E", + facebook: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z'/%3E%3C/svg%3E", + folder: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z'/%3E%3C/svg%3E", + github: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M9 19c-5 1.5-5-2.5-7-3m14 6v-3.9a3.4 3.4 0 0 0-1-2.6c3.2-.3 6.5-1.5 6.5-7A5.4 5.4 0 0 0 20 4.8 5 5 0 0 0 20 1s-1.3-.3-4 1.5a13.4 13.4 0 0 0-7 0C6.3.6 5 1 5 1a5 5 0 0 0 0 3.8 5.4 5.4 0 0 0-1.5 3.7c0 5.5 3.3 6.7 6.4 7a3.4 3.4 0 0 0-.9 2.6V22'/%3E%3C/svg%3E", + github-sponsor: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M20 4c-5-3-8 2-8 4 0-2-3-7-8-4-4 2-6 10 8 18 14-8 12-16 8-18z'/%3E%3C/svg%3E", + gitlab: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M22.6 14.4 12 22 1.3 14.4a.8.8 0 0 1-.3-1l1.3-3.7 2.4-7.5a.4.4 0 0 1 .1-.2.4.4 0 0 1 .6 0 .4.4 0 0 1 .1.2L8 9.7h8l2.5-7.5a.4.4 0 0 1 .1-.2.4.4 0 0 1 .6 0 .4.4 0 0 1 0 .2l2.5 7.5 1.3 3.8a.8.8 0 0 1-.3.9z'/%3E%3C/svg%3E", + globe: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E", + home: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M9 22V12h6v10M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z'/%3E%3C/svg%3E", + instagram: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Crect x='2' y='2' width='20' height='20' rx='5' ry='5'/%3E%3Cpath d='M16 11.4A4 4 0 1 1 12.6 8a4 4 0 0 1 3.4 3.4zm1.5-4.9h.01'/%3E%3C/svg%3E", + linkedin: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6zM2 9h4v12H2z'/%3E%3Ccircle cx='4' cy='4' r='2'/%3E%3C/svg%3E", + mail: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m22 6-10 7L2 6m2-2h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6c0-1.1.9-2 2-2Z'/%3E%3C/svg%3E", + mastodon: "%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M2 8c0 5.7-.2 12.6 5 14 2 .6 3.7.7 5 .6 2.4-.1 3.8-.9 3.8-.9l-.1-1.8s-1.7.6-3.7.5c-1.9 0-4-.2-4.2-2.6a5 5 90 0 1 0-.7c4 1 7.5.5 8.4.4 2.7-.4 5-2 5.3-3.6.5-2.4.4-5.8.4-5.8C22 3.4 19 2 19 2 15.9.6 8 .6 5.1 2c0 0-3 1.4-3 6zm4.5-2.3c1.2-1.4 3.8-1.5 5 .3l.5.9.6-1c1.1-1.7 3.7-1.6 4.9-.2 1.1 1.3.9 2.5.9 8.4H16V8.6c0-2.4-3-2.5-3 .3v3h-2V9c0-2.8-3-2.7-3-.3V14H5.6c0-5.9-.2-7.1 1-8.4z'/%3E%3C/svg%3E", + matrix: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M.6.6v22.8H3v.6H0V0h3v.6zm7 7.2V9h.1c3.2-2.3 4.3 0 4.8.3C14.9 6.7 18 8 18 11v5h-1.5v-5a1 1 0 0 0-3.5 0v5h-1.7v-5a1 1 0 0 0-3.7 0v5H6V7.8zm15.8 15.7V.4H21V0h3v24h-3v-.6z'/%3E%3C/svg%3E", + minus: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E", + moon: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z'/%3E%3C/svg%3E", + pinterest: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m8 20 4-9m-1.3 3c.4 1.3 1.4 2 2.5 2 2.1 0 3.8-1.6 3.8-4a5 5 0 1 0-9.7 1.7'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E", + python: "%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='#{map-get($p, f)}' d='M17 6c0 4-1 5-6 5-4 0-5 1-5 6-4 0-5-1-5-6 0-3 1-4.5 4-4.5h7c0-.5 0-.5-1-.5H6c0-3 0-5 6-5 5 0 5 2 5 5ZM9 3C7.5 3 7.5 5 9 5s1.5-2 0-2Z'/%3E%3Cpath fill='#{map-get($p, s)}' d='M23 12c0 3-1 4.6-4 4.5h-7v.5h6c0 4 0 6-6 6-5 0-5-2-5-6s1-5 6-5c4 0 5-1 5-6 4 0 5 1 5 6Zm-8 7c-1.5 0-1.5 2 0 2s1.5-2 0-2Z' /%3E%3C/svg%3E", + researchgate: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M16 5c0 3.5.7 5 3 5s3.7-1.3 3.3-5h-3v1.3H21c0 1.9-.7 2.7-2 2.5-1.3 0-1.8-.7-1.8-3.2 0-2.4.4-3.3 1.5-3.4 1-.2 1.7.2 2.2 1.1L22 3c-.4-1.3-1.4-2-2.9-2C17.2 1 16 2 16 5ZM8 6.2l-6 .2v.9c1 .3 2 0 2 2.2v11C4 22 3 22 2 22.2v.8h6.6v-.8C7 22 6 22 6 20.5v-5.2h2a46 46 0 0 0 4 5.7 5 5 0 0 0 5 2v-1c-3 0-5-5-7-7 6-1 6-10-2-8.8ZM6 14V7.6C14 6 13 14 8 14Z'/%3E%3C/svg%3E", + rss: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M4 11a9 9 0 0 1 9 9M4 4a16 16 0 0 1 16 16'/%3E%3Ccircle cx='5' cy='19' r='1'/%3E%3C/svg%3E", + stack: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M4 17v1a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-1M8 16h8m-7.7-3.4 8 .8M8.8 9.2l7.8 1.6m-6.5-5 7.6 2.4'/%3E%3C/svg%3E", + sun: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Cpath d='M12 1v2m0 18v2M4.2 4.2l1.4 1.4m12.8 12.8 1.4 1.4M1 12h2m18 0h2M4.2 19.8l1.4-1.4M18.4 5.6l1.4-1.4'/%3E%3C/svg%3E", + tag: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m20.6 13.4-7.2 7.2a2 2 0 0 1-2.8 0L2 12V2h10l8.6 8.6a2 2 0 0 1 0 2.8zM7 7h.01'/%3E%3C/svg%3E", + twitch: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M21 2H3v16h5v4l4-4h5l4-4V2zm-10 9V7m5 4V7'/%3E%3C/svg%3E", + twitter: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M23 3a10.9 10.9 0 0 1-3.1 1.5 4.5 4.5 0 0 0-7.9 3v1A10.7 10.7 0 0 1 3 4s-4 9 5 13a11.6 11.6 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0 0-.8A7.7 7.7 0 0 0 23 3z'/%3E%3C/svg%3E", + x: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M21 3 3 21M3 3l18 18'/%3E%3C/svg%3E", + youtube: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m9.8 15 5.7-3.3-5.8-3.2V15Zm12.7-8.6a2.8 2.8 0 0 0-1.9-2C18.9 4 12 4 12 4s-6.9 0-8.6.5a2.8 2.8 0 0 0-2 2 29 29 0 0 0-.4 5.3 29 29 0 0 0 .5 5.3A2.8 2.8 0 0 0 3.4 19c1.7.5 8.6.5 8.6.5s6.9 0 8.6-.5a2.8 2.8 0 0 0 2-2 29 29 0 0 0 .4-5.3 29 29 0 0 0-.5-5.3z'/%3E%3C/svg%3E", + adjust: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C6 0 0 6 0 12s5 12 12 12 12-5 12-12S19 0 12 0Zm0 4c5 0 8 3 8 8s-3 8-8 8V4Z'/%3E%3C/svg%3E", + angl: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m16 4-8 8 8 8'/%3E%3C/svg%3E", + angll: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m11 4-8 8 8 8m9-16-8 8 8 8'/%3E%3C/svg%3E", + angr: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m8 4 8 8-8 8'/%3E%3C/svg%3E", + angrr: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m4 4 8 8-8 8m9-16 8 8-8 8'/%3E%3C/svg%3E", + angu: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m4 16 8-8 8 8'/%3E%3C/svg%3E", + search: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Ccircle cx='9.5' cy='9.5' r='8'/%3E%3Cpath d='m23 23-9-9'/%3E%3C/svg%3E" + ); + $icon: map-get($icons, $icon-name); + @return url("data:image/svg+xml,#{$icon}"); +} diff --git a/sass/_includes.scss b/sass/_includes.scss deleted file mode 100644 index 812f8d1..0000000 --- a/sass/_includes.scss +++ /dev/null @@ -1,58 +0,0 @@ -/** - * Forked from Bamboo: https://github.com/rilwis/bamboo (MIT) - * which was forked from new.css (MIT) - * Supplemented code from Pico.css: https://github.com/picocss/pico (MIT) - * Supplemented code from Basic.css: https://github.com/vladocar/Basic.css (MIT) - * Supplemented code from AttriCSS: https://github.com/raj457036/attriCSS (MIT) - * Feather Icons: https://github.com/feathericons/feather (MIT) - * Tabler Icons: https://github.com/tabler/tabler-icons/find/master (MIT) - * - * Bamboo, New, Pico: based on Normalize.css & Sanitize.css - * Normalize: https://github.com/necolas/normalize.css (MIT) - * Sanitize: https://github.com/csstools/sanitize.css (CC0 1.0 Universal) - */ - -// Config -@forward "variables" as var-*; - -@forward "colors/orange" as colors-*; -//@forward "colors/blue" as colors-*; -//@forward "colors/blueshade" as colors-*; - -@forward "colors/syntax" as syntax-*; - -//@use "fonts/Roboto"; -//@use "fonts/Roboto-Mono"; // Monospaced -//@use "fonts/Arimo"; -//@use "fonts/FiraCode"; // Monospaced -//@use "fonts/Abridge"; // Icon Font (don't recommend, CSS only icons are in my opinion better.) - -// Includes - Sorted by importance/category (includes at top are needed most frequently) -@use "include/document"; // html -@use "include/typography"; // a, headings, p, ul, blockquote, ... -@use "include/sectioning"; // body, header, main, footer -@use "include/nav"; // Nav - -@use "include/embedded"; // iframe(youtube/vimeo), audio, canvas, img, svg, video -@use "include/table"; // table, tr, td, ... -@use "include/code"; // pre, code, ... -@use "include/hr"; // hr - -@use "include/scroller"; // figure -@use "include/button"; // button, a[role=button], type=button, type=submit ... -@use "include/form"; // input, select, textarea, label, fieldset, legend (If you use this, you should also use button) -@use "include/top"; // back to top button using only CSS - -@use "include/syntax"; // syntax highlighting for code - -@use "include/search"; // Zola Search - elasticlunr site-wide search -@use "include/toc"; // Zola TOC - Table of Content Menu (recent posts & index), sticky (floats top right) - -@use "include/icons"; // svg icons - -@use "include/zola"; // Zola spacing and layout classes - - - -//@use "include/grid"; // section infinite grid -- test/rework this similar to hnav and milligram in that it should collapse to a single column as the page becomes narrow -//@use "include/misc"; // template, [hidden], dialog, canvas diff --git a/sass/_syntax.scss b/sass/_syntax.scss new file mode 100644 index 0000000..0f822d7 --- /dev/null +++ b/sass/_syntax.scss @@ -0,0 +1,39 @@ +// Syntax Highlighting +@mixin dark( + $bg: #191919, + $h1: #e65, + $h2: #f91, + $h3: #eb6, + $h4: #ac3, + $h5: #8db, + $h6: #6ae, + $h7: #d6e +) { + #{--bg}: $bg;// background color + #{--h1}: $h1;// red, support function + #{--h2}: $h2;// orange, punctuation, constant, variable, json-key + #{--h3}: $h3;// tan, entity/function name + #{--h4}: $h4;// green, string + #{--h5}: $h5;// teal, escape character + #{--h6}: $h6;// blue, declaration, tag, property + #{--h7}: $h7;// purple, operators +} +@mixin light( + $bg: #f7f7f7, + $h1: #a21, + $h2: #930, + $h3: #a50, + $h4: #350, + $h5: #286, + $h6: #059, + $h7: #a3c +) { + #{--bg}: $bg;// background color + #{--h1}: $h1;// red, support function + #{--h2}: $h2;// orange, punctuation, constant, variable, json-key + #{--h3}: $h3;// tan, entity/function name + #{--h4}: $h4;// green, string + #{--h5}: $h5;// teal, escape character + #{--h6}: $h6;// blue, declaration, tag, property + #{--h7}: $h7;// purple, operators +} diff --git a/sass/_variables.scss b/sass/_variables.scss deleted file mode 100644 index a45495a..0000000 --- a/sass/_variables.scss +++ /dev/null @@ -1,192 +0,0 @@ -/** - * Forked from Bamboo: https://github.com/rilwis/bamboo (MIT) - * which was forked from new.css (MIT) - * Supplemented code from Pico.css: https://github.com/picocss/pico (MIT) - * Supplemented code from Basic.css: https://github.com/vladocar/Basic.css (MIT) - * Supplemented code from AttriCSS: https://github.com/raj457036/attriCSS (MIT) - * Feather Icons: https://github.com/feathericons/feather (MIT) - * Tabler Icons: https://github.com/tabler/tabler-icons/find/master (MIT) - * - * Bamboo, New, Pico: based on Normalize.css & Sanitize.css - * Normalize: https://github.com/necolas/normalize.css (MIT) - * Sanitize: https://github.com/csstools/sanitize.css (CC0 1.0 Universal) - */ - -// Config -// –––––––––––––––––––– - -// Enable
,
,