1
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-09-18 13:25:32 -04:00

move dark mode code from module back to here for now

This commit is contained in:
2021-12-01 14:43:22 -05:00
parent a3c2bbcab0
commit 6f6de426da
9 changed files with 106 additions and 70 deletions

View File

@@ -34,7 +34,3 @@ $font-stack-mono-variable: list.join($webfont-mono-variable, $system-fonts-mono)
// Fancy link underline settings:
$link-underline-opacity: 40%;
$link-underline-size: 2px;
// Default fading style when switching between light/dark themes:
$theme-transition-duration: 0.15s;
$theme-transition-function: linear;

View File

@@ -5,18 +5,7 @@
// Takes a map of CSS properties and theme keys (see below) and set both body.light and body.dark selectors.
// ex. @include themes.themed((color: "text", background-color: "background-inner"));
// Also accepts additional transitions (in shorthand) to tack on.
@mixin themed($properties, $moreTransitions: ()) {
// generate CSS transition shorthand for each themed property w/ default duration and function
$defaults: ();
@each $property, $color in $properties {
$shorthand: $property settings.$theme-transition-duration settings.$theme-transition-function;
$defaults: list.append($defaults, $shorthand);
}
// list all transitions separated by commas (with additional shorthand(s) passed in)
transition: list.join($moreTransitions, $defaults, $separator: comma);
@mixin themed($properties) {
// keep track of the original selector(s) calling this mixin for below
$selectors: #{&};