From d603f0ab1fce32fb128f613ee9844c212ab2a40b Mon Sep 17 00:00:00 2001 From: Stefano Pigozzi Date: Thu, 25 May 2023 01:20:38 +0200 Subject: [PATCH] v9 (#64) * Work on improving examples * Fix toggles * Create the `unpkgTargets` and `yarnTargets` variables * Allow interaction again * Add media screen to color rules * Configure default colors and fonts * Configure panel min-width in the example page * Remove the need for a examples index.css * Place selectorsets in the same chapter as rulesets * Rework images and build script * Tweak todo rendering * Do not bother styling range * Create layouts and fix bold code * Update text and readme --- .idea/inspectionProfiles/Project_Default.xml | 2 +- README.md | 39 +- dist/_build.sh => _build.sh | 7 + dist/base.module.css | 201 +++++++- dist/base.module.less | 1 + dist/base.module.min.css | 2 +- dist/base.root.css | 201 +++++++- dist/base.root.less | 1 + dist/base.root.min.css | 2 +- dist/classic.module.less | 1 + dist/classic.root.less | 1 + dist/colors-amber.module.css | 118 ++--- dist/colors-amber.module.less | 1 + dist/colors-amber.module.min.css | 2 +- dist/colors-amber.root.css | 118 ++--- dist/colors-amber.root.less | 1 + dist/colors-amber.root.min.css | 2 +- dist/colors-pixeldawn.module.css | 188 ++++---- dist/colors-pixeldawn.module.less | 1 + dist/colors-pixeldawn.module.min.css | 2 +- dist/colors-pixeldawn.root.css | 188 ++++---- dist/colors-pixeldawn.root.less | 1 + dist/colors-pixeldawn.root.min.css | 2 +- dist/colors-purplestar.module.css | 118 ++--- dist/colors-purplestar.module.less | 1 + dist/colors-purplestar.module.min.css | 2 +- dist/colors-purplestar.root.css | 118 ++--- dist/colors-purplestar.root.less | 1 + dist/colors-purplestar.root.min.css | 2 +- dist/colors-royalblue.module.css | 118 ++--- dist/colors-royalblue.module.less | 1 + dist/colors-royalblue.module.min.css | 2 +- dist/colors-royalblue.root.css | 118 ++--- dist/colors-royalblue.root.less | 1 + dist/colors-royalblue.root.min.css | 2 +- dist/fonts-fira-ghpages.module.less | 1 + dist/fonts-fira-ghpages.root.less | 1 + dist/fun.module.less | 1 + dist/fun.root.less | 1 + dist/glass.module.css | 7 - dist/glass.module.less | 1 + dist/glass.module.min.css | 2 +- dist/glass.root.css | 7 - dist/glass.root.less | 1 + dist/glass.root.min.css | 2 +- dist/layouts-center.module.less | 1 + dist/layouts-center.root.less | 1 + dist/layouts-flex.module.css | 23 + dist/layouts-flex.module.less | 11 + dist/layouts-flex.module.min.css | 1 + dist/layouts-flex.root.css | 23 + dist/layouts-flex.root.less | 11 + dist/layouts-flex.root.min.css | 1 + examples/index.css | 7 - examples/index.html | 229 +++++---- examples/index.js | 451 +++++++++++------- .../1366.jpg | Bin 0 -> 337323 bytes .../1920.jpg | Bin 0 -> 640930 bytes .../360.jpg | Bin 0 -> 45109 bytes .../3840.jpg | Bin 0 -> 2455720 bytes .../640.jpg | Bin 0 -> 98195 bytes .../full.jpg | Bin .../1366.jpg | Bin 0 -> 461712 bytes .../1920.jpg | Bin 0 -> 835726 bytes .../360.jpg | Bin 0 -> 43182 bytes .../3840.jpg | Bin 0 -> 2469275 bytes .../640.jpg | Bin 0 -> 114968 bytes .../full.jpg | Bin .../1366.jpg | Bin 0 -> 140161 bytes .../1920.jpg | Bin 0 -> 278857 bytes .../360.jpg | Bin 0 -> 12893 bytes .../3840.jpg | Bin 0 -> 1286676 bytes .../640.jpg | Bin 0 -> 32830 bytes .../full.jpg | Bin .../viktya-pixeldawn/full.png | Bin media/icon.png | Bin 0 -> 6776 bytes media/screenshot-1.png | Bin 1684161 -> 1368530 bytes media/screenshot-2.png | Bin 0 -> 460566 bytes package.json | 2 +- src/mixins/bg.less | 42 ++ src/rulesets/base.less | 91 +++- src/rulesets/colors/colors-amber.less | 50 +- src/rulesets/colors/colors-pixeldawn.less | 100 ++-- src/rulesets/colors/colors-purplestar.less | 44 +- src/rulesets/colors/colors-royalblue.less | 43 +- src/rulesets/glass.less | 13 - src/rulesets/layouts/layouts-flex.less | 27 ++ src/selectorsets/module.less | 5 + src/selectorsets/root.less | 5 + 89 files changed, 1821 insertions(+), 950 deletions(-) rename dist/_build.sh => _build.sh (94%) create mode 100644 dist/layouts-flex.module.css create mode 100644 dist/layouts-flex.module.less create mode 100644 dist/layouts-flex.module.min.css create mode 100644 dist/layouts-flex.root.css create mode 100644 dist/layouts-flex.root.less create mode 100644 dist/layouts-flex.root.min.css delete mode 100644 examples/index.css create mode 100644 images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1366.jpg create mode 100644 images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1920.jpg create mode 100644 images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/360.jpg create mode 100644 images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/3840.jpg create mode 100644 images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/640.jpg rename examples/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited.jpg => images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/full.jpg (100%) create mode 100644 images/fabrice-nerfin-puHQJZd3MDg-unsplash/1366.jpg create mode 100644 images/fabrice-nerfin-puHQJZd3MDg-unsplash/1920.jpg create mode 100644 images/fabrice-nerfin-puHQJZd3MDg-unsplash/360.jpg create mode 100644 images/fabrice-nerfin-puHQJZd3MDg-unsplash/3840.jpg create mode 100644 images/fabrice-nerfin-puHQJZd3MDg-unsplash/640.jpg rename examples/fabrice-nerfin-puHQJZd3MDg-unsplash.jpg => images/fabrice-nerfin-puHQJZd3MDg-unsplash/full.jpg (100%) create mode 100644 images/kazuend-2KXEb_8G5vo-edited-unsplash/1366.jpg create mode 100644 images/kazuend-2KXEb_8G5vo-edited-unsplash/1920.jpg create mode 100644 images/kazuend-2KXEb_8G5vo-edited-unsplash/360.jpg create mode 100644 images/kazuend-2KXEb_8G5vo-edited-unsplash/3840.jpg create mode 100644 images/kazuend-2KXEb_8G5vo-edited-unsplash/640.jpg rename examples/kazuend-2KXEb_8G5vo-unsplash-edited.jpg => images/kazuend-2KXEb_8G5vo-edited-unsplash/full.jpg (100%) rename examples/pixeldawn-viktya.png => images/viktya-pixeldawn/full.png (100%) create mode 100644 media/icon.png create mode 100644 media/screenshot-2.png create mode 100644 src/mixins/bg.less create mode 100644 src/rulesets/layouts/layouts-flex.less diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml index 6612e86..ce4d5b5 100644 --- a/.idea/inspectionProfiles/Project_Default.xml +++ b/.idea/inspectionProfiles/Project_Default.xml @@ -54,7 +54,7 @@ - + diff --git a/README.md b/README.md index 34ea3ec..80a8172 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,38 @@ -# Bluelib +
-Customizable, flexible and modular CSS library +# ![](media/icon.png)
Bluelib -\[ [**Demo + Documentation**](https://gh.steffo.eu/bluelib/examples/index.html) | [**npm**](https://www.npmjs.com/package/@steffo/bluelib) \] +Customizable, flexible and modular CSS library. -![Screenshot](media/screenshot-1.png) +
-_Background image is [**Nebula Galaxy Photo** by Fabrice Nerfin on Unsplash](https://unsplash.com/photos/puHQJZd3MDg)._ +## Links + +[![Demo](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fbluelib.steffo.eu%2Fexamples%2Findex.html)](https://img.shields.io/website?label=demo&url=https%3A%2F%2Fbluelib.steffo.eu%2Fexamples%2Findex.html) +  +[![On NPM](https://img.shields.io/npm/v/@steffo/bluelib)](https://www.npmjs.com/package/@steffo/bluelib) +  +[![Chat](https://img.shields.io/matrix/bluelib:ryg.one?server_fqdn=matrix.ryg.one)](https://matrix.to/#/#bluelib:ryg.one) + +## Screenshots + +![Screenshot of the Royal Blue color theme](media/screenshot-1.png) +![Screenshot of the Pixel Dawn color theme](media/screenshot-2.png) + +## Credits + +### Royal Blue + +- Background image: [**Nebula galaxy photo** by Fabrice Nerfin on Unsplash](https://unsplash.com/photos/puHQJZd3MDg) + +### Gestione Amber + +- Background image: [**Brown coffee beans on brown wooden table photo** by Anastasiia Chepinska on Unsplash](https://unsplash.com/photos/lcfH0p6emhw) + +### Pixel Dawn + +- Background image: **Pixel Dawn** by [Viktya](https://viktya.github.io) (original) + +### Purple Star + +- Background image: [**Calm body of water near alp mountains during nighttime photo** by kazuend on Unsplash](https://unsplash.com/photos/2KXEb_8G5vo) diff --git a/dist/_build.sh b/_build.sh similarity index 94% rename from dist/_build.sh rename to _build.sh index 1058855..c5c6e17 100755 --- a/dist/_build.sh +++ b/_build.sh @@ -1,6 +1,12 @@ #!/bin/bash # Maybe a Makefile would be better... +origin=$(pwd) +cd "dist" + +echo "Cleaning dist:" * +rm -I * + echo "Finding mixins..." mixins=$(ls ../src/mixins/**.less) echo "Mixins:" @@ -54,3 +60,4 @@ lessc "$base.less" --clean-css "$base.min.css" done done +cd "$origin" \ No newline at end of file diff --git a/dist/base.module.css b/dist/base.module.css index 0a237d9..ac80968 100644 --- a/dist/base.module.css +++ b/dist/base.module.css @@ -3,10 +3,145 @@ * by */ :where(.bluelib) { + --bhsl-background-hue: 0deg; + --bhsl-background-saturation: 0%; + --bhsl-background-lightness: 100%; + --bhsl-foreground-hue: 0deg; + --bhsl-foreground-saturation: 0%; + --bhsl-foreground-lightness: 15%; + --bhsl-primary-hue: 0deg; + --bhsl-primary-saturation: 0%; + --bhsl-primary-lightness: 0%; + --bhsl-link-hue: 210deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 30%; + --bhsl-mark-foreground-hue: 0deg; + --bhsl-mark-foreground-saturation: 0%; + --bhsl-mark-foreground-lightness: 0%; + --bhsl-mark-background-hue: 60deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 75%; + --bhsl-todo-foreground-hue: 204deg; + --bhsl-todo-foreground-saturation: 11%; + --bhsl-todo-foreground-lightness: 18%; + --bhsl-todo-background-hue: 43deg; + --bhsl-todo-background-saturation: 100%; + --bhsl-todo-background-lightness: 65%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 30%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 30%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 30%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 30%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 30%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 30%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + --bfont-text-style: normal; + --bfont-text-variant: normal; + --bfont-text-weight: 400; + --bfont-text-stretch: normal; + --bfont-text-height: 1.3; + --bfont-text-family: sans-serif; + --bfont-header-style: normal; + --bfont-header-variant: normal; + --bfont-header-weight: 600; + --bfont-header-stretch: normal; + --bfont-header-height: 1.7; + --bfont-header-family: sans-serif; + --bfont-code-style: normal; + --bfont-code-variant: normal; + --bfont-code-weight: 400; + --bfont-code-stretch: normal; + --bfont-code-height: 1.3; + --bfont-code-family: monospace; + --bfont-boldcode-style: normal; + --bfont-boldcode-variant: normal; + --bfont-boldcode-weight: 700; + --bfont-boldcode-stretch: normal; + --bfont-boldcode-height: 1.3; + --bfont-boldcode-family: monospace; + --bfont-term-style: italic; + --bfont-term-variant: normal; + --bfont-term-weight: 700; + --bfont-term-stretch: normal; + --bfont-term-height: 1.3; + --bfont-term-family: sans-serif; + --bfont-summary-style: italic; + --bfont-summary-variant: normal; + --bfont-summary-weight: 400; + --bfont-summary-stretch: normal; + --bfont-summary-height: 1.3; + --bfont-summary-family: sans-serif; + --bfont-idiomatic-style: italic; + --bfont-idiomatic-variant: normal; + --bfont-idiomatic-weight: 400; + --bfont-idiomatic-stretch: normal; + --bfont-idiomatic-height: 1.3; + --bfont-idiomatic-family: sans-serif; + --bfont-emphasis-style: italic; + --bfont-emphasis-variant: normal; + --bfont-emphasis-weight: 400; + --bfont-emphasis-stretch: normal; + --bfont-emphasis-height: 1.3; + --bfont-emphasis-family: sans-serif; + --bfont-attention-style: normal; + --bfont-attention-variant: normal; + --bfont-attention-weight: 700; + --bfont-attention-stretch: normal; + --bfont-attention-height: 1.3; + --bfont-attention-family: sans-serif; + --bfont-strong-style: normal; + --bfont-strong-variant: normal; + --bfont-strong-weight: 700; + --bfont-strong-stretch: normal; + --bfont-strong-height: 1.3; + --bfont-strong-family: sans-serif; + --bfont-variable-style: normal; + --bfont-variable-variant: normal; + --bfont-variable-weight: 400; + --bfont-variable-stretch: normal; + --bfont-variable-height: 1.3; + --bfont-variable-family: sans-serif; + --bfont-citation-style: normal; + --bfont-citation-variant: small-caps; + --bfont-citation-weight: 400; + --bfont-citation-stretch: normal; + --bfont-citation-height: 1.3; + --bfont-citation-family: sans-serif; + --bfont-label-style: normal; + --bfont-label-variant: normal; + --bfont-label-weight: 400; + --bfont-label-stretch: normal; + --bfont-label-height: 1.3; + --bfont-label-family: sans-serif; --bhsl-current-hue: var(--bhsl-foreground-hue); --bhsl-current-saturation: var(--bhsl-foreground-saturation); --bhsl-current-lightness: var(--bhsl-foreground-lightness); background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); + background-position: center; + background-size: cover; + background-attachment: fixed; width: 100%; height: 100%; font-style: var(--bfont-text-style); @@ -16,6 +151,36 @@ line-height: var(--bfont-text-height); font-family: var(--bfont-text-family); } +@media screen { + :where(.bluelib) { + background-image: var(--burl-background-full); + } +} +@media screen and (max-width: 3840px) { + :where(.bluelib) { + background-image: var(--burl-background-3840); + } +} +@media screen and (max-width: 1920px) { + :where(.bluelib) { + background-image: var(--burl-background-1920); + } +} +@media screen and (max-width: 1366px) { + :where(.bluelib) { + background-image: var(--burl-background-1366); + } +} +@media screen and (max-width: 640px) { + :where(.bluelib) { + background-image: var(--burl-background-640); + } +} +@media screen and (max-width: 360px) { + :where(.bluelib) { + background-image: var(--burl-background-360); + } +} :where(.bluelib), :where(.bluelib) :where(*) { margin: 0; @@ -99,6 +264,16 @@ gap: 8px; background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } +@media (max-width: 492px) { + :where(.bluelib) :where(.panel) { + min-width: calc(100vw - 16px); + } +} +@media (min-width: 493px) { + :where(.bluelib) :where(.panel) { + min-width: 476px; + } +} :where(.bluelib) :where(.panel):where(.border-top), :where(.bluelib) :where(.panel):where(.panel-box) { border-top-width: 2px; @@ -123,6 +298,9 @@ :where(.bluelib) :where(.panel):where(.panel-parenthesis) { font-size: smaller; } +:where(.bluelib) :where(.panel) :where(.panel) { + min-width: unset; +} :where(.bluelib) :where(.chapter-0) { flex-wrap: nowrap; } @@ -617,15 +795,35 @@ line-height: var(--bfont-code-height); font-family: var(--bfont-code-family); } +:where(.bluelib) :where(.text-code) :where(.text-attention), +:where(.bluelib) :where(.text-preformatted) :where(.text-attention), +:where(.bluelib) :where(.text-input) :where(.text-attention), +:where(.bluelib) :where(.text-output) :where(.text-attention) { + font-style: var(--bfont-boldcode-style); + font-variant: var(--bfont-boldcode-variant); + font-weight: var(--bfont-boldcode-weight); + font-stretch: var(--bfont-boldcode-stretch); + line-height: var(--bfont-boldcode-height); + font-family: var(--bfont-boldcode-family); +} :where(.bluelib) :where(.text-preformatted) { overflow-x: scroll; } :where(.bluelib) :where(.text-input), :where(.bluelib) :where(.text-output) { - padding: 0 0.25ex; + padding: 0 0.35ex; + border-width: 1px; + border-style: solid; +} +:where(.bluelib) :where(.text-input) :where(.text-input), +:where(.bluelib) :where(.text-output) :where(.text-input), +:where(.bluelib) :where(.text-input) :where(.text-output), +:where(.bluelib) :where(.text-output) :where(.text-output) { + border-width: 0; } :where(.bluelib) :where(.text-input) { background-color: hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness)); + border-color: hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness)); --bhsl-current-hue: var(--bhsl-sample-input-hue); --bhsl-current-saturation: var(--bhsl-sample-input-saturation); --bhsl-current-lightness: var(--bhsl-sample-input-lightness); @@ -640,6 +838,7 @@ } :where(.bluelib) :where(.text-output) { background-color: hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness)); + border-color: hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness)); --bhsl-current-hue: var(--bhsl-sample-output-hue); --bhsl-current-saturation: var(--bhsl-sample-output-saturation); --bhsl-current-lightness: var(--bhsl-sample-output-lightness); diff --git a/dist/base.module.less b/dist/base.module.less index 43dede2..eb9abbc 100644 --- a/dist/base.module.less +++ b/dist/base.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/base.module.min.css b/dist/base.module.min.css index 5a50f4f..02f9b9e 100644 --- a/dist/base.module.min.css +++ b/dist/base.module.min.css @@ -1 +1 @@ -:where(.bluelib){--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness);background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));width:100%;height:100%;font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}:where(.bluelib),:where(.bluelib) :where(*){margin:0;padding:0;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-width:0;border-style:solid;scrollbar-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)) hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib),:where(.bluelib) :where(*),:where(.bluelib) :where(*)::after,:where(.bluelib) :where(*)::before,:where(.bluelib)::after,:where(.bluelib)::before{box-sizing:border-box}:where(.bluelib) :where(*):focus-visible,:where(.bluelib):focus-visible{outline-width:4px;outline-style:solid;outline-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .3)}:where(.bluelib) :where(.page-footer),:where(.bluelib) :where(.page-header){text-align:center}:where(.bluelib) :where(.page-footer){margin:1rem 0;font-size:x-small}:where(.bluelib) :where(.float-top){margin-bottom:auto}:where(.bluelib) :where(.float-right){margin-left:auto}:where(.bluelib) :where(.float-bottom){margin-top:auto}:where(.bluelib) :where(.float-left){margin-right:auto}:where(.bluelib) :where(.float-hcenter){margin-left:auto;margin-right:auto}:where(.bluelib) :where(.float-vcenter){margin-top:auto;margin-bottom:auto}:where(.bluelib) :where(.header-1){font-size:2.5em}:where(.bluelib) :where(.header-2){font-size:1.75em}:where(.bluelib) :where(h1,h2,h3,h4,h5,h6){text-align:center;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(.bluelib) :where(.panel){padding-top:8px;padding-right:8px;padding-left:8px;padding-bottom:8px;border-width:0;border-style:solid;width:100%;display:flex;flex-direction:column;gap:8px;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib) :where(.panel):where(.border-top),:where(.bluelib) :where(.panel):where(.panel-box){border-top-width:2px;padding-top:6px}:where(.bluelib) :where(.panel):where(.border-right),:where(.bluelib) :where(.panel):where(.panel-box){border-right-width:2px;padding-right:6px}:where(.bluelib) :where(.panel):where(.border-left),:where(.bluelib) :where(.panel):where(.panel-box),:where(.bluelib) :where(.panel):where(.panel-dialog){border-left-width:2px;padding-left:6px}:where(.bluelib) :where(.panel):where(.border-bottom),:where(.bluelib) :where(.panel):where(.panel-box){border-bottom-width:2px;padding-bottom:6px}:where(.bluelib) :where(.panel):where(.panel-parenthesis){font-size:smaller}:where(.bluelib) :where(.chapter-0){flex-wrap:nowrap}:where(.bluelib) :where(.chapter-0)>:where(*){flex-shrink:1}:where(.bluelib) :where(.chapter-1)>:where(*){flex-basis:calc(100% / 2)}:where(.bluelib) :where(.chapter-2)>:where(*){flex-basis:calc(100% / 3)}:where(.bluelib) :where(.chapter-3)>:where(*){flex-basis:calc(100% / 4)}:where(.bluelib) :where(.chapter-4)>:where(*){flex-basis:calc(100% / 5)}:where(.bluelib) :where(.chapter-5)>:where(*){flex-basis:calc(100% / 6)}:where(.bluelib) :where(.chapter-6)>:where(*){flex-basis:calc(100% / 7)}:where(.bluelib) :where(.chapter-7)>:where(*){flex-basis:calc(100% / 8)}:where(.bluelib) :where(.chapter-8)>:where(*){flex-basis:calc(100% / 9)}:where(.bluelib) :where(.chapter-9)>:where(*){flex-basis:calc(100% / 10)}:where(.bluelib) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9){display:flex;flex-wrap:wrap;flex-direction:row;gap:8px;justify-content:center;align-items:stretch;margin:8px 0}:where(.bluelib) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(*){flex-grow:1;flex-shrink:0}:where(.bluelib) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(h1,h2,h3,h4,h5,h6){flex-basis:100%;margin-top:1.2em}:where(.bluelib) :where(.separator){border-width:1px;border-style:dashed}:where(.bluelib) :where(.separator-light){border-style:dotted}:where(.bluelib) :where(.separator-heavy){border-style:solid}:where(.bluelib) :where(.image){display:block;max-width:100%;object-fit:contain}:where(.bluelib) :where(.image-limit-half){max-height:max(28.2vw,50vh)}:where(.bluelib) :where(.image-limit-quarter){max-height:max(14.1vw,25vh)}:where(.bluelib) :where(.table){border-collapse:collapse}:where(.bluelib) :where(.table) :where(.table-data),:where(.bluelib) :where(.table) :where(.table-head){padding:3px 7px;border-width:1px}:where(.bluelib) :where(.table) :where(.table-caption){border-width:1px;font-style:var(--bfont-caption-style);font-variant:var(--bfont-caption-variant);font-weight:var(--bfont-caption-weight);font-stretch:var(--bfont-caption-stretch);line-height:var(--bfont-caption-height);font-family:var(--bfont-caption-family)}:where(.bluelib) :where(.table) :where(.table-caption):where(.table-caption-top){caption-side:top;border-bottom-width:0}:where(.bluelib) :where(.table) :where(.table-caption):where(.table-caption-bottom){caption-side:bottom;border-top-width:0}:where(.bluelib) :where(.table):where(.panel){display:table}:where(.bluelib) :where(.table):where(.panel) :where(.table-data),:where(.bluelib) :where(.table):where(.panel) :where(.table-head){padding:8px}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption){text-align:inherit;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));padding:8px}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*){margin-top:8px;margin-bottom:8px}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*):first-child{margin-top:0}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*):last-child{margin-bottom:0}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-row){border-width:1px}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-data),:where(.bluelib) :where(.table):where(.panel-box) :where(.table-head){border-width:1px;padding:7px}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption){border-width:2px;padding:6px}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption):where(.table-caption-top){border-bottom-width:0}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption):where(.table-caption-bottom){border-top-width:0}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-header)>:where(.table-row){border-bottom-width:1px}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-body)>:where(.table-row){border-width:0}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-footer)>:where(.table-row){border-top-width:1px}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-data),:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-head){border-width:0 0 0 1px;padding:8px 8px 8px 7px}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-caption){border-width:0 0 0 2px;padding:8px 8px 8px 6px}:where(.bluelib) :where(.panel)>:where(.list-ordered),:where(.bluelib) :where(.panel)>:where(.list-unordered){margin-left:6ex}:where(.bluelib) :where(.glossary-term){margin-top:.5em;padding:.2em 0;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family)}:where(.bluelib) :where(.glossary-description){margin-left:4.5ex;margin-bottom:.5em}:where(.bluelib) :where(.glossary-details){margin-left:4.5ex}:where(.bluelib) :where(.glossary-summary){cursor:pointer;margin-left:-4ex;padding:.2em 0;font-style:var(--bfont-summary-style);font-variant:var(--bfont-summary-variant);font-weight:var(--bfont-summary-weight);font-stretch:var(--bfont-summary-stretch);line-height:var(--bfont-summary-height);font-family:var(--bfont-summary-family);user-select:none}:where(.bluelib) :where(.modifier-fade){opacity:.3}:where(.bluelib) :where(.modifier-mark){font-style:var(--bfont-mark-style);font-variant:var(--bfont-mark-variant);font-weight:var(--bfont-mark-weight);font-stretch:var(--bfont-mark-stretch);line-height:var(--bfont-mark-height);font-family:var(--bfont-mark-family);background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness)}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(.bluelib) :where(.modifier-todo){--bhsl-current-hue:var(--bhsl-todo-foreground-hue);--bhsl-current-saturation:var(--bhsl-todo-foreground-saturation);--bhsl-current-lightness:var(--bhsl-todo-foreground-lightness)}:where(.bluelib) :where(.modifier-todo),:where(.bluelib) :where(.modifier-todo) :where(.panel){border-style:dashed;background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(.bluelib) :where(.property-disabled){border-style:dashed;cursor:not-allowed}:where(.bluelib) :where(.modifier-red){--bhsl-current-hue:var(--bhsl-red-hue);--bhsl-current-saturation:var(--bhsl-red-saturation);--bhsl-current-lightness:var(--bhsl-red-lightness)}:where(.bluelib) :where(.modifier-yellow){--bhsl-current-hue:var(--bhsl-yellow-hue);--bhsl-current-saturation:var(--bhsl-yellow-saturation);--bhsl-current-lightness:var(--bhsl-yellow-lightness)}:where(.bluelib) :where(.modifier-green){--bhsl-current-hue:var(--bhsl-green-hue);--bhsl-current-saturation:var(--bhsl-green-saturation);--bhsl-current-lightness:var(--bhsl-green-lightness)}:where(.bluelib) :where(.modifier-cyan){--bhsl-current-hue:var(--bhsl-cyan-hue);--bhsl-current-saturation:var(--bhsl-cyan-saturation);--bhsl-current-lightness:var(--bhsl-cyan-lightness)}:where(.bluelib) :where(.modifier-blue){--bhsl-current-hue:var(--bhsl-blue-hue);--bhsl-current-saturation:var(--bhsl-blue-saturation);--bhsl-current-lightness:var(--bhsl-blue-lightness)}:where(.bluelib) :where(.modifier-magenta){--bhsl-current-hue:var(--bhsl-magenta-hue);--bhsl-current-saturation:var(--bhsl-magenta-saturation);--bhsl-current-lightness:var(--bhsl-magenta-lightness)}:where(.bluelib) :where(.input){font:inherit;cursor:pointer;background-color:transparent;padding:.125em .75ex;vertical-align:middle;min-width:0;border-width:0;border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(.bluelib) :where(.input)::placeholder{opacity:1;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(.bluelib) :where(.input):hover:not(:where(.property-disabled)){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.input):hover:not(:where(.property-disabled))::placeholder{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.input):active:not(:where(.property-disabled)),:where(.bluelib) :where(.input):focus:not(:where(.property-disabled)){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(.bluelib) :where(.input-area){resize:vertical}:where(.bluelib) :where(.input-field),:where(.bluelib) :where(.input-select){border-bottom-width:2px}:where(.bluelib) :where(.input-area),:where(.bluelib) :where(.input-multiselect){border-left-width:2px}:where(.bluelib) :where(.input-area):not(:where(.property-disabled)),:where(.bluelib) :where(.input-field):not(:where(.property-disabled)){cursor:text}:where(.bluelib) :where(.input-multiselect):not(:where(.property-disabled)),:where(.bluelib) :where(.input-select):not(:where(.property-disabled)){cursor:vertical-text}:where(.bluelib) :where(.input-range):not(:where(.property-disabled)){cursor:ew-resize}:where(.bluelib) :where(.input-button):not(:where(.property-disabled)),:where(.bluelib) :where(.input-checkbox):not(:where(.property-disabled)),:where(.bluelib) :where(.input-color):not(:where(.property-disabled)),:where(.bluelib) :where(.input-radio):not(:where(.property-disabled)){cursor:pointer}:where(.bluelib) :where(.input-multiselect) optgroup,:where(.bluelib) :where(.input-select) optgroup{padding-bottom:.25em;font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(.bluelib) :where(.input-multiselect) optgroup option,:where(.bluelib) :where(.input-select) optgroup option{padding:.125em 0 .125em 2ex}:where(.bluelib) :where(.input-multiselect) option,:where(.bluelib) :where(.input-select) option{font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}:where(.bluelib) :where(.input-checkbox),:where(.bluelib) :where(.input-radio){appearance:none;width:1em;height:1em;padding:2px;border-width:2px;display:inline-flex;justify-content:center;align-items:center}:where(.bluelib) :where(.input-checkbox)::before,:where(.bluelib) :where(.input-radio)::before{display:block;content:"";width:100%;height:100%}:where(.bluelib) :where(.input-checkbox):checked::before,:where(.bluelib) :where(.input-radio):checked::before{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(.bluelib) :where(.input-radio){border-radius:100%}:where(.bluelib) :where(.input-radio)::before{border-radius:100%}:where(.bluelib) :where(.input-range){padding:0}:where(.bluelib) :where(.input-button){border-width:2px;border-style:outset}:where(.bluelib) :where(.input-button):active{border-style:inset}:where(.bluelib) :where(.input-color),:where(.bluelib) :where(.input-file){padding:0}@media screen and (-webkit-min-device-pixel-ratio:0){:where(.bluelib) :where(.input-field)::-webkit-calendar-picker-indicator{filter:invert(calc(calc(var(--bhsl-current-lightness) - 50%) * 1000))}:where(.bluelib) :where(.input-select) optgroup,:where(.bluelib) :where(.input-select) option{background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib) :where(.input-select) optgroup::before,:where(.bluelib) :where(.input-select) option::before{content:""}}:where(.bluelib) :where(.form-flex){display:flex;flex-direction:column;justify-content:stretch}:where(.bluelib) :where(.form-flex)>:where(.form-flex-content){margin:.5em 0}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice){display:flex;gap:1ex;min-height:1.675em}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):first-child,:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):last-child{margin:auto 0;flex-basis:15%;flex-grow:0;flex-shrink:0;font-style:var(--bfont-label-style);font-variant:var(--bfont-label-variant);font-weight:var(--bfont-label-weight);font-stretch:var(--bfont-label-stretch);line-height:var(--bfont-label-height);font-family:var(--bfont-label-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*){flex-grow:1;display:flex;justify-content:space-between;flex-wrap:wrap;align-items:stretch;gap:1ex}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):first-child{text-align:right;display:block}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):last-child{text-align:left;display:block}:where(.bluelib) :where(.text-anchor){--bhsl-current-hue:var(--bhsl-link-hue);--bhsl-current-saturation:var(--bhsl-link-saturation);--bhsl-current-lightness:var(--bhsl-link-lightness)}:where(.bluelib) :where(.text-idiomatic){font-style:var(--bfont-idiomatic-style);font-variant:var(--bfont-idiomatic-variant);font-weight:var(--bfont-idiomatic-weight);font-stretch:var(--bfont-idiomatic-stretch);line-height:var(--bfont-idiomatic-height);font-family:var(--bfont-idiomatic-family)}:where(.bluelib) :where(.text-emphasis){font-style:var(--bfont-emphasis-style);font-variant:var(--bfont-emphasis-variant);font-weight:var(--bfont-emphasis-weight);font-stretch:var(--bfont-emphasis-stretch);line-height:var(--bfont-emphasis-height);font-family:var(--bfont-emphasis-family)}:where(.bluelib) :where(.text-attention){font-style:var(--bfont-attention-style);font-variant:var(--bfont-attention-variant);font-weight:var(--bfont-attention-weight);font-stretch:var(--bfont-attention-stretch);line-height:var(--bfont-attention-height);font-family:var(--bfont-attention-family)}:where(.bluelib) :where(.text-strong){font-style:var(--bfont-strong-style);font-variant:var(--bfont-strong-variant);font-weight:var(--bfont-strong-weight);font-stretch:var(--bfont-strong-stretch);line-height:var(--bfont-strong-height);font-family:var(--bfont-strong-family)}:where(.bluelib) :where(.text-inserted){--bhsl-current-hue:var(--bhsl-inserted-hue);--bhsl-current-saturation:var(--bhsl-inserted-saturation);--bhsl-current-lightness:var(--bhsl-inserted-lightness)}:where(.bluelib) :where(.text-deleted){--bhsl-current-hue:var(--bhsl-deleted-hue);--bhsl-current-saturation:var(--bhsl-deleted-saturation);--bhsl-current-lightness:var(--bhsl-deleted-lightness)}:where(.bluelib) :where(.text-code),:where(.bluelib) :where(.text-input),:where(.bluelib) :where(.text-output),:where(.bluelib) :where(.text-preformatted){font-style:var(--bfont-code-style);font-variant:var(--bfont-code-variant);font-weight:var(--bfont-code-weight);font-stretch:var(--bfont-code-stretch);line-height:var(--bfont-code-height);font-family:var(--bfont-code-family)}:where(.bluelib) :where(.text-preformatted){overflow-x:scroll}:where(.bluelib) :where(.text-input),:where(.bluelib) :where(.text-output){padding:0 .25ex}:where(.bluelib) :where(.text-input){background-color:hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness));--bhsl-current-hue:var(--bhsl-sample-input-hue);--bhsl-current-saturation:var(--bhsl-sample-input-saturation);--bhsl-current-lightness:var(--bhsl-sample-input-lightness)}:where(.bluelib) :where(.text-input) :where(.text-input){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(.bluelib) :where(.text-output){background-color:hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness));--bhsl-current-hue:var(--bhsl-sample-output-hue);--bhsl-current-saturation:var(--bhsl-sample-output-saturation);--bhsl-current-lightness:var(--bhsl-sample-output-lightness)}:where(.bluelib) :where(.text-output) :where(.text-output){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(.bluelib) :where(.text-variable){font-style:var(--bfont-variable-style);font-variant:var(--bfont-variable-variant);font-weight:var(--bfont-variable-weight);font-stretch:var(--bfont-variable-stretch);line-height:var(--bfont-variable-height);font-family:var(--bfont-variable-family)}:where(.bluelib) :where(.text-citation){font-style:var(--bfont-citation-style);font-variant:var(--bfont-citation-variant);font-weight:var(--bfont-citation-weight);font-stretch:var(--bfont-citation-stretch);line-height:var(--bfont-citation-height);font-family:var(--bfont-citation-family)}:where(.bluelib) :where(.text-definition){font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(.bluelib) :where(.text-abbreviation){cursor:help} \ No newline at end of file +:where(.bluelib){--bhsl-background-hue:0deg;--bhsl-background-saturation:0%;--bhsl-background-lightness:100%;--bhsl-foreground-hue:0deg;--bhsl-foreground-saturation:0%;--bhsl-foreground-lightness:15%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:0%;--bhsl-primary-lightness:0%;--bhsl-link-hue:210deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:30%;--bhsl-mark-foreground-hue:0deg;--bhsl-mark-foreground-saturation:0%;--bhsl-mark-foreground-lightness:0%;--bhsl-mark-background-hue:60deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:75%;--bhsl-todo-foreground-hue:204deg;--bhsl-todo-foreground-saturation:11%;--bhsl-todo-foreground-lightness:18%;--bhsl-todo-background-hue:43deg;--bhsl-todo-background-saturation:100%;--bhsl-todo-background-lightness:65%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:30%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:30%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:30%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:30%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:30%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:30%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness);--bfont-text-style:normal;--bfont-text-variant:normal;--bfont-text-weight:400;--bfont-text-stretch:normal;--bfont-text-height:1.3;--bfont-text-family:sans-serif;--bfont-header-style:normal;--bfont-header-variant:normal;--bfont-header-weight:600;--bfont-header-stretch:normal;--bfont-header-height:1.7;--bfont-header-family:sans-serif;--bfont-code-style:normal;--bfont-code-variant:normal;--bfont-code-weight:400;--bfont-code-stretch:normal;--bfont-code-height:1.3;--bfont-code-family:monospace;--bfont-boldcode-style:normal;--bfont-boldcode-variant:normal;--bfont-boldcode-weight:700;--bfont-boldcode-stretch:normal;--bfont-boldcode-height:1.3;--bfont-boldcode-family:monospace;--bfont-term-style:italic;--bfont-term-variant:normal;--bfont-term-weight:700;--bfont-term-stretch:normal;--bfont-term-height:1.3;--bfont-term-family:sans-serif;--bfont-summary-style:italic;--bfont-summary-variant:normal;--bfont-summary-weight:400;--bfont-summary-stretch:normal;--bfont-summary-height:1.3;--bfont-summary-family:sans-serif;--bfont-idiomatic-style:italic;--bfont-idiomatic-variant:normal;--bfont-idiomatic-weight:400;--bfont-idiomatic-stretch:normal;--bfont-idiomatic-height:1.3;--bfont-idiomatic-family:sans-serif;--bfont-emphasis-style:italic;--bfont-emphasis-variant:normal;--bfont-emphasis-weight:400;--bfont-emphasis-stretch:normal;--bfont-emphasis-height:1.3;--bfont-emphasis-family:sans-serif;--bfont-attention-style:normal;--bfont-attention-variant:normal;--bfont-attention-weight:700;--bfont-attention-stretch:normal;--bfont-attention-height:1.3;--bfont-attention-family:sans-serif;--bfont-strong-style:normal;--bfont-strong-variant:normal;--bfont-strong-weight:700;--bfont-strong-stretch:normal;--bfont-strong-height:1.3;--bfont-strong-family:sans-serif;--bfont-variable-style:normal;--bfont-variable-variant:normal;--bfont-variable-weight:400;--bfont-variable-stretch:normal;--bfont-variable-height:1.3;--bfont-variable-family:sans-serif;--bfont-citation-style:normal;--bfont-citation-variant:small-caps;--bfont-citation-weight:400;--bfont-citation-stretch:normal;--bfont-citation-height:1.3;--bfont-citation-family:sans-serif;--bfont-label-style:normal;--bfont-label-variant:normal;--bfont-label-weight:400;--bfont-label-stretch:normal;--bfont-label-height:1.3;--bfont-label-family:sans-serif;--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness);background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));background-position:center;background-size:cover;background-attachment:fixed;width:100%;height:100%;font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}@media screen{:where(.bluelib){background-image:var(--burl-background-full)}}@media screen and (max-width:3840px){:where(.bluelib){background-image:var(--burl-background-3840)}}@media screen and (max-width:1920px){:where(.bluelib){background-image:var(--burl-background-1920)}}@media screen and (max-width:1366px){:where(.bluelib){background-image:var(--burl-background-1366)}}@media screen and (max-width:640px){:where(.bluelib){background-image:var(--burl-background-640)}}@media screen and (max-width:360px){:where(.bluelib){background-image:var(--burl-background-360)}}:where(.bluelib),:where(.bluelib) :where(*){margin:0;padding:0;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-width:0;border-style:solid;scrollbar-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)) hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib),:where(.bluelib) :where(*),:where(.bluelib) :where(*)::after,:where(.bluelib) :where(*)::before,:where(.bluelib)::after,:where(.bluelib)::before{box-sizing:border-box}:where(.bluelib) :where(*):focus-visible,:where(.bluelib):focus-visible{outline-width:4px;outline-style:solid;outline-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .3)}:where(.bluelib) :where(.page-footer),:where(.bluelib) :where(.page-header){text-align:center}:where(.bluelib) :where(.page-footer){margin:1rem 0;font-size:x-small}:where(.bluelib) :where(.float-top){margin-bottom:auto}:where(.bluelib) :where(.float-right){margin-left:auto}:where(.bluelib) :where(.float-bottom){margin-top:auto}:where(.bluelib) :where(.float-left){margin-right:auto}:where(.bluelib) :where(.float-hcenter){margin-left:auto;margin-right:auto}:where(.bluelib) :where(.float-vcenter){margin-top:auto;margin-bottom:auto}:where(.bluelib) :where(.header-1){font-size:2.5em}:where(.bluelib) :where(.header-2){font-size:1.75em}:where(.bluelib) :where(h1,h2,h3,h4,h5,h6){text-align:center;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(.bluelib) :where(.panel){padding-top:8px;padding-right:8px;padding-left:8px;padding-bottom:8px;border-width:0;border-style:solid;width:100%;display:flex;flex-direction:column;gap:8px;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}@media (max-width:492px){:where(.bluelib) :where(.panel){min-width:calc(100vw - 16px)}}@media (min-width:493px){:where(.bluelib) :where(.panel){min-width:476px}}:where(.bluelib) :where(.panel):where(.border-top),:where(.bluelib) :where(.panel):where(.panel-box){border-top-width:2px;padding-top:6px}:where(.bluelib) :where(.panel):where(.border-right),:where(.bluelib) :where(.panel):where(.panel-box){border-right-width:2px;padding-right:6px}:where(.bluelib) :where(.panel):where(.border-left),:where(.bluelib) :where(.panel):where(.panel-box),:where(.bluelib) :where(.panel):where(.panel-dialog){border-left-width:2px;padding-left:6px}:where(.bluelib) :where(.panel):where(.border-bottom),:where(.bluelib) :where(.panel):where(.panel-box){border-bottom-width:2px;padding-bottom:6px}:where(.bluelib) :where(.panel):where(.panel-parenthesis){font-size:smaller}:where(.bluelib) :where(.panel) :where(.panel){min-width:unset}:where(.bluelib) :where(.chapter-0){flex-wrap:nowrap}:where(.bluelib) :where(.chapter-0)>:where(*){flex-shrink:1}:where(.bluelib) :where(.chapter-1)>:where(*){flex-basis:calc(100% / 2)}:where(.bluelib) :where(.chapter-2)>:where(*){flex-basis:calc(100% / 3)}:where(.bluelib) :where(.chapter-3)>:where(*){flex-basis:calc(100% / 4)}:where(.bluelib) :where(.chapter-4)>:where(*){flex-basis:calc(100% / 5)}:where(.bluelib) :where(.chapter-5)>:where(*){flex-basis:calc(100% / 6)}:where(.bluelib) :where(.chapter-6)>:where(*){flex-basis:calc(100% / 7)}:where(.bluelib) :where(.chapter-7)>:where(*){flex-basis:calc(100% / 8)}:where(.bluelib) :where(.chapter-8)>:where(*){flex-basis:calc(100% / 9)}:where(.bluelib) :where(.chapter-9)>:where(*){flex-basis:calc(100% / 10)}:where(.bluelib) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9){display:flex;flex-wrap:wrap;flex-direction:row;gap:8px;justify-content:center;align-items:stretch;margin:8px 0}:where(.bluelib) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(*){flex-grow:1;flex-shrink:0}:where(.bluelib) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(h1,h2,h3,h4,h5,h6){flex-basis:100%;margin-top:1.2em}:where(.bluelib) :where(.separator){border-width:1px;border-style:dashed}:where(.bluelib) :where(.separator-light){border-style:dotted}:where(.bluelib) :where(.separator-heavy){border-style:solid}:where(.bluelib) :where(.image){display:block;max-width:100%;object-fit:contain}:where(.bluelib) :where(.image-limit-half){max-height:max(28.2vw,50vh)}:where(.bluelib) :where(.image-limit-quarter){max-height:max(14.1vw,25vh)}:where(.bluelib) :where(.table){border-collapse:collapse}:where(.bluelib) :where(.table) :where(.table-data),:where(.bluelib) :where(.table) :where(.table-head){padding:3px 7px;border-width:1px}:where(.bluelib) :where(.table) :where(.table-caption){border-width:1px;font-style:var(--bfont-caption-style);font-variant:var(--bfont-caption-variant);font-weight:var(--bfont-caption-weight);font-stretch:var(--bfont-caption-stretch);line-height:var(--bfont-caption-height);font-family:var(--bfont-caption-family)}:where(.bluelib) :where(.table) :where(.table-caption):where(.table-caption-top){caption-side:top;border-bottom-width:0}:where(.bluelib) :where(.table) :where(.table-caption):where(.table-caption-bottom){caption-side:bottom;border-top-width:0}:where(.bluelib) :where(.table):where(.panel){display:table}:where(.bluelib) :where(.table):where(.panel) :where(.table-data),:where(.bluelib) :where(.table):where(.panel) :where(.table-head){padding:8px}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption){text-align:inherit;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));padding:8px}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*){margin-top:8px;margin-bottom:8px}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*):first-child{margin-top:0}:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*):last-child{margin-bottom:0}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-row){border-width:1px}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-data),:where(.bluelib) :where(.table):where(.panel-box) :where(.table-head){border-width:1px;padding:7px}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption){border-width:2px;padding:6px}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption):where(.table-caption-top){border-bottom-width:0}:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption):where(.table-caption-bottom){border-top-width:0}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-header)>:where(.table-row){border-bottom-width:1px}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-body)>:where(.table-row){border-width:0}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-footer)>:where(.table-row){border-top-width:1px}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-data),:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-head){border-width:0 0 0 1px;padding:8px 8px 8px 7px}:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-caption){border-width:0 0 0 2px;padding:8px 8px 8px 6px}:where(.bluelib) :where(.panel)>:where(.list-ordered),:where(.bluelib) :where(.panel)>:where(.list-unordered){margin-left:6ex}:where(.bluelib) :where(.glossary-term){margin-top:.5em;padding:.2em 0;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family)}:where(.bluelib) :where(.glossary-description){margin-left:4.5ex;margin-bottom:.5em}:where(.bluelib) :where(.glossary-details){margin-left:4.5ex}:where(.bluelib) :where(.glossary-summary){cursor:pointer;margin-left:-4ex;padding:.2em 0;font-style:var(--bfont-summary-style);font-variant:var(--bfont-summary-variant);font-weight:var(--bfont-summary-weight);font-stretch:var(--bfont-summary-stretch);line-height:var(--bfont-summary-height);font-family:var(--bfont-summary-family);user-select:none}:where(.bluelib) :where(.modifier-fade){opacity:.3}:where(.bluelib) :where(.modifier-mark){font-style:var(--bfont-mark-style);font-variant:var(--bfont-mark-variant);font-weight:var(--bfont-mark-weight);font-stretch:var(--bfont-mark-stretch);line-height:var(--bfont-mark-height);font-family:var(--bfont-mark-family);background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness)}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(.bluelib) :where(.modifier-todo){--bhsl-current-hue:var(--bhsl-todo-foreground-hue);--bhsl-current-saturation:var(--bhsl-todo-foreground-saturation);--bhsl-current-lightness:var(--bhsl-todo-foreground-lightness)}:where(.bluelib) :where(.modifier-todo),:where(.bluelib) :where(.modifier-todo) :where(.panel){border-style:dashed;background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(.bluelib) :where(.property-disabled){border-style:dashed;cursor:not-allowed}:where(.bluelib) :where(.modifier-red){--bhsl-current-hue:var(--bhsl-red-hue);--bhsl-current-saturation:var(--bhsl-red-saturation);--bhsl-current-lightness:var(--bhsl-red-lightness)}:where(.bluelib) :where(.modifier-yellow){--bhsl-current-hue:var(--bhsl-yellow-hue);--bhsl-current-saturation:var(--bhsl-yellow-saturation);--bhsl-current-lightness:var(--bhsl-yellow-lightness)}:where(.bluelib) :where(.modifier-green){--bhsl-current-hue:var(--bhsl-green-hue);--bhsl-current-saturation:var(--bhsl-green-saturation);--bhsl-current-lightness:var(--bhsl-green-lightness)}:where(.bluelib) :where(.modifier-cyan){--bhsl-current-hue:var(--bhsl-cyan-hue);--bhsl-current-saturation:var(--bhsl-cyan-saturation);--bhsl-current-lightness:var(--bhsl-cyan-lightness)}:where(.bluelib) :where(.modifier-blue){--bhsl-current-hue:var(--bhsl-blue-hue);--bhsl-current-saturation:var(--bhsl-blue-saturation);--bhsl-current-lightness:var(--bhsl-blue-lightness)}:where(.bluelib) :where(.modifier-magenta){--bhsl-current-hue:var(--bhsl-magenta-hue);--bhsl-current-saturation:var(--bhsl-magenta-saturation);--bhsl-current-lightness:var(--bhsl-magenta-lightness)}:where(.bluelib) :where(.input){font:inherit;cursor:pointer;background-color:transparent;padding:.125em .75ex;vertical-align:middle;min-width:0;border-width:0;border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(.bluelib) :where(.input)::placeholder{opacity:1;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(.bluelib) :where(.input):hover:not(:where(.property-disabled)){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.input):hover:not(:where(.property-disabled))::placeholder{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.input):active:not(:where(.property-disabled)),:where(.bluelib) :where(.input):focus:not(:where(.property-disabled)){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(.bluelib) :where(.input-area){resize:vertical}:where(.bluelib) :where(.input-field),:where(.bluelib) :where(.input-select){border-bottom-width:2px}:where(.bluelib) :where(.input-area),:where(.bluelib) :where(.input-multiselect){border-left-width:2px}:where(.bluelib) :where(.input-area):not(:where(.property-disabled)),:where(.bluelib) :where(.input-field):not(:where(.property-disabled)){cursor:text}:where(.bluelib) :where(.input-multiselect):not(:where(.property-disabled)),:where(.bluelib) :where(.input-select):not(:where(.property-disabled)){cursor:vertical-text}:where(.bluelib) :where(.input-range):not(:where(.property-disabled)){cursor:ew-resize}:where(.bluelib) :where(.input-button):not(:where(.property-disabled)),:where(.bluelib) :where(.input-checkbox):not(:where(.property-disabled)),:where(.bluelib) :where(.input-color):not(:where(.property-disabled)),:where(.bluelib) :where(.input-radio):not(:where(.property-disabled)){cursor:pointer}:where(.bluelib) :where(.input-multiselect) optgroup,:where(.bluelib) :where(.input-select) optgroup{padding-bottom:.25em;font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(.bluelib) :where(.input-multiselect) optgroup option,:where(.bluelib) :where(.input-select) optgroup option{padding:.125em 0 .125em 2ex}:where(.bluelib) :where(.input-multiselect) option,:where(.bluelib) :where(.input-select) option{font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}:where(.bluelib) :where(.input-checkbox),:where(.bluelib) :where(.input-radio){appearance:none;width:1em;height:1em;padding:2px;border-width:2px;display:inline-flex;justify-content:center;align-items:center}:where(.bluelib) :where(.input-checkbox)::before,:where(.bluelib) :where(.input-radio)::before{display:block;content:"";width:100%;height:100%}:where(.bluelib) :where(.input-checkbox):checked::before,:where(.bluelib) :where(.input-radio):checked::before{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(.bluelib) :where(.input-radio){border-radius:100%}:where(.bluelib) :where(.input-radio)::before{border-radius:100%}:where(.bluelib) :where(.input-range){padding:0}:where(.bluelib) :where(.input-button){border-width:2px;border-style:outset}:where(.bluelib) :where(.input-button):active{border-style:inset}:where(.bluelib) :where(.input-color),:where(.bluelib) :where(.input-file){padding:0}@media screen and (-webkit-min-device-pixel-ratio:0){:where(.bluelib) :where(.input-field)::-webkit-calendar-picker-indicator{filter:invert(calc(calc(var(--bhsl-current-lightness) - 50%) * 1000))}:where(.bluelib) :where(.input-select) optgroup,:where(.bluelib) :where(.input-select) option{background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib) :where(.input-select) optgroup::before,:where(.bluelib) :where(.input-select) option::before{content:""}}:where(.bluelib) :where(.form-flex){display:flex;flex-direction:column;justify-content:stretch}:where(.bluelib) :where(.form-flex)>:where(.form-flex-content){margin:.5em 0}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice){display:flex;gap:1ex;min-height:1.675em}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):first-child,:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):last-child{margin:auto 0;flex-basis:15%;flex-grow:0;flex-shrink:0;font-style:var(--bfont-label-style);font-variant:var(--bfont-label-variant);font-weight:var(--bfont-label-weight);font-stretch:var(--bfont-label-stretch);line-height:var(--bfont-label-height);font-family:var(--bfont-label-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*){flex-grow:1;display:flex;justify-content:space-between;flex-wrap:wrap;align-items:stretch;gap:1ex}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):first-child{text-align:right;display:block}:where(.bluelib) :where(.form-flex)>:where(.form-flex-choice)>:where(*):last-child{text-align:left;display:block}:where(.bluelib) :where(.text-anchor){--bhsl-current-hue:var(--bhsl-link-hue);--bhsl-current-saturation:var(--bhsl-link-saturation);--bhsl-current-lightness:var(--bhsl-link-lightness)}:where(.bluelib) :where(.text-idiomatic){font-style:var(--bfont-idiomatic-style);font-variant:var(--bfont-idiomatic-variant);font-weight:var(--bfont-idiomatic-weight);font-stretch:var(--bfont-idiomatic-stretch);line-height:var(--bfont-idiomatic-height);font-family:var(--bfont-idiomatic-family)}:where(.bluelib) :where(.text-emphasis){font-style:var(--bfont-emphasis-style);font-variant:var(--bfont-emphasis-variant);font-weight:var(--bfont-emphasis-weight);font-stretch:var(--bfont-emphasis-stretch);line-height:var(--bfont-emphasis-height);font-family:var(--bfont-emphasis-family)}:where(.bluelib) :where(.text-attention){font-style:var(--bfont-attention-style);font-variant:var(--bfont-attention-variant);font-weight:var(--bfont-attention-weight);font-stretch:var(--bfont-attention-stretch);line-height:var(--bfont-attention-height);font-family:var(--bfont-attention-family)}:where(.bluelib) :where(.text-strong){font-style:var(--bfont-strong-style);font-variant:var(--bfont-strong-variant);font-weight:var(--bfont-strong-weight);font-stretch:var(--bfont-strong-stretch);line-height:var(--bfont-strong-height);font-family:var(--bfont-strong-family)}:where(.bluelib) :where(.text-inserted){--bhsl-current-hue:var(--bhsl-inserted-hue);--bhsl-current-saturation:var(--bhsl-inserted-saturation);--bhsl-current-lightness:var(--bhsl-inserted-lightness)}:where(.bluelib) :where(.text-deleted){--bhsl-current-hue:var(--bhsl-deleted-hue);--bhsl-current-saturation:var(--bhsl-deleted-saturation);--bhsl-current-lightness:var(--bhsl-deleted-lightness)}:where(.bluelib) :where(.text-code),:where(.bluelib) :where(.text-input),:where(.bluelib) :where(.text-output),:where(.bluelib) :where(.text-preformatted){font-style:var(--bfont-code-style);font-variant:var(--bfont-code-variant);font-weight:var(--bfont-code-weight);font-stretch:var(--bfont-code-stretch);line-height:var(--bfont-code-height);font-family:var(--bfont-code-family)}:where(.bluelib) :where(.text-code) :where(.text-attention),:where(.bluelib) :where(.text-input) :where(.text-attention),:where(.bluelib) :where(.text-output) :where(.text-attention),:where(.bluelib) :where(.text-preformatted) :where(.text-attention){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(.bluelib) :where(.text-preformatted){overflow-x:scroll}:where(.bluelib) :where(.text-input),:where(.bluelib) :where(.text-output){padding:0 .35ex;border-width:1px;border-style:solid}:where(.bluelib) :where(.text-input) :where(.text-input),:where(.bluelib) :where(.text-input) :where(.text-output),:where(.bluelib) :where(.text-output) :where(.text-input),:where(.bluelib) :where(.text-output) :where(.text-output){border-width:0}:where(.bluelib) :where(.text-input){background-color:hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness));border-color:hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness));--bhsl-current-hue:var(--bhsl-sample-input-hue);--bhsl-current-saturation:var(--bhsl-sample-input-saturation);--bhsl-current-lightness:var(--bhsl-sample-input-lightness)}:where(.bluelib) :where(.text-input) :where(.text-input){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(.bluelib) :where(.text-output){background-color:hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness));border-color:hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness));--bhsl-current-hue:var(--bhsl-sample-output-hue);--bhsl-current-saturation:var(--bhsl-sample-output-saturation);--bhsl-current-lightness:var(--bhsl-sample-output-lightness)}:where(.bluelib) :where(.text-output) :where(.text-output){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(.bluelib) :where(.text-variable){font-style:var(--bfont-variable-style);font-variant:var(--bfont-variable-variant);font-weight:var(--bfont-variable-weight);font-stretch:var(--bfont-variable-stretch);line-height:var(--bfont-variable-height);font-family:var(--bfont-variable-family)}:where(.bluelib) :where(.text-citation){font-style:var(--bfont-citation-style);font-variant:var(--bfont-citation-variant);font-weight:var(--bfont-citation-weight);font-stretch:var(--bfont-citation-stretch);line-height:var(--bfont-citation-height);font-family:var(--bfont-citation-family)}:where(.bluelib) :where(.text-definition){font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(.bluelib) :where(.text-abbreviation){cursor:help} \ No newline at end of file diff --git a/dist/base.root.css b/dist/base.root.css index 183c2bc..44bbc91 100644 --- a/dist/base.root.css +++ b/dist/base.root.css @@ -3,10 +3,145 @@ * by */ :where(body) { + --bhsl-background-hue: 0deg; + --bhsl-background-saturation: 0%; + --bhsl-background-lightness: 100%; + --bhsl-foreground-hue: 0deg; + --bhsl-foreground-saturation: 0%; + --bhsl-foreground-lightness: 15%; + --bhsl-primary-hue: 0deg; + --bhsl-primary-saturation: 0%; + --bhsl-primary-lightness: 0%; + --bhsl-link-hue: 210deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 30%; + --bhsl-mark-foreground-hue: 0deg; + --bhsl-mark-foreground-saturation: 0%; + --bhsl-mark-foreground-lightness: 0%; + --bhsl-mark-background-hue: 60deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 75%; + --bhsl-todo-foreground-hue: 204deg; + --bhsl-todo-foreground-saturation: 11%; + --bhsl-todo-foreground-lightness: 18%; + --bhsl-todo-background-hue: 43deg; + --bhsl-todo-background-saturation: 100%; + --bhsl-todo-background-lightness: 65%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 30%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 30%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 30%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 30%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 30%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 30%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + --bfont-text-style: normal; + --bfont-text-variant: normal; + --bfont-text-weight: 400; + --bfont-text-stretch: normal; + --bfont-text-height: 1.3; + --bfont-text-family: sans-serif; + --bfont-header-style: normal; + --bfont-header-variant: normal; + --bfont-header-weight: 600; + --bfont-header-stretch: normal; + --bfont-header-height: 1.7; + --bfont-header-family: sans-serif; + --bfont-code-style: normal; + --bfont-code-variant: normal; + --bfont-code-weight: 400; + --bfont-code-stretch: normal; + --bfont-code-height: 1.3; + --bfont-code-family: monospace; + --bfont-boldcode-style: normal; + --bfont-boldcode-variant: normal; + --bfont-boldcode-weight: 700; + --bfont-boldcode-stretch: normal; + --bfont-boldcode-height: 1.3; + --bfont-boldcode-family: monospace; + --bfont-term-style: italic; + --bfont-term-variant: normal; + --bfont-term-weight: 700; + --bfont-term-stretch: normal; + --bfont-term-height: 1.3; + --bfont-term-family: sans-serif; + --bfont-summary-style: italic; + --bfont-summary-variant: normal; + --bfont-summary-weight: 400; + --bfont-summary-stretch: normal; + --bfont-summary-height: 1.3; + --bfont-summary-family: sans-serif; + --bfont-idiomatic-style: italic; + --bfont-idiomatic-variant: normal; + --bfont-idiomatic-weight: 400; + --bfont-idiomatic-stretch: normal; + --bfont-idiomatic-height: 1.3; + --bfont-idiomatic-family: sans-serif; + --bfont-emphasis-style: italic; + --bfont-emphasis-variant: normal; + --bfont-emphasis-weight: 400; + --bfont-emphasis-stretch: normal; + --bfont-emphasis-height: 1.3; + --bfont-emphasis-family: sans-serif; + --bfont-attention-style: normal; + --bfont-attention-variant: normal; + --bfont-attention-weight: 700; + --bfont-attention-stretch: normal; + --bfont-attention-height: 1.3; + --bfont-attention-family: sans-serif; + --bfont-strong-style: normal; + --bfont-strong-variant: normal; + --bfont-strong-weight: 700; + --bfont-strong-stretch: normal; + --bfont-strong-height: 1.3; + --bfont-strong-family: sans-serif; + --bfont-variable-style: normal; + --bfont-variable-variant: normal; + --bfont-variable-weight: 400; + --bfont-variable-stretch: normal; + --bfont-variable-height: 1.3; + --bfont-variable-family: sans-serif; + --bfont-citation-style: normal; + --bfont-citation-variant: small-caps; + --bfont-citation-weight: 400; + --bfont-citation-stretch: normal; + --bfont-citation-height: 1.3; + --bfont-citation-family: sans-serif; + --bfont-label-style: normal; + --bfont-label-variant: normal; + --bfont-label-weight: 400; + --bfont-label-stretch: normal; + --bfont-label-height: 1.3; + --bfont-label-family: sans-serif; --bhsl-current-hue: var(--bhsl-foreground-hue); --bhsl-current-saturation: var(--bhsl-foreground-saturation); --bhsl-current-lightness: var(--bhsl-foreground-lightness); background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); + background-position: center; + background-size: cover; + background-attachment: fixed; width: 100%; height: 100%; font-style: var(--bfont-text-style); @@ -16,6 +151,36 @@ line-height: var(--bfont-text-height); font-family: var(--bfont-text-family); } +@media screen { + :where(body) { + background-image: var(--burl-background-full); + } +} +@media screen and (max-width: 3840px) { + :where(body) { + background-image: var(--burl-background-3840); + } +} +@media screen and (max-width: 1920px) { + :where(body) { + background-image: var(--burl-background-1920); + } +} +@media screen and (max-width: 1366px) { + :where(body) { + background-image: var(--burl-background-1366); + } +} +@media screen and (max-width: 640px) { + :where(body) { + background-image: var(--burl-background-640); + } +} +@media screen and (max-width: 360px) { + :where(body) { + background-image: var(--burl-background-360); + } +} :where(body), :where(body) :where(*) { margin: 0; @@ -99,6 +264,16 @@ gap: 8px; background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } +@media (max-width: 492px) { + :where(body) :where(.panel) { + min-width: calc(100vw - 16px); + } +} +@media (min-width: 493px) { + :where(body) :where(.panel) { + min-width: 476px; + } +} :where(body) :where(.panel):where(.border-top), :where(body) :where(.panel):where(.box) { border-top-width: 2px; @@ -123,6 +298,9 @@ :where(body) :where(.panel):where(.parenthesis) { font-size: smaller; } +:where(body) :where(.panel) :where(.panel) { + min-width: unset; +} :where(body) :where(.chapter-0) { flex-wrap: nowrap; } @@ -617,15 +795,35 @@ line-height: var(--bfont-code-height); font-family: var(--bfont-code-family); } +:where(body) :where(code) :where(b), +:where(body) :where(pre) :where(b), +:where(body) :where(kbd) :where(b), +:where(body) :where(samp) :where(b) { + font-style: var(--bfont-boldcode-style); + font-variant: var(--bfont-boldcode-variant); + font-weight: var(--bfont-boldcode-weight); + font-stretch: var(--bfont-boldcode-stretch); + line-height: var(--bfont-boldcode-height); + font-family: var(--bfont-boldcode-family); +} :where(body) :where(pre) { overflow-x: scroll; } :where(body) :where(kbd), :where(body) :where(samp) { - padding: 0 0.25ex; + padding: 0 0.35ex; + border-width: 1px; + border-style: solid; +} +:where(body) :where(kbd) :where(kbd), +:where(body) :where(samp) :where(kbd), +:where(body) :where(kbd) :where(samp), +:where(body) :where(samp) :where(samp) { + border-width: 0; } :where(body) :where(kbd) { background-color: hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness)); + border-color: hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness)); --bhsl-current-hue: var(--bhsl-sample-input-hue); --bhsl-current-saturation: var(--bhsl-sample-input-saturation); --bhsl-current-lightness: var(--bhsl-sample-input-lightness); @@ -640,6 +838,7 @@ } :where(body) :where(samp) { background-color: hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness)); + border-color: hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness)); --bhsl-current-hue: var(--bhsl-sample-output-hue); --bhsl-current-saturation: var(--bhsl-sample-output-saturation); --bhsl-current-lightness: var(--bhsl-sample-output-lightness); diff --git a/dist/base.root.less b/dist/base.root.less index 520aa51..aef0900 100644 --- a/dist/base.root.less +++ b/dist/base.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/base.root.min.css b/dist/base.root.min.css index ab1b24d..7f484c3 100644 --- a/dist/base.root.min.css +++ b/dist/base.root.min.css @@ -1 +1 @@ -:where(body){--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness);background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));width:100%;height:100%;font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}:where(body),:where(body) :where(*){margin:0;padding:0;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-width:0;border-style:solid;scrollbar-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)) hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body),:where(body) :where(*),:where(body) :where(*)::after,:where(body) :where(*)::before,:where(body)::after,:where(body)::before{box-sizing:border-box}:where(body) :where(*):focus-visible,:where(body):focus-visible{outline-width:4px;outline-style:solid;outline-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .3)}:where(body) :where(footer),:where(body) :where(header){text-align:center}:where(body) :where(footer){margin:1rem 0;font-size:x-small}:where(body) :where(.float-top){margin-bottom:auto}:where(body) :where(.float-right){margin-left:auto}:where(body) :where(.float-bottom){margin-top:auto}:where(body) :where(.float-left){margin-right:auto}:where(body) :where(.float-hcenter){margin-left:auto;margin-right:auto}:where(body) :where(.float-vcenter){margin-top:auto;margin-bottom:auto}:where(body) :where(h1){font-size:2.5em}:where(body) :where(h2){font-size:1.75em}:where(body) :where(h1,h2,h3,h4,h5,h6){text-align:center;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(body) :where(.panel){padding-top:8px;padding-right:8px;padding-left:8px;padding-bottom:8px;border-width:0;border-style:solid;width:100%;display:flex;flex-direction:column;gap:8px;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body) :where(.panel):where(.border-top),:where(body) :where(.panel):where(.box){border-top-width:2px;padding-top:6px}:where(body) :where(.panel):where(.border-right),:where(body) :where(.panel):where(.box){border-right-width:2px;padding-right:6px}:where(body) :where(.panel):where(.border-left),:where(body) :where(.panel):where(.box),:where(body) :where(.panel):where(.dialog){border-left-width:2px;padding-left:6px}:where(body) :where(.panel):where(.border-bottom),:where(body) :where(.panel):where(.box){border-bottom-width:2px;padding-bottom:6px}:where(body) :where(.panel):where(.parenthesis){font-size:smaller}:where(body) :where(.chapter-0){flex-wrap:nowrap}:where(body) :where(.chapter-0)>:where(*){flex-shrink:1}:where(body) :where(.chapter-1)>:where(*){flex-basis:calc(100% / 2)}:where(body) :where(.chapter-2)>:where(*){flex-basis:calc(100% / 3)}:where(body) :where(.chapter-3)>:where(*){flex-basis:calc(100% / 4)}:where(body) :where(.chapter-4)>:where(*){flex-basis:calc(100% / 5)}:where(body) :where(.chapter-5)>:where(*){flex-basis:calc(100% / 6)}:where(body) :where(.chapter-6)>:where(*){flex-basis:calc(100% / 7)}:where(body) :where(.chapter-7)>:where(*){flex-basis:calc(100% / 8)}:where(body) :where(.chapter-8)>:where(*){flex-basis:calc(100% / 9)}:where(body) :where(.chapter-9)>:where(*){flex-basis:calc(100% / 10)}:where(body) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9){display:flex;flex-wrap:wrap;flex-direction:row;gap:8px;justify-content:center;align-items:stretch;margin:8px 0}:where(body) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(*){flex-grow:1;flex-shrink:0}:where(body) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(h1,h2,h3,h4,h5,h6){flex-basis:100%;margin-top:1.2em}:where(body) :where(hr){border-width:1px;border-style:dashed}:where(body) :where(.separator-light){border-style:dotted}:where(body) :where(.separator-heavy){border-style:solid}:where(body) :where(img){display:block;max-width:100%;object-fit:contain}:where(body) :where(.image-limit-half){max-height:max(28.2vw,50vh)}:where(body) :where(.image-limit-quarter){max-height:max(14.1vw,25vh)}:where(body) :where(table){border-collapse:collapse}:where(body) :where(table) :where(td),:where(body) :where(table) :where(th){padding:3px 7px;border-width:1px}:where(body) :where(table) :where(caption){border-width:1px;font-style:var(--bfont-caption-style);font-variant:var(--bfont-caption-variant);font-weight:var(--bfont-caption-weight);font-stretch:var(--bfont-caption-stretch);line-height:var(--bfont-caption-height);font-family:var(--bfont-caption-family)}:where(body) :where(table) :where(caption):where(.table-caption-top){caption-side:top;border-bottom-width:0}:where(body) :where(table) :where(caption):where(.table-caption-bottom){caption-side:bottom;border-top-width:0}:where(body) :where(table):where(.panel){display:table}:where(body) :where(table):where(.panel) :where(td),:where(body) :where(table):where(.panel) :where(th){padding:8px}:where(body) :where(table):where(.panel) :where(caption){text-align:inherit;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));padding:8px}:where(body) :where(table):where(.panel) :where(caption) :where(*){margin-top:8px;margin-bottom:8px}:where(body) :where(table):where(.panel) :where(caption) :where(*):first-child{margin-top:0}:where(body) :where(table):where(.panel) :where(caption) :where(*):last-child{margin-bottom:0}:where(body) :where(table):where(.box) :where(tr){border-width:1px}:where(body) :where(table):where(.box) :where(td),:where(body) :where(table):where(.box) :where(th){border-width:1px;padding:7px}:where(body) :where(table):where(.box) :where(caption){border-width:2px;padding:6px}:where(body) :where(table):where(.box) :where(caption):where(.table-caption-top){border-bottom-width:0}:where(body) :where(table):where(.box) :where(caption):where(.table-caption-bottom){border-top-width:0}:where(body) :where(table):where(.dialog) :where(thead)>:where(tr){border-bottom-width:1px}:where(body) :where(table):where(.dialog) :where(tbody)>:where(tr){border-width:0}:where(body) :where(table):where(.dialog) :where(tfoot)>:where(tr){border-top-width:1px}:where(body) :where(table):where(.dialog) :where(td),:where(body) :where(table):where(.dialog) :where(th){border-width:0 0 0 1px;padding:8px 8px 8px 7px}:where(body) :where(table):where(.dialog) :where(caption){border-width:0 0 0 2px;padding:8px 8px 8px 6px}:where(body) :where(.panel)>:where(ol),:where(body) :where(.panel)>:where(ul){margin-left:6ex}:where(body) :where(dt){margin-top:.5em;padding:.2em 0;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family)}:where(body) :where(dd){margin-left:4.5ex;margin-bottom:.5em}:where(body) :where(details){margin-left:4.5ex}:where(body) :where(summary){cursor:pointer;margin-left:-4ex;padding:.2em 0;font-style:var(--bfont-summary-style);font-variant:var(--bfont-summary-variant);font-weight:var(--bfont-summary-weight);font-stretch:var(--bfont-summary-stretch);line-height:var(--bfont-summary-height);font-family:var(--bfont-summary-family);user-select:none}:where(body) :where(.fade){opacity:.3}:where(body) :where(mark,.mark){font-style:var(--bfont-mark-style);font-variant:var(--bfont-mark-variant);font-weight:var(--bfont-mark-weight);font-stretch:var(--bfont-mark-stretch);line-height:var(--bfont-mark-height);font-family:var(--bfont-mark-family);background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(body) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness)}:where(body) :where(mark,.mark) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(body) :where(.todo){--bhsl-current-hue:var(--bhsl-todo-foreground-hue);--bhsl-current-saturation:var(--bhsl-todo-foreground-saturation);--bhsl-current-lightness:var(--bhsl-todo-foreground-lightness)}:where(body) :where(.todo),:where(body) :where(.todo) :where(.panel){border-style:dashed;background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(body) :where([disabled]){border-style:dashed;cursor:not-allowed}:where(body) :where(.red){--bhsl-current-hue:var(--bhsl-red-hue);--bhsl-current-saturation:var(--bhsl-red-saturation);--bhsl-current-lightness:var(--bhsl-red-lightness)}:where(body) :where(.yellow){--bhsl-current-hue:var(--bhsl-yellow-hue);--bhsl-current-saturation:var(--bhsl-yellow-saturation);--bhsl-current-lightness:var(--bhsl-yellow-lightness)}:where(body) :where(.green){--bhsl-current-hue:var(--bhsl-green-hue);--bhsl-current-saturation:var(--bhsl-green-saturation);--bhsl-current-lightness:var(--bhsl-green-lightness)}:where(body) :where(.cyan){--bhsl-current-hue:var(--bhsl-cyan-hue);--bhsl-current-saturation:var(--bhsl-cyan-saturation);--bhsl-current-lightness:var(--bhsl-cyan-lightness)}:where(body) :where(.blue){--bhsl-current-hue:var(--bhsl-blue-hue);--bhsl-current-saturation:var(--bhsl-blue-saturation);--bhsl-current-lightness:var(--bhsl-blue-lightness)}:where(body) :where(.magenta){--bhsl-current-hue:var(--bhsl-magenta-hue);--bhsl-current-saturation:var(--bhsl-magenta-saturation);--bhsl-current-lightness:var(--bhsl-magenta-lightness)}:where(body) :where(input,textarea,select,button){font:inherit;cursor:pointer;background-color:transparent;padding:.125em .75ex;vertical-align:middle;min-width:0;border-width:0;border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(body) :where(input,textarea,select,button)::placeholder{opacity:1;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(body) :where(input,textarea,select,button):hover:not(:where([disabled])){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(input,textarea,select,button):hover:not(:where([disabled]))::placeholder{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(input,textarea,select,button):active:not(:where([disabled])),:where(body) :where(input,textarea,select,button):focus:not(:where([disabled])){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(body) :where(textarea){resize:vertical}:where(body) :where(input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=tel],input[type=datetime-local],input[type=date],input[type=time]),:where(body) :where(select:not([multiple])){border-bottom-width:2px}:where(body) :where(select[multiple]),:where(body) :where(textarea){border-left-width:2px}:where(body) :where(input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=tel],input[type=datetime-local],input[type=date],input[type=time]):not(:where([disabled])),:where(body) :where(textarea):not(:where([disabled])){cursor:text}:where(body) :where(select:not([multiple])):not(:where([disabled])),:where(body) :where(select[multiple]):not(:where([disabled])){cursor:vertical-text}:where(body) :where(input[type=range]):not(:where([disabled])){cursor:ew-resize}:where(body) :where(input[type=radio]):not(:where([disabled])),:where(body) :where(input[type=checkbox]):not(:where([disabled])),:where(body) :where(input[type=button],button):not(:where([disabled])),:where(body) :where(input[type=color]):not(:where([disabled])){cursor:pointer}:where(body) :where(select:not([multiple])) optgroup,:where(body) :where(select[multiple]) optgroup{padding-bottom:.25em;font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(body) :where(select:not([multiple])) optgroup option,:where(body) :where(select[multiple]) optgroup option{padding:.125em 0 .125em 2ex}:where(body) :where(select:not([multiple])) option,:where(body) :where(select[multiple]) option{font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}:where(body) :where(input[type=radio]),:where(body) :where(input[type=checkbox]){appearance:none;width:1em;height:1em;padding:2px;border-width:2px;display:inline-flex;justify-content:center;align-items:center}:where(body) :where(input[type=radio])::before,:where(body) :where(input[type=checkbox])::before{display:block;content:"";width:100%;height:100%}:where(body) :where(input[type=radio]):checked::before,:where(body) :where(input[type=checkbox]):checked::before{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(body) :where(input[type=radio]){border-radius:100%}:where(body) :where(input[type=radio])::before{border-radius:100%}:where(body) :where(input[type=range]){padding:0}:where(body) :where(input[type=button],button){border-width:2px;border-style:outset}:where(body) :where(input[type=button],button):active{border-style:inset}:where(body) :where(input[type=color]),:where(body) :where(input[type=file]){padding:0}@media screen and (-webkit-min-device-pixel-ratio:0){:where(body) :where(input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=tel],input[type=datetime-local],input[type=date],input[type=time])::-webkit-calendar-picker-indicator{filter:invert(calc(calc(var(--bhsl-current-lightness) - 50%) * 1000))}:where(body) :where(select:not([multiple])) optgroup,:where(body) :where(select:not([multiple])) option{background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body) :where(select:not([multiple])) optgroup::before,:where(body) :where(select:not([multiple])) option::before{content:""}}:where(body) :where(.form-flex){display:flex;flex-direction:column;justify-content:stretch}:where(body) :where(.form-flex)>:where(.form-flex-content,p){margin:.5em 0}:where(body) :where(.form-flex)>:where(.form-flex-choice,label){display:flex;gap:1ex;min-height:1.675em}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):first-child,:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):last-child{margin:auto 0;flex-basis:15%;flex-grow:0;flex-shrink:0;font-style:var(--bfont-label-style);font-variant:var(--bfont-label-variant);font-weight:var(--bfont-label-weight);font-stretch:var(--bfont-label-stretch);line-height:var(--bfont-label-height);font-family:var(--bfont-label-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*){flex-grow:1;display:flex;justify-content:space-between;flex-wrap:wrap;align-items:stretch;gap:1ex}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):first-child{text-align:right;display:block}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):last-child{text-align:left;display:block}:where(body) :where(a){--bhsl-current-hue:var(--bhsl-link-hue);--bhsl-current-saturation:var(--bhsl-link-saturation);--bhsl-current-lightness:var(--bhsl-link-lightness)}:where(body) :where(i){font-style:var(--bfont-idiomatic-style);font-variant:var(--bfont-idiomatic-variant);font-weight:var(--bfont-idiomatic-weight);font-stretch:var(--bfont-idiomatic-stretch);line-height:var(--bfont-idiomatic-height);font-family:var(--bfont-idiomatic-family)}:where(body) :where(em){font-style:var(--bfont-emphasis-style);font-variant:var(--bfont-emphasis-variant);font-weight:var(--bfont-emphasis-weight);font-stretch:var(--bfont-emphasis-stretch);line-height:var(--bfont-emphasis-height);font-family:var(--bfont-emphasis-family)}:where(body) :where(b){font-style:var(--bfont-attention-style);font-variant:var(--bfont-attention-variant);font-weight:var(--bfont-attention-weight);font-stretch:var(--bfont-attention-stretch);line-height:var(--bfont-attention-height);font-family:var(--bfont-attention-family)}:where(body) :where(strong){font-style:var(--bfont-strong-style);font-variant:var(--bfont-strong-variant);font-weight:var(--bfont-strong-weight);font-stretch:var(--bfont-strong-stretch);line-height:var(--bfont-strong-height);font-family:var(--bfont-strong-family)}:where(body) :where(ins){--bhsl-current-hue:var(--bhsl-inserted-hue);--bhsl-current-saturation:var(--bhsl-inserted-saturation);--bhsl-current-lightness:var(--bhsl-inserted-lightness)}:where(body) :where(del){--bhsl-current-hue:var(--bhsl-deleted-hue);--bhsl-current-saturation:var(--bhsl-deleted-saturation);--bhsl-current-lightness:var(--bhsl-deleted-lightness)}:where(body) :where(code),:where(body) :where(kbd),:where(body) :where(pre),:where(body) :where(samp){font-style:var(--bfont-code-style);font-variant:var(--bfont-code-variant);font-weight:var(--bfont-code-weight);font-stretch:var(--bfont-code-stretch);line-height:var(--bfont-code-height);font-family:var(--bfont-code-family)}:where(body) :where(pre){overflow-x:scroll}:where(body) :where(kbd),:where(body) :where(samp){padding:0 .25ex}:where(body) :where(kbd){background-color:hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness));--bhsl-current-hue:var(--bhsl-sample-input-hue);--bhsl-current-saturation:var(--bhsl-sample-input-saturation);--bhsl-current-lightness:var(--bhsl-sample-input-lightness)}:where(body) :where(kbd) :where(kbd){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(body) :where(samp){background-color:hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness));--bhsl-current-hue:var(--bhsl-sample-output-hue);--bhsl-current-saturation:var(--bhsl-sample-output-saturation);--bhsl-current-lightness:var(--bhsl-sample-output-lightness)}:where(body) :where(samp) :where(samp){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(body) :where(var){font-style:var(--bfont-variable-style);font-variant:var(--bfont-variable-variant);font-weight:var(--bfont-variable-weight);font-stretch:var(--bfont-variable-stretch);line-height:var(--bfont-variable-height);font-family:var(--bfont-variable-family)}:where(body) :where(cite){font-style:var(--bfont-citation-style);font-variant:var(--bfont-citation-variant);font-weight:var(--bfont-citation-weight);font-stretch:var(--bfont-citation-stretch);line-height:var(--bfont-citation-height);font-family:var(--bfont-citation-family)}:where(body) :where(dfn){font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(body) :where(abbr){cursor:help} \ No newline at end of file +:where(body){--bhsl-background-hue:0deg;--bhsl-background-saturation:0%;--bhsl-background-lightness:100%;--bhsl-foreground-hue:0deg;--bhsl-foreground-saturation:0%;--bhsl-foreground-lightness:15%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:0%;--bhsl-primary-lightness:0%;--bhsl-link-hue:210deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:30%;--bhsl-mark-foreground-hue:0deg;--bhsl-mark-foreground-saturation:0%;--bhsl-mark-foreground-lightness:0%;--bhsl-mark-background-hue:60deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:75%;--bhsl-todo-foreground-hue:204deg;--bhsl-todo-foreground-saturation:11%;--bhsl-todo-foreground-lightness:18%;--bhsl-todo-background-hue:43deg;--bhsl-todo-background-saturation:100%;--bhsl-todo-background-lightness:65%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:30%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:30%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:30%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:30%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:30%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:30%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness);--bfont-text-style:normal;--bfont-text-variant:normal;--bfont-text-weight:400;--bfont-text-stretch:normal;--bfont-text-height:1.3;--bfont-text-family:sans-serif;--bfont-header-style:normal;--bfont-header-variant:normal;--bfont-header-weight:600;--bfont-header-stretch:normal;--bfont-header-height:1.7;--bfont-header-family:sans-serif;--bfont-code-style:normal;--bfont-code-variant:normal;--bfont-code-weight:400;--bfont-code-stretch:normal;--bfont-code-height:1.3;--bfont-code-family:monospace;--bfont-boldcode-style:normal;--bfont-boldcode-variant:normal;--bfont-boldcode-weight:700;--bfont-boldcode-stretch:normal;--bfont-boldcode-height:1.3;--bfont-boldcode-family:monospace;--bfont-term-style:italic;--bfont-term-variant:normal;--bfont-term-weight:700;--bfont-term-stretch:normal;--bfont-term-height:1.3;--bfont-term-family:sans-serif;--bfont-summary-style:italic;--bfont-summary-variant:normal;--bfont-summary-weight:400;--bfont-summary-stretch:normal;--bfont-summary-height:1.3;--bfont-summary-family:sans-serif;--bfont-idiomatic-style:italic;--bfont-idiomatic-variant:normal;--bfont-idiomatic-weight:400;--bfont-idiomatic-stretch:normal;--bfont-idiomatic-height:1.3;--bfont-idiomatic-family:sans-serif;--bfont-emphasis-style:italic;--bfont-emphasis-variant:normal;--bfont-emphasis-weight:400;--bfont-emphasis-stretch:normal;--bfont-emphasis-height:1.3;--bfont-emphasis-family:sans-serif;--bfont-attention-style:normal;--bfont-attention-variant:normal;--bfont-attention-weight:700;--bfont-attention-stretch:normal;--bfont-attention-height:1.3;--bfont-attention-family:sans-serif;--bfont-strong-style:normal;--bfont-strong-variant:normal;--bfont-strong-weight:700;--bfont-strong-stretch:normal;--bfont-strong-height:1.3;--bfont-strong-family:sans-serif;--bfont-variable-style:normal;--bfont-variable-variant:normal;--bfont-variable-weight:400;--bfont-variable-stretch:normal;--bfont-variable-height:1.3;--bfont-variable-family:sans-serif;--bfont-citation-style:normal;--bfont-citation-variant:small-caps;--bfont-citation-weight:400;--bfont-citation-stretch:normal;--bfont-citation-height:1.3;--bfont-citation-family:sans-serif;--bfont-label-style:normal;--bfont-label-variant:normal;--bfont-label-weight:400;--bfont-label-stretch:normal;--bfont-label-height:1.3;--bfont-label-family:sans-serif;--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness);background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));background-position:center;background-size:cover;background-attachment:fixed;width:100%;height:100%;font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}@media screen{:where(body){background-image:var(--burl-background-full)}}@media screen and (max-width:3840px){:where(body){background-image:var(--burl-background-3840)}}@media screen and (max-width:1920px){:where(body){background-image:var(--burl-background-1920)}}@media screen and (max-width:1366px){:where(body){background-image:var(--burl-background-1366)}}@media screen and (max-width:640px){:where(body){background-image:var(--burl-background-640)}}@media screen and (max-width:360px){:where(body){background-image:var(--burl-background-360)}}:where(body),:where(body) :where(*){margin:0;padding:0;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));border-width:0;border-style:solid;scrollbar-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)) hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body),:where(body) :where(*),:where(body) :where(*)::after,:where(body) :where(*)::before,:where(body)::after,:where(body)::before{box-sizing:border-box}:where(body) :where(*):focus-visible,:where(body):focus-visible{outline-width:4px;outline-style:solid;outline-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .3)}:where(body) :where(footer),:where(body) :where(header){text-align:center}:where(body) :where(footer){margin:1rem 0;font-size:x-small}:where(body) :where(.float-top){margin-bottom:auto}:where(body) :where(.float-right){margin-left:auto}:where(body) :where(.float-bottom){margin-top:auto}:where(body) :where(.float-left){margin-right:auto}:where(body) :where(.float-hcenter){margin-left:auto;margin-right:auto}:where(body) :where(.float-vcenter){margin-top:auto;margin-bottom:auto}:where(body) :where(h1){font-size:2.5em}:where(body) :where(h2){font-size:1.75em}:where(body) :where(h1,h2,h3,h4,h5,h6){text-align:center;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(body) :where(.panel){padding-top:8px;padding-right:8px;padding-left:8px;padding-bottom:8px;border-width:0;border-style:solid;width:100%;display:flex;flex-direction:column;gap:8px;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}@media (max-width:492px){:where(body) :where(.panel){min-width:calc(100vw - 16px)}}@media (min-width:493px){:where(body) :where(.panel){min-width:476px}}:where(body) :where(.panel):where(.border-top),:where(body) :where(.panel):where(.box){border-top-width:2px;padding-top:6px}:where(body) :where(.panel):where(.border-right),:where(body) :where(.panel):where(.box){border-right-width:2px;padding-right:6px}:where(body) :where(.panel):where(.border-left),:where(body) :where(.panel):where(.box),:where(body) :where(.panel):where(.dialog){border-left-width:2px;padding-left:6px}:where(body) :where(.panel):where(.border-bottom),:where(body) :where(.panel):where(.box){border-bottom-width:2px;padding-bottom:6px}:where(body) :where(.panel):where(.parenthesis){font-size:smaller}:where(body) :where(.panel) :where(.panel){min-width:unset}:where(body) :where(.chapter-0){flex-wrap:nowrap}:where(body) :where(.chapter-0)>:where(*){flex-shrink:1}:where(body) :where(.chapter-1)>:where(*){flex-basis:calc(100% / 2)}:where(body) :where(.chapter-2)>:where(*){flex-basis:calc(100% / 3)}:where(body) :where(.chapter-3)>:where(*){flex-basis:calc(100% / 4)}:where(body) :where(.chapter-4)>:where(*){flex-basis:calc(100% / 5)}:where(body) :where(.chapter-5)>:where(*){flex-basis:calc(100% / 6)}:where(body) :where(.chapter-6)>:where(*){flex-basis:calc(100% / 7)}:where(body) :where(.chapter-7)>:where(*){flex-basis:calc(100% / 8)}:where(body) :where(.chapter-8)>:where(*){flex-basis:calc(100% / 9)}:where(body) :where(.chapter-9)>:where(*){flex-basis:calc(100% / 10)}:where(body) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9){display:flex;flex-wrap:wrap;flex-direction:row;gap:8px;justify-content:center;align-items:stretch;margin:8px 0}:where(body) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(*){flex-grow:1;flex-shrink:0}:where(body) :where(.chapter-0,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9)>:where(h1,h2,h3,h4,h5,h6){flex-basis:100%;margin-top:1.2em}:where(body) :where(hr){border-width:1px;border-style:dashed}:where(body) :where(.separator-light){border-style:dotted}:where(body) :where(.separator-heavy){border-style:solid}:where(body) :where(img){display:block;max-width:100%;object-fit:contain}:where(body) :where(.image-limit-half){max-height:max(28.2vw,50vh)}:where(body) :where(.image-limit-quarter){max-height:max(14.1vw,25vh)}:where(body) :where(table){border-collapse:collapse}:where(body) :where(table) :where(td),:where(body) :where(table) :where(th){padding:3px 7px;border-width:1px}:where(body) :where(table) :where(caption){border-width:1px;font-style:var(--bfont-caption-style);font-variant:var(--bfont-caption-variant);font-weight:var(--bfont-caption-weight);font-stretch:var(--bfont-caption-stretch);line-height:var(--bfont-caption-height);font-family:var(--bfont-caption-family)}:where(body) :where(table) :where(caption):where(.table-caption-top){caption-side:top;border-bottom-width:0}:where(body) :where(table) :where(caption):where(.table-caption-bottom){caption-side:bottom;border-top-width:0}:where(body) :where(table):where(.panel){display:table}:where(body) :where(table):where(.panel) :where(td),:where(body) :where(table):where(.panel) :where(th){padding:8px}:where(body) :where(table):where(.panel) :where(caption){text-align:inherit;background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));padding:8px}:where(body) :where(table):where(.panel) :where(caption) :where(*){margin-top:8px;margin-bottom:8px}:where(body) :where(table):where(.panel) :where(caption) :where(*):first-child{margin-top:0}:where(body) :where(table):where(.panel) :where(caption) :where(*):last-child{margin-bottom:0}:where(body) :where(table):where(.box) :where(tr){border-width:1px}:where(body) :where(table):where(.box) :where(td),:where(body) :where(table):where(.box) :where(th){border-width:1px;padding:7px}:where(body) :where(table):where(.box) :where(caption){border-width:2px;padding:6px}:where(body) :where(table):where(.box) :where(caption):where(.table-caption-top){border-bottom-width:0}:where(body) :where(table):where(.box) :where(caption):where(.table-caption-bottom){border-top-width:0}:where(body) :where(table):where(.dialog) :where(thead)>:where(tr){border-bottom-width:1px}:where(body) :where(table):where(.dialog) :where(tbody)>:where(tr){border-width:0}:where(body) :where(table):where(.dialog) :where(tfoot)>:where(tr){border-top-width:1px}:where(body) :where(table):where(.dialog) :where(td),:where(body) :where(table):where(.dialog) :where(th){border-width:0 0 0 1px;padding:8px 8px 8px 7px}:where(body) :where(table):where(.dialog) :where(caption){border-width:0 0 0 2px;padding:8px 8px 8px 6px}:where(body) :where(.panel)>:where(ol),:where(body) :where(.panel)>:where(ul){margin-left:6ex}:where(body) :where(dt){margin-top:.5em;padding:.2em 0;--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness);font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family)}:where(body) :where(dd){margin-left:4.5ex;margin-bottom:.5em}:where(body) :where(details){margin-left:4.5ex}:where(body) :where(summary){cursor:pointer;margin-left:-4ex;padding:.2em 0;font-style:var(--bfont-summary-style);font-variant:var(--bfont-summary-variant);font-weight:var(--bfont-summary-weight);font-stretch:var(--bfont-summary-stretch);line-height:var(--bfont-summary-height);font-family:var(--bfont-summary-family);user-select:none}:where(body) :where(.fade){opacity:.3}:where(body) :where(mark,.mark){font-style:var(--bfont-mark-style);font-variant:var(--bfont-mark-variant);font-weight:var(--bfont-mark-weight);font-stretch:var(--bfont-mark-stretch);line-height:var(--bfont-mark-height);font-family:var(--bfont-mark-family);background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(body) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness));--bhsl-current-hue:var(--bhsl-foreground-hue);--bhsl-current-saturation:var(--bhsl-foreground-saturation);--bhsl-current-lightness:var(--bhsl-foreground-lightness)}:where(body) :where(mark,.mark) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));--bhsl-current-hue:var(--bhsl-mark-foreground-hue);--bhsl-current-saturation:var(--bhsl-mark-foreground-saturation);--bhsl-current-lightness:var(--bhsl-mark-foreground-lightness)}:where(body) :where(.todo){--bhsl-current-hue:var(--bhsl-todo-foreground-hue);--bhsl-current-saturation:var(--bhsl-todo-foreground-saturation);--bhsl-current-lightness:var(--bhsl-todo-foreground-lightness)}:where(body) :where(.todo),:where(body) :where(.todo) :where(.panel){border-style:dashed;background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(body) :where([disabled]){border-style:dashed;cursor:not-allowed}:where(body) :where(.red){--bhsl-current-hue:var(--bhsl-red-hue);--bhsl-current-saturation:var(--bhsl-red-saturation);--bhsl-current-lightness:var(--bhsl-red-lightness)}:where(body) :where(.yellow){--bhsl-current-hue:var(--bhsl-yellow-hue);--bhsl-current-saturation:var(--bhsl-yellow-saturation);--bhsl-current-lightness:var(--bhsl-yellow-lightness)}:where(body) :where(.green){--bhsl-current-hue:var(--bhsl-green-hue);--bhsl-current-saturation:var(--bhsl-green-saturation);--bhsl-current-lightness:var(--bhsl-green-lightness)}:where(body) :where(.cyan){--bhsl-current-hue:var(--bhsl-cyan-hue);--bhsl-current-saturation:var(--bhsl-cyan-saturation);--bhsl-current-lightness:var(--bhsl-cyan-lightness)}:where(body) :where(.blue){--bhsl-current-hue:var(--bhsl-blue-hue);--bhsl-current-saturation:var(--bhsl-blue-saturation);--bhsl-current-lightness:var(--bhsl-blue-lightness)}:where(body) :where(.magenta){--bhsl-current-hue:var(--bhsl-magenta-hue);--bhsl-current-saturation:var(--bhsl-magenta-saturation);--bhsl-current-lightness:var(--bhsl-magenta-lightness)}:where(body) :where(input,textarea,select,button){font:inherit;cursor:pointer;background-color:transparent;padding:.125em .75ex;vertical-align:middle;min-width:0;border-width:0;border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(body) :where(input,textarea,select,button)::placeholder{opacity:1;color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .4)}:where(body) :where(input,textarea,select,button):hover:not(:where([disabled])){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(input,textarea,select,button):hover:not(:where([disabled]))::placeholder{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(input,textarea,select,button):active:not(:where([disabled])),:where(body) :where(input,textarea,select,button):focus:not(:where([disabled])){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(body) :where(textarea){resize:vertical}:where(body) :where(input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=tel],input[type=datetime-local],input[type=date],input[type=time]),:where(body) :where(select:not([multiple])){border-bottom-width:2px}:where(body) :where(select[multiple]),:where(body) :where(textarea){border-left-width:2px}:where(body) :where(input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=tel],input[type=datetime-local],input[type=date],input[type=time]):not(:where([disabled])),:where(body) :where(textarea):not(:where([disabled])){cursor:text}:where(body) :where(select:not([multiple])):not(:where([disabled])),:where(body) :where(select[multiple]):not(:where([disabled])){cursor:vertical-text}:where(body) :where(input[type=range]):not(:where([disabled])){cursor:ew-resize}:where(body) :where(input[type=radio]):not(:where([disabled])),:where(body) :where(input[type=checkbox]):not(:where([disabled])),:where(body) :where(input[type=button],button):not(:where([disabled])),:where(body) :where(input[type=color]):not(:where([disabled])){cursor:pointer}:where(body) :where(select:not([multiple])) optgroup,:where(body) :where(select[multiple]) optgroup{padding-bottom:.25em;font-style:var(--bfont-header-style);font-variant:var(--bfont-header-variant);font-weight:var(--bfont-header-weight);font-stretch:var(--bfont-header-stretch);line-height:var(--bfont-header-height);font-family:var(--bfont-header-family)}:where(body) :where(select:not([multiple])) optgroup option,:where(body) :where(select[multiple]) optgroup option{padding:.125em 0 .125em 2ex}:where(body) :where(select:not([multiple])) option,:where(body) :where(select[multiple]) option{font-style:var(--bfont-text-style);font-variant:var(--bfont-text-variant);font-weight:var(--bfont-text-weight);font-stretch:var(--bfont-text-stretch);line-height:var(--bfont-text-height);font-family:var(--bfont-text-family)}:where(body) :where(input[type=radio]),:where(body) :where(input[type=checkbox]){appearance:none;width:1em;height:1em;padding:2px;border-width:2px;display:inline-flex;justify-content:center;align-items:center}:where(body) :where(input[type=radio])::before,:where(body) :where(input[type=checkbox])::before{display:block;content:"";width:100%;height:100%}:where(body) :where(input[type=radio]):checked::before,:where(body) :where(input[type=checkbox]):checked::before{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(body) :where(input[type=radio]){border-radius:100%}:where(body) :where(input[type=radio])::before{border-radius:100%}:where(body) :where(input[type=range]){padding:0}:where(body) :where(input[type=button],button){border-width:2px;border-style:outset}:where(body) :where(input[type=button],button):active{border-style:inset}:where(body) :where(input[type=color]),:where(body) :where(input[type=file]){padding:0}@media screen and (-webkit-min-device-pixel-ratio:0){:where(body) :where(input[type=text],input[type=password],input[type=email],input[type=number],input[type=search],input[type=tel],input[type=datetime-local],input[type=date],input[type=time])::-webkit-calendar-picker-indicator{filter:invert(calc(calc(var(--bhsl-current-lightness) - 50%) * 1000))}:where(body) :where(select:not([multiple])) optgroup,:where(body) :where(select:not([multiple])) option{background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body) :where(select:not([multiple])) optgroup::before,:where(body) :where(select:not([multiple])) option::before{content:""}}:where(body) :where(.form-flex){display:flex;flex-direction:column;justify-content:stretch}:where(body) :where(.form-flex)>:where(.form-flex-content,p){margin:.5em 0}:where(body) :where(.form-flex)>:where(.form-flex-choice,label){display:flex;gap:1ex;min-height:1.675em}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):first-child,:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):last-child{margin:auto 0;flex-basis:15%;flex-grow:0;flex-shrink:0;font-style:var(--bfont-label-style);font-variant:var(--bfont-label-variant);font-weight:var(--bfont-label-weight);font-stretch:var(--bfont-label-stretch);line-height:var(--bfont-label-height);font-family:var(--bfont-label-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*){flex-grow:1;display:flex;justify-content:space-between;flex-wrap:wrap;align-items:stretch;gap:1ex}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):first-child{text-align:right;display:block}:where(body) :where(.form-flex)>:where(.form-flex-choice,label)>:where(*):last-child{text-align:left;display:block}:where(body) :where(a){--bhsl-current-hue:var(--bhsl-link-hue);--bhsl-current-saturation:var(--bhsl-link-saturation);--bhsl-current-lightness:var(--bhsl-link-lightness)}:where(body) :where(i){font-style:var(--bfont-idiomatic-style);font-variant:var(--bfont-idiomatic-variant);font-weight:var(--bfont-idiomatic-weight);font-stretch:var(--bfont-idiomatic-stretch);line-height:var(--bfont-idiomatic-height);font-family:var(--bfont-idiomatic-family)}:where(body) :where(em){font-style:var(--bfont-emphasis-style);font-variant:var(--bfont-emphasis-variant);font-weight:var(--bfont-emphasis-weight);font-stretch:var(--bfont-emphasis-stretch);line-height:var(--bfont-emphasis-height);font-family:var(--bfont-emphasis-family)}:where(body) :where(b){font-style:var(--bfont-attention-style);font-variant:var(--bfont-attention-variant);font-weight:var(--bfont-attention-weight);font-stretch:var(--bfont-attention-stretch);line-height:var(--bfont-attention-height);font-family:var(--bfont-attention-family)}:where(body) :where(strong){font-style:var(--bfont-strong-style);font-variant:var(--bfont-strong-variant);font-weight:var(--bfont-strong-weight);font-stretch:var(--bfont-strong-stretch);line-height:var(--bfont-strong-height);font-family:var(--bfont-strong-family)}:where(body) :where(ins){--bhsl-current-hue:var(--bhsl-inserted-hue);--bhsl-current-saturation:var(--bhsl-inserted-saturation);--bhsl-current-lightness:var(--bhsl-inserted-lightness)}:where(body) :where(del){--bhsl-current-hue:var(--bhsl-deleted-hue);--bhsl-current-saturation:var(--bhsl-deleted-saturation);--bhsl-current-lightness:var(--bhsl-deleted-lightness)}:where(body) :where(code),:where(body) :where(kbd),:where(body) :where(pre),:where(body) :where(samp){font-style:var(--bfont-code-style);font-variant:var(--bfont-code-variant);font-weight:var(--bfont-code-weight);font-stretch:var(--bfont-code-stretch);line-height:var(--bfont-code-height);font-family:var(--bfont-code-family)}:where(body) :where(code) :where(b),:where(body) :where(kbd) :where(b),:where(body) :where(pre) :where(b),:where(body) :where(samp) :where(b){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(body) :where(pre){overflow-x:scroll}:where(body) :where(kbd),:where(body) :where(samp){padding:0 .35ex;border-width:1px;border-style:solid}:where(body) :where(kbd) :where(kbd),:where(body) :where(kbd) :where(samp),:where(body) :where(samp) :where(kbd),:where(body) :where(samp) :where(samp){border-width:0}:where(body) :where(kbd){background-color:hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness));border-color:hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness));--bhsl-current-hue:var(--bhsl-sample-input-hue);--bhsl-current-saturation:var(--bhsl-sample-input-saturation);--bhsl-current-lightness:var(--bhsl-sample-input-lightness)}:where(body) :where(kbd) :where(kbd){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(body) :where(samp){background-color:hsl(var(--bhsl-sample-input-hue) var(--bhsl-sample-input-saturation) var(--bhsl-sample-input-lightness));border-color:hsl(var(--bhsl-sample-output-hue) var(--bhsl-sample-output-saturation) var(--bhsl-sample-output-lightness));--bhsl-current-hue:var(--bhsl-sample-output-hue);--bhsl-current-saturation:var(--bhsl-sample-output-saturation);--bhsl-current-lightness:var(--bhsl-sample-output-lightness)}:where(body) :where(samp) :where(samp){font-style:var(--bfont-boldcode-style);font-variant:var(--bfont-boldcode-variant);font-weight:var(--bfont-boldcode-weight);font-stretch:var(--bfont-boldcode-stretch);line-height:var(--bfont-boldcode-height);font-family:var(--bfont-boldcode-family)}:where(body) :where(var){font-style:var(--bfont-variable-style);font-variant:var(--bfont-variable-variant);font-weight:var(--bfont-variable-weight);font-stretch:var(--bfont-variable-stretch);line-height:var(--bfont-variable-height);font-family:var(--bfont-variable-family)}:where(body) :where(cite){font-style:var(--bfont-citation-style);font-variant:var(--bfont-citation-variant);font-weight:var(--bfont-citation-weight);font-stretch:var(--bfont-citation-stretch);line-height:var(--bfont-citation-height);font-family:var(--bfont-citation-family)}:where(body) :where(dfn){font-style:var(--bfont-term-style);font-variant:var(--bfont-term-variant);font-weight:var(--bfont-term-weight);font-stretch:var(--bfont-term-stretch);line-height:var(--bfont-term-height);font-family:var(--bfont-term-family);--bhsl-current-hue:var(--bhsl-primary-hue);--bhsl-current-saturation:var(--bhsl-primary-saturation);--bhsl-current-lightness:var(--bhsl-primary-lightness)}:where(body) :where(abbr){cursor:help} \ No newline at end of file diff --git a/dist/classic.module.less b/dist/classic.module.less index d9958ea..d03bca1 100644 --- a/dist/classic.module.less +++ b/dist/classic.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/classic.root.less b/dist/classic.root.less index 4fc0cb2..bffb2ef 100644 --- a/dist/classic.root.less +++ b/dist/classic.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-amber.module.css b/dist/colors-amber.module.css index 50d683a..3dd5f97 100644 --- a/dist/colors-amber.module.css +++ b/dist/colors-amber.module.css @@ -3,59 +3,67 @@ * by * ported to v5 by */ -:where(.bluelib) { - --bhsl-background-hue: 0deg; - --bhsl-background-saturation: 8%; - --bhsl-background-lightness: 14%; - --bhsl-foreground-hue: 19deg; - --bhsl-foreground-saturation: 91%; - --bhsl-foreground-lightness: 46%; - --bhsl-primary-hue: 0deg; - --bhsl-primary-saturation: 42%; - --bhsl-primary-lightness: 94%; - --bhsl-link-hue: 50deg; - --bhsl-link-saturation: 100%; - --bhsl-link-lightness: 80%; - --bhsl-mark-foreground-hue: 19deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 19deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 81%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 66%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 66%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 66%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 66%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 66%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 66%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); +@media screen { + :where(.bluelib) { + --burl-background-full: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/.jpg); + --burl-background-3840: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/3840.jpg); + --burl-background-1920: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1920.jpg); + --burl-background-1366: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1366.jpg); + --burl-background-640: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/640.jpg); + --burl-background-360: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/360.jpg); + --bhsl-background-hue: 0deg; + --bhsl-background-saturation: 8%; + --bhsl-background-lightness: 14%; + --bhsl-foreground-hue: 19deg; + --bhsl-foreground-saturation: 91%; + --bhsl-foreground-lightness: 46%; + --bhsl-primary-hue: 0deg; + --bhsl-primary-saturation: 42%; + --bhsl-primary-lightness: 94%; + --bhsl-link-hue: 50deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 80%; + --bhsl-mark-foreground-hue: 19deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 19deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 81%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 66%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 66%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 66%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 66%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 66%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 66%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + } } diff --git a/dist/colors-amber.module.less b/dist/colors-amber.module.less index e5ae6e7..3dc434e 100644 --- a/dist/colors-amber.module.less +++ b/dist/colors-amber.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-amber.module.min.css b/dist/colors-amber.module.min.css index e105029..09f9bd1 100644 --- a/dist/colors-amber.module.min.css +++ b/dist/colors-amber.module.min.css @@ -1 +1 @@ -:where(.bluelib){--bhsl-background-hue:0deg;--bhsl-background-saturation:8%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:19deg;--bhsl-foreground-saturation:91%;--bhsl-foreground-lightness:46%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:42%;--bhsl-primary-lightness:94%;--bhsl-link-hue:50deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:80%;--bhsl-mark-foreground-hue:19deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:19deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:66%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:66%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:66%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:66%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:66%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:66%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)} \ No newline at end of file +@media screen{:where(.bluelib){--burl-background-full:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/.jpg);--burl-background-3840:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/3840.jpg);--burl-background-1920:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1920.jpg);--burl-background-1366:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1366.jpg);--burl-background-640:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/640.jpg);--burl-background-360:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/360.jpg);--bhsl-background-hue:0deg;--bhsl-background-saturation:8%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:19deg;--bhsl-foreground-saturation:91%;--bhsl-foreground-lightness:46%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:42%;--bhsl-primary-lightness:94%;--bhsl-link-hue:50deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:80%;--bhsl-mark-foreground-hue:19deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:19deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:66%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:66%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:66%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:66%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:66%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:66%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}} \ No newline at end of file diff --git a/dist/colors-amber.root.css b/dist/colors-amber.root.css index 9e359e4..b8d2f77 100644 --- a/dist/colors-amber.root.css +++ b/dist/colors-amber.root.css @@ -3,59 +3,67 @@ * by * ported to v5 by */ -:where(body) { - --bhsl-background-hue: 0deg; - --bhsl-background-saturation: 8%; - --bhsl-background-lightness: 14%; - --bhsl-foreground-hue: 19deg; - --bhsl-foreground-saturation: 91%; - --bhsl-foreground-lightness: 46%; - --bhsl-primary-hue: 0deg; - --bhsl-primary-saturation: 42%; - --bhsl-primary-lightness: 94%; - --bhsl-link-hue: 50deg; - --bhsl-link-saturation: 100%; - --bhsl-link-lightness: 80%; - --bhsl-mark-foreground-hue: 19deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 19deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 81%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 66%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 66%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 66%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 66%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 66%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 66%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); +@media screen { + :where(body) { + --burl-background-full: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/.jpg); + --burl-background-3840: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/3840.jpg); + --burl-background-1920: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1920.jpg); + --burl-background-1366: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1366.jpg); + --burl-background-640: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/640.jpg); + --burl-background-360: url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/360.jpg); + --bhsl-background-hue: 0deg; + --bhsl-background-saturation: 8%; + --bhsl-background-lightness: 14%; + --bhsl-foreground-hue: 19deg; + --bhsl-foreground-saturation: 91%; + --bhsl-foreground-lightness: 46%; + --bhsl-primary-hue: 0deg; + --bhsl-primary-saturation: 42%; + --bhsl-primary-lightness: 94%; + --bhsl-link-hue: 50deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 80%; + --bhsl-mark-foreground-hue: 19deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 19deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 81%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 66%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 66%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 66%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 66%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 66%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 66%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + } } diff --git a/dist/colors-amber.root.less b/dist/colors-amber.root.less index 4efeba4..77966b7 100644 --- a/dist/colors-amber.root.less +++ b/dist/colors-amber.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-amber.root.min.css b/dist/colors-amber.root.min.css index 4716ad4..7292d26 100644 --- a/dist/colors-amber.root.min.css +++ b/dist/colors-amber.root.min.css @@ -1 +1 @@ -:where(body){--bhsl-background-hue:0deg;--bhsl-background-saturation:8%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:19deg;--bhsl-foreground-saturation:91%;--bhsl-foreground-lightness:46%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:42%;--bhsl-primary-lightness:94%;--bhsl-link-hue:50deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:80%;--bhsl-mark-foreground-hue:19deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:19deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:66%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:66%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:66%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:66%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:66%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:66%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)} \ No newline at end of file +@media screen{:where(body){--burl-background-full:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/.jpg);--burl-background-3840:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/3840.jpg);--burl-background-1920:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1920.jpg);--burl-background-1366:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/1366.jpg);--burl-background-640:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/640.jpg);--burl-background-360:url(../images/anastasiia-chepinska-lcfH0p6emhw-unsplash-edited/360.jpg);--bhsl-background-hue:0deg;--bhsl-background-saturation:8%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:19deg;--bhsl-foreground-saturation:91%;--bhsl-foreground-lightness:46%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:42%;--bhsl-primary-lightness:94%;--bhsl-link-hue:50deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:80%;--bhsl-mark-foreground-hue:19deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:19deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:66%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:66%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:66%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:66%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:66%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:66%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}} \ No newline at end of file diff --git a/dist/colors-pixeldawn.module.css b/dist/colors-pixeldawn.module.css index acbe4dd..f9573ea 100644 --- a/dist/colors-pixeldawn.module.css +++ b/dist/colors-pixeldawn.module.css @@ -2,94 +2,102 @@ * Bluelib Royal Dawn Colors * by */ -:where(.bluelib) { - --bhsl-background-hue: 14deg; - --bhsl-background-saturation: 85%; - --bhsl-background-lightness: 74%; - --bhsl-foreground-hue: 340deg; - --bhsl-foreground-saturation: 40%; - --bhsl-foreground-lightness: 20%; - --bhsl-primary-hue: 220deg; - --bhsl-primary-saturation: 92%; - --bhsl-primary-lightness: 11%; - --bhsl-link-hue: 237deg; - --bhsl-link-saturation: 80%; - --bhsl-link-lightness: 41%; - --bhsl-mark-foreground-hue: 194deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 194deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 81%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 15%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 15%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 15%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 15%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 15%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 15%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); - /* - @{panel} { - - @{panel} { - background-color: .hsl-group(background; 0; - 8%; - 5%; 1.0)[@c] !important; - - @{panel} { - background-color: .hsl-group(background; 0; - 16%; - 10%; 1.0)[@c] !important; - } - } - } - */ -} -:where(.bluelib):is(:where(.bluelib)) { - --b-panel-initial-opacity: 0.5; - --b-border-radius: 0; - --b-outer-shadow: none; -} -:where(.bluelib):is(:where(.bluelib)) :where(.header-1), -:where(.bluelib):is(:where(.bluelib)) :where(.header-2), -:where(.bluelib):is(:where(.bluelib)) :where(.header-3), -:where(.bluelib):is(:where(.bluelib)) :where(.header-4), -:where(.bluelib):is(:where(.bluelib)) :where(.header-5), -:where(.bluelib):is(:where(.bluelib)) :where(.header-6) { - color: white; - text-shadow: 2px 2px 0 #9832ce; -} -:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-1), -:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-2), -:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-3), -:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-4), -:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-5), -:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-6) { - color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); - text-shadow: none; +@media screen { + :where(.bluelib) { + --burl-background-full: url(../images/viktya-pixeldawn/full.png); + --burl-background-3840: url(../images/viktya-pixeldawn/full.png); + --burl-background-1920: url(../images/viktya-pixeldawn/full.png); + --burl-background-1366: url(../images/viktya-pixeldawn/full.png); + --burl-background-640: url(../images/viktya-pixeldawn/full.png); + --burl-background-360: url(../images/viktya-pixeldawn/full.png); + --bhsl-background-hue: 14deg; + --bhsl-background-saturation: 85%; + --bhsl-background-lightness: 74%; + --bhsl-foreground-hue: 340deg; + --bhsl-foreground-saturation: 40%; + --bhsl-foreground-lightness: 20%; + --bhsl-primary-hue: 220deg; + --bhsl-primary-saturation: 92%; + --bhsl-primary-lightness: 11%; + --bhsl-link-hue: 237deg; + --bhsl-link-saturation: 80%; + --bhsl-link-lightness: 41%; + --bhsl-mark-foreground-hue: 194deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 194deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 81%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 15%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 15%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 15%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 15%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 15%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 15%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + /* + @{panel} { + + @{panel} { + background-color: .hsl-group(background; 0; - 8%; - 5%; 1.0)[@c] !important; + + @{panel} { + background-color: .hsl-group(background; 0; - 16%; - 10%; 1.0)[@c] !important; + } + } + } + */ + } + :where(.bluelib):is(:where(.bluelib)) { + --b-panel-initial-opacity: 0.5; + --b-border-radius: 0; + --b-outer-shadow: none; + } + :where(.bluelib):is(:where(.bluelib)) :where(.header-1), + :where(.bluelib):is(:where(.bluelib)) :where(.header-2), + :where(.bluelib):is(:where(.bluelib)) :where(.header-3), + :where(.bluelib):is(:where(.bluelib)) :where(.header-4), + :where(.bluelib):is(:where(.bluelib)) :where(.header-5), + :where(.bluelib):is(:where(.bluelib)) :where(.header-6) { + color: white; + text-shadow: 2px 2px 0 #9832ce; + } + :where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-1), + :where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-2), + :where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-3), + :where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-4), + :where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-5), + :where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-6) { + color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); + text-shadow: none; + } } diff --git a/dist/colors-pixeldawn.module.less b/dist/colors-pixeldawn.module.less index 7cdd819..4d0e90c 100644 --- a/dist/colors-pixeldawn.module.less +++ b/dist/colors-pixeldawn.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-pixeldawn.module.min.css b/dist/colors-pixeldawn.module.min.css index 2750b38..8d83e8d 100644 --- a/dist/colors-pixeldawn.module.min.css +++ b/dist/colors-pixeldawn.module.min.css @@ -1 +1 @@ -:where(.bluelib){--bhsl-background-hue:14deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:74%;--bhsl-foreground-hue:340deg;--bhsl-foreground-saturation:40%;--bhsl-foreground-lightness:20%;--bhsl-primary-hue:220deg;--bhsl-primary-saturation:92%;--bhsl-primary-lightness:11%;--bhsl-link-hue:237deg;--bhsl-link-saturation:80%;--bhsl-link-lightness:41%;--bhsl-mark-foreground-hue:194deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:194deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:15%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:15%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:15%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:15%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:15%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:15%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}:where(.bluelib):is(:where(.bluelib)){--b-panel-initial-opacity:0.5;--b-border-radius:0;--b-outer-shadow:none}:where(.bluelib):is(:where(.bluelib)) :where(.header-1),:where(.bluelib):is(:where(.bluelib)) :where(.header-2),:where(.bluelib):is(:where(.bluelib)) :where(.header-3),:where(.bluelib):is(:where(.bluelib)) :where(.header-4),:where(.bluelib):is(:where(.bluelib)) :where(.header-5),:where(.bluelib):is(:where(.bluelib)) :where(.header-6){color:#fff;text-shadow:2px 2px 0 #9832ce}:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-1),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-2),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-3),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-4),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-5),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-6){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));text-shadow:none} \ No newline at end of file +@media screen{:where(.bluelib){--burl-background-full:url(../images/viktya-pixeldawn/full.png);--burl-background-3840:url(../images/viktya-pixeldawn/full.png);--burl-background-1920:url(../images/viktya-pixeldawn/full.png);--burl-background-1366:url(../images/viktya-pixeldawn/full.png);--burl-background-640:url(../images/viktya-pixeldawn/full.png);--burl-background-360:url(../images/viktya-pixeldawn/full.png);--bhsl-background-hue:14deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:74%;--bhsl-foreground-hue:340deg;--bhsl-foreground-saturation:40%;--bhsl-foreground-lightness:20%;--bhsl-primary-hue:220deg;--bhsl-primary-saturation:92%;--bhsl-primary-lightness:11%;--bhsl-link-hue:237deg;--bhsl-link-saturation:80%;--bhsl-link-lightness:41%;--bhsl-mark-foreground-hue:194deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:194deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:15%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:15%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:15%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:15%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:15%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:15%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}:where(.bluelib):is(:where(.bluelib)){--b-panel-initial-opacity:0.5;--b-border-radius:0;--b-outer-shadow:none}:where(.bluelib):is(:where(.bluelib)) :where(.header-1),:where(.bluelib):is(:where(.bluelib)) :where(.header-2),:where(.bluelib):is(:where(.bluelib)) :where(.header-3),:where(.bluelib):is(:where(.bluelib)) :where(.header-4),:where(.bluelib):is(:where(.bluelib)) :where(.header-5),:where(.bluelib):is(:where(.bluelib)) :where(.header-6){color:#fff;text-shadow:2px 2px 0 #9832ce}:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-1),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-2),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-3),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-4),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-5),:where(.bluelib):is(:where(.bluelib)) :where(.panel) :where(.header-6){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));text-shadow:none}} \ No newline at end of file diff --git a/dist/colors-pixeldawn.root.css b/dist/colors-pixeldawn.root.css index 8c083dc..8ce267d 100644 --- a/dist/colors-pixeldawn.root.css +++ b/dist/colors-pixeldawn.root.css @@ -2,94 +2,102 @@ * Bluelib Royal Dawn Colors * by */ -:where(body) { - --bhsl-background-hue: 14deg; - --bhsl-background-saturation: 85%; - --bhsl-background-lightness: 74%; - --bhsl-foreground-hue: 340deg; - --bhsl-foreground-saturation: 40%; - --bhsl-foreground-lightness: 20%; - --bhsl-primary-hue: 220deg; - --bhsl-primary-saturation: 92%; - --bhsl-primary-lightness: 11%; - --bhsl-link-hue: 237deg; - --bhsl-link-saturation: 80%; - --bhsl-link-lightness: 41%; - --bhsl-mark-foreground-hue: 194deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 194deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 81%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 15%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 15%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 15%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 15%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 15%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 15%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); - /* - @{panel} { - - @{panel} { - background-color: .hsl-group(background; 0; - 8%; - 5%; 1.0)[@c] !important; - - @{panel} { - background-color: .hsl-group(background; 0; - 16%; - 10%; 1.0)[@c] !important; - } - } - } - */ -} -:where(body):is(:where(body)) { - --b-panel-initial-opacity: 0.5; - --b-border-radius: 0; - --b-outer-shadow: none; -} -:where(body):is(:where(body)) :where(h1), -:where(body):is(:where(body)) :where(h2), -:where(body):is(:where(body)) :where(h3), -:where(body):is(:where(body)) :where(h4), -:where(body):is(:where(body)) :where(h5), -:where(body):is(:where(body)) :where(h6) { - color: white; - text-shadow: 2px 2px 0 #9832ce; -} -:where(body):is(:where(body)) :where(.panel) :where(h1), -:where(body):is(:where(body)) :where(.panel) :where(h2), -:where(body):is(:where(body)) :where(.panel) :where(h3), -:where(body):is(:where(body)) :where(.panel) :where(h4), -:where(body):is(:where(body)) :where(.panel) :where(h5), -:where(body):is(:where(body)) :where(.panel) :where(h6) { - color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); - text-shadow: none; +@media screen { + :where(body) { + --burl-background-full: url(../images/viktya-pixeldawn/full.png); + --burl-background-3840: url(../images/viktya-pixeldawn/full.png); + --burl-background-1920: url(../images/viktya-pixeldawn/full.png); + --burl-background-1366: url(../images/viktya-pixeldawn/full.png); + --burl-background-640: url(../images/viktya-pixeldawn/full.png); + --burl-background-360: url(../images/viktya-pixeldawn/full.png); + --bhsl-background-hue: 14deg; + --bhsl-background-saturation: 85%; + --bhsl-background-lightness: 74%; + --bhsl-foreground-hue: 340deg; + --bhsl-foreground-saturation: 40%; + --bhsl-foreground-lightness: 20%; + --bhsl-primary-hue: 220deg; + --bhsl-primary-saturation: 92%; + --bhsl-primary-lightness: 11%; + --bhsl-link-hue: 237deg; + --bhsl-link-saturation: 80%; + --bhsl-link-lightness: 41%; + --bhsl-mark-foreground-hue: 194deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 194deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 81%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 15%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 15%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 15%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 15%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 15%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 15%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + /* + @{panel} { + + @{panel} { + background-color: .hsl-group(background; 0; - 8%; - 5%; 1.0)[@c] !important; + + @{panel} { + background-color: .hsl-group(background; 0; - 16%; - 10%; 1.0)[@c] !important; + } + } + } + */ + } + :where(body):is(:where(body)) { + --b-panel-initial-opacity: 0.5; + --b-border-radius: 0; + --b-outer-shadow: none; + } + :where(body):is(:where(body)) :where(h1), + :where(body):is(:where(body)) :where(h2), + :where(body):is(:where(body)) :where(h3), + :where(body):is(:where(body)) :where(h4), + :where(body):is(:where(body)) :where(h5), + :where(body):is(:where(body)) :where(h6) { + color: white; + text-shadow: 2px 2px 0 #9832ce; + } + :where(body):is(:where(body)) :where(.panel) :where(h1), + :where(body):is(:where(body)) :where(.panel) :where(h2), + :where(body):is(:where(body)) :where(.panel) :where(h3), + :where(body):is(:where(body)) :where(.panel) :where(h4), + :where(body):is(:where(body)) :where(.panel) :where(h5), + :where(body):is(:where(body)) :where(.panel) :where(h6) { + color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); + text-shadow: none; + } } diff --git a/dist/colors-pixeldawn.root.less b/dist/colors-pixeldawn.root.less index 25a7e14..4388993 100644 --- a/dist/colors-pixeldawn.root.less +++ b/dist/colors-pixeldawn.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-pixeldawn.root.min.css b/dist/colors-pixeldawn.root.min.css index 17ad736..2993928 100644 --- a/dist/colors-pixeldawn.root.min.css +++ b/dist/colors-pixeldawn.root.min.css @@ -1 +1 @@ -:where(body){--bhsl-background-hue:14deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:74%;--bhsl-foreground-hue:340deg;--bhsl-foreground-saturation:40%;--bhsl-foreground-lightness:20%;--bhsl-primary-hue:220deg;--bhsl-primary-saturation:92%;--bhsl-primary-lightness:11%;--bhsl-link-hue:237deg;--bhsl-link-saturation:80%;--bhsl-link-lightness:41%;--bhsl-mark-foreground-hue:194deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:194deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:15%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:15%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:15%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:15%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:15%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:15%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}:where(body):is(:where(body)){--b-panel-initial-opacity:0.5;--b-border-radius:0;--b-outer-shadow:none}:where(body):is(:where(body)) :where(h1),:where(body):is(:where(body)) :where(h2),:where(body):is(:where(body)) :where(h3),:where(body):is(:where(body)) :where(h4),:where(body):is(:where(body)) :where(h5),:where(body):is(:where(body)) :where(h6){color:#fff;text-shadow:2px 2px 0 #9832ce}:where(body):is(:where(body)) :where(.panel) :where(h1),:where(body):is(:where(body)) :where(.panel) :where(h2),:where(body):is(:where(body)) :where(.panel) :where(h3),:where(body):is(:where(body)) :where(.panel) :where(h4),:where(body):is(:where(body)) :where(.panel) :where(h5),:where(body):is(:where(body)) :where(.panel) :where(h6){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));text-shadow:none} \ No newline at end of file +@media screen{:where(body){--burl-background-full:url(../images/viktya-pixeldawn/full.png);--burl-background-3840:url(../images/viktya-pixeldawn/full.png);--burl-background-1920:url(../images/viktya-pixeldawn/full.png);--burl-background-1366:url(../images/viktya-pixeldawn/full.png);--burl-background-640:url(../images/viktya-pixeldawn/full.png);--burl-background-360:url(../images/viktya-pixeldawn/full.png);--bhsl-background-hue:14deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:74%;--bhsl-foreground-hue:340deg;--bhsl-foreground-saturation:40%;--bhsl-foreground-lightness:20%;--bhsl-primary-hue:220deg;--bhsl-primary-saturation:92%;--bhsl-primary-lightness:11%;--bhsl-link-hue:237deg;--bhsl-link-saturation:80%;--bhsl-link-lightness:41%;--bhsl-mark-foreground-hue:194deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:194deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:15%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:15%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:15%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:15%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:15%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:15%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}:where(body):is(:where(body)){--b-panel-initial-opacity:0.5;--b-border-radius:0;--b-outer-shadow:none}:where(body):is(:where(body)) :where(h1),:where(body):is(:where(body)) :where(h2),:where(body):is(:where(body)) :where(h3),:where(body):is(:where(body)) :where(h4),:where(body):is(:where(body)) :where(h5),:where(body):is(:where(body)) :where(h6){color:#fff;text-shadow:2px 2px 0 #9832ce}:where(body):is(:where(body)) :where(.panel) :where(h1),:where(body):is(:where(body)) :where(.panel) :where(h2),:where(body):is(:where(body)) :where(.panel) :where(h3),:where(body):is(:where(body)) :where(.panel) :where(h4),:where(body):is(:where(body)) :where(.panel) :where(h5),:where(body):is(:where(body)) :where(.panel) :where(h6){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness));text-shadow:none}} \ No newline at end of file diff --git a/dist/colors-purplestar.module.css b/dist/colors-purplestar.module.css index 1bddd97..87bd61f 100644 --- a/dist/colors-purplestar.module.css +++ b/dist/colors-purplestar.module.css @@ -2,59 +2,67 @@ * Bluelib Purple Star Colors * by */ -:where(.bluelib) { - --bhsl-background-hue: 262deg; - --bhsl-background-saturation: 85%; - --bhsl-background-lightness: 13%; - --bhsl-foreground-hue: 262deg; - --bhsl-foreground-saturation: 100%; - --bhsl-foreground-lightness: 78%; - --bhsl-primary-hue: 53deg; - --bhsl-primary-saturation: 100%; - --bhsl-primary-lightness: 100%; - --bhsl-link-hue: 53deg; - --bhsl-link-saturation: 100%; - --bhsl-link-lightness: 72%; - --bhsl-mark-foreground-hue: 53deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 53deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 72%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 75%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 75%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 75%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 75%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 75%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 75%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); +@media screen { + :where(.bluelib) { + --burl-background-full: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/.jpg); + --burl-background-3840: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/3840.jpg); + --burl-background-1920: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1920.jpg); + --burl-background-1366: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1366.jpg); + --burl-background-640: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/640.jpg); + --burl-background-360: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/360.jpg); + --bhsl-background-hue: 262deg; + --bhsl-background-saturation: 85%; + --bhsl-background-lightness: 13%; + --bhsl-foreground-hue: 262deg; + --bhsl-foreground-saturation: 100%; + --bhsl-foreground-lightness: 78%; + --bhsl-primary-hue: 53deg; + --bhsl-primary-saturation: 100%; + --bhsl-primary-lightness: 100%; + --bhsl-link-hue: 53deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 72%; + --bhsl-mark-foreground-hue: 53deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 53deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 72%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 75%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 75%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 75%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 75%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 75%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 75%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + } } diff --git a/dist/colors-purplestar.module.less b/dist/colors-purplestar.module.less index 3eeff15..dff1c94 100644 --- a/dist/colors-purplestar.module.less +++ b/dist/colors-purplestar.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-purplestar.module.min.css b/dist/colors-purplestar.module.min.css index 79ec03f..9ac8c7a 100644 --- a/dist/colors-purplestar.module.min.css +++ b/dist/colors-purplestar.module.min.css @@ -1 +1 @@ -:where(.bluelib){--bhsl-background-hue:262deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:13%;--bhsl-foreground-hue:262deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:78%;--bhsl-primary-hue:53deg;--bhsl-primary-saturation:100%;--bhsl-primary-lightness:100%;--bhsl-link-hue:53deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:72%;--bhsl-mark-foreground-hue:53deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:53deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:72%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)} \ No newline at end of file +@media screen{:where(.bluelib){--burl-background-full:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/.jpg);--burl-background-3840:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/3840.jpg);--burl-background-1920:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1920.jpg);--burl-background-1366:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1366.jpg);--burl-background-640:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/640.jpg);--burl-background-360:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/360.jpg);--bhsl-background-hue:262deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:13%;--bhsl-foreground-hue:262deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:78%;--bhsl-primary-hue:53deg;--bhsl-primary-saturation:100%;--bhsl-primary-lightness:100%;--bhsl-link-hue:53deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:72%;--bhsl-mark-foreground-hue:53deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:53deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:72%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}} \ No newline at end of file diff --git a/dist/colors-purplestar.root.css b/dist/colors-purplestar.root.css index b0e71d9..690f8f1 100644 --- a/dist/colors-purplestar.root.css +++ b/dist/colors-purplestar.root.css @@ -2,59 +2,67 @@ * Bluelib Purple Star Colors * by */ -:where(body) { - --bhsl-background-hue: 262deg; - --bhsl-background-saturation: 85%; - --bhsl-background-lightness: 13%; - --bhsl-foreground-hue: 262deg; - --bhsl-foreground-saturation: 100%; - --bhsl-foreground-lightness: 78%; - --bhsl-primary-hue: 53deg; - --bhsl-primary-saturation: 100%; - --bhsl-primary-lightness: 100%; - --bhsl-link-hue: 53deg; - --bhsl-link-saturation: 100%; - --bhsl-link-lightness: 72%; - --bhsl-mark-foreground-hue: 53deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 53deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 72%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 75%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 75%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 75%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 75%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 75%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 75%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); +@media screen { + :where(body) { + --burl-background-full: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/.jpg); + --burl-background-3840: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/3840.jpg); + --burl-background-1920: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1920.jpg); + --burl-background-1366: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1366.jpg); + --burl-background-640: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/640.jpg); + --burl-background-360: url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/360.jpg); + --bhsl-background-hue: 262deg; + --bhsl-background-saturation: 85%; + --bhsl-background-lightness: 13%; + --bhsl-foreground-hue: 262deg; + --bhsl-foreground-saturation: 100%; + --bhsl-foreground-lightness: 78%; + --bhsl-primary-hue: 53deg; + --bhsl-primary-saturation: 100%; + --bhsl-primary-lightness: 100%; + --bhsl-link-hue: 53deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 72%; + --bhsl-mark-foreground-hue: 53deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 53deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 72%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 75%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 75%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 75%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 75%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 75%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 75%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + } } diff --git a/dist/colors-purplestar.root.less b/dist/colors-purplestar.root.less index 339a064..7c0e4ea 100644 --- a/dist/colors-purplestar.root.less +++ b/dist/colors-purplestar.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-purplestar.root.min.css b/dist/colors-purplestar.root.min.css index d5ba9ac..8383fc1 100644 --- a/dist/colors-purplestar.root.min.css +++ b/dist/colors-purplestar.root.min.css @@ -1 +1 @@ -:where(body){--bhsl-background-hue:262deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:13%;--bhsl-foreground-hue:262deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:78%;--bhsl-primary-hue:53deg;--bhsl-primary-saturation:100%;--bhsl-primary-lightness:100%;--bhsl-link-hue:53deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:72%;--bhsl-mark-foreground-hue:53deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:53deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:72%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)} \ No newline at end of file +@media screen{:where(body){--burl-background-full:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/.jpg);--burl-background-3840:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/3840.jpg);--burl-background-1920:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1920.jpg);--burl-background-1366:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/1366.jpg);--burl-background-640:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/640.jpg);--burl-background-360:url(../images/kazuend-2KXEb_8G5vo-edited-unsplash/360.jpg);--bhsl-background-hue:262deg;--bhsl-background-saturation:85%;--bhsl-background-lightness:13%;--bhsl-foreground-hue:262deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:78%;--bhsl-primary-hue:53deg;--bhsl-primary-saturation:100%;--bhsl-primary-lightness:100%;--bhsl-link-hue:53deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:72%;--bhsl-mark-foreground-hue:53deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:53deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:72%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}} \ No newline at end of file diff --git a/dist/colors-royalblue.module.css b/dist/colors-royalblue.module.css index 4148bd2..0ff1c6b 100644 --- a/dist/colors-royalblue.module.css +++ b/dist/colors-royalblue.module.css @@ -2,59 +2,67 @@ * Bluelib Royal Blue Colors * by */ -:where(.bluelib) { - --bhsl-background-hue: 224deg; - --bhsl-background-saturation: 64%; - --bhsl-background-lightness: 14%; - --bhsl-foreground-hue: 212deg; - --bhsl-foreground-saturation: 100%; - --bhsl-foreground-lightness: 81%; - --bhsl-primary-hue: 0deg; - --bhsl-primary-saturation: 0%; - --bhsl-primary-lightness: 100%; - --bhsl-link-hue: 180deg; - --bhsl-link-saturation: 100%; - --bhsl-link-lightness: 40%; - --bhsl-mark-foreground-hue: 32deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 32deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 81%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 75%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 75%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 75%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 75%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 75%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 75%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); +@media screen { + :where(.bluelib) { + --burl-background-full: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/.jpg); + --burl-background-3840: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/3840.jpg); + --burl-background-1920: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1920.jpg); + --burl-background-1366: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1366.jpg); + --burl-background-640: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/640.jpg); + --burl-background-360: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/360.jpg); + --bhsl-background-hue: 224deg; + --bhsl-background-saturation: 64%; + --bhsl-background-lightness: 14%; + --bhsl-foreground-hue: 212deg; + --bhsl-foreground-saturation: 100%; + --bhsl-foreground-lightness: 81%; + --bhsl-primary-hue: 0deg; + --bhsl-primary-saturation: 0%; + --bhsl-primary-lightness: 100%; + --bhsl-link-hue: 180deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 40%; + --bhsl-mark-foreground-hue: 32deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 32deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 81%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 75%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 75%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 75%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 75%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 75%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 75%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + } } diff --git a/dist/colors-royalblue.module.less b/dist/colors-royalblue.module.less index 2ffd485..5cadaa6 100644 --- a/dist/colors-royalblue.module.less +++ b/dist/colors-royalblue.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-royalblue.module.min.css b/dist/colors-royalblue.module.min.css index 938f52e..0392165 100644 --- a/dist/colors-royalblue.module.min.css +++ b/dist/colors-royalblue.module.min.css @@ -1 +1 @@ -:where(.bluelib){--bhsl-background-hue:224deg;--bhsl-background-saturation:64%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:212deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:81%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:0%;--bhsl-primary-lightness:100%;--bhsl-link-hue:180deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:40%;--bhsl-mark-foreground-hue:32deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:32deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)} \ No newline at end of file +@media screen{:where(.bluelib){--burl-background-full:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/.jpg);--burl-background-3840:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/3840.jpg);--burl-background-1920:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1920.jpg);--burl-background-1366:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1366.jpg);--burl-background-640:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/640.jpg);--burl-background-360:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/360.jpg);--bhsl-background-hue:224deg;--bhsl-background-saturation:64%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:212deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:81%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:0%;--bhsl-primary-lightness:100%;--bhsl-link-hue:180deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:40%;--bhsl-mark-foreground-hue:32deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:32deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}} \ No newline at end of file diff --git a/dist/colors-royalblue.root.css b/dist/colors-royalblue.root.css index c2ba184..a7cd7bf 100644 --- a/dist/colors-royalblue.root.css +++ b/dist/colors-royalblue.root.css @@ -2,59 +2,67 @@ * Bluelib Royal Blue Colors * by */ -:where(body) { - --bhsl-background-hue: 224deg; - --bhsl-background-saturation: 64%; - --bhsl-background-lightness: 14%; - --bhsl-foreground-hue: 212deg; - --bhsl-foreground-saturation: 100%; - --bhsl-foreground-lightness: 81%; - --bhsl-primary-hue: 0deg; - --bhsl-primary-saturation: 0%; - --bhsl-primary-lightness: 100%; - --bhsl-link-hue: 180deg; - --bhsl-link-saturation: 100%; - --bhsl-link-lightness: 40%; - --bhsl-mark-foreground-hue: 32deg; - --bhsl-mark-foreground-saturation: 64%; - --bhsl-mark-foreground-lightness: 14%; - --bhsl-mark-background-hue: 32deg; - --bhsl-mark-background-saturation: 100%; - --bhsl-mark-background-lightness: 81%; - --bhsl-todo-foreground-hue: 43deg; - --bhsl-todo-foreground-saturation: 100%; - --bhsl-todo-foreground-lightness: 65%; - --bhsl-todo-background-hue: 204deg; - --bhsl-todo-background-saturation: 11%; - --bhsl-todo-background-lightness: 18%; - --bhsl-sample-input-hue: 0deg; - --bhsl-sample-input-saturation: 100%; - --bhsl-sample-input-lightness: 0%; - --bhsl-sample-output-hue: 0deg; - --bhsl-sample-output-saturation: 100%; - --bhsl-sample-output-lightness: 100%; - --bhsl-red-hue: 0deg; - --bhsl-red-saturation: 100%; - --bhsl-red-lightness: 75%; - --bhsl-yellow-hue: 60deg; - --bhsl-yellow-saturation: 100%; - --bhsl-yellow-lightness: 75%; - --bhsl-green-hue: 120deg; - --bhsl-green-saturation: 100%; - --bhsl-green-lightness: 75%; - --bhsl-cyan-hue: 180deg; - --bhsl-cyan-saturation: 100%; - --bhsl-cyan-lightness: 75%; - --bhsl-blue-hue: 240deg; - --bhsl-blue-saturation: 100%; - --bhsl-blue-lightness: 75%; - --bhsl-magenta-hue: 300deg; - --bhsl-magenta-saturation: 100%; - --bhsl-magenta-lightness: 75%; - --bhsl-inserted-hue: var(--bhsl-green-hue); - --bhsl-inserted-saturation: var(--bhsl-green-saturation); - --bhsl-inserted-lightness: var(--bhsl-green-lightness); - --bhsl-deleted-hue: var(--bhsl-red-hue); - --bhsl-deleted-saturation: var(--bhsl-red-saturation); - --bhsl-deleted-lightness: var(--bhsl-red-lightness); +@media screen { + :where(body) { + --burl-background-full: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/.jpg); + --burl-background-3840: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/3840.jpg); + --burl-background-1920: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1920.jpg); + --burl-background-1366: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1366.jpg); + --burl-background-640: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/640.jpg); + --burl-background-360: url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/360.jpg); + --bhsl-background-hue: 224deg; + --bhsl-background-saturation: 64%; + --bhsl-background-lightness: 14%; + --bhsl-foreground-hue: 212deg; + --bhsl-foreground-saturation: 100%; + --bhsl-foreground-lightness: 81%; + --bhsl-primary-hue: 0deg; + --bhsl-primary-saturation: 0%; + --bhsl-primary-lightness: 100%; + --bhsl-link-hue: 180deg; + --bhsl-link-saturation: 100%; + --bhsl-link-lightness: 40%; + --bhsl-mark-foreground-hue: 32deg; + --bhsl-mark-foreground-saturation: 64%; + --bhsl-mark-foreground-lightness: 14%; + --bhsl-mark-background-hue: 32deg; + --bhsl-mark-background-saturation: 100%; + --bhsl-mark-background-lightness: 81%; + --bhsl-todo-foreground-hue: 43deg; + --bhsl-todo-foreground-saturation: 100%; + --bhsl-todo-foreground-lightness: 65%; + --bhsl-todo-background-hue: 204deg; + --bhsl-todo-background-saturation: 11%; + --bhsl-todo-background-lightness: 18%; + --bhsl-sample-input-hue: 0deg; + --bhsl-sample-input-saturation: 100%; + --bhsl-sample-input-lightness: 0%; + --bhsl-sample-output-hue: 0deg; + --bhsl-sample-output-saturation: 100%; + --bhsl-sample-output-lightness: 100%; + --bhsl-red-hue: 0deg; + --bhsl-red-saturation: 100%; + --bhsl-red-lightness: 75%; + --bhsl-yellow-hue: 60deg; + --bhsl-yellow-saturation: 100%; + --bhsl-yellow-lightness: 75%; + --bhsl-green-hue: 120deg; + --bhsl-green-saturation: 100%; + --bhsl-green-lightness: 75%; + --bhsl-cyan-hue: 180deg; + --bhsl-cyan-saturation: 100%; + --bhsl-cyan-lightness: 75%; + --bhsl-blue-hue: 240deg; + --bhsl-blue-saturation: 100%; + --bhsl-blue-lightness: 75%; + --bhsl-magenta-hue: 300deg; + --bhsl-magenta-saturation: 100%; + --bhsl-magenta-lightness: 75%; + --bhsl-inserted-hue: var(--bhsl-green-hue); + --bhsl-inserted-saturation: var(--bhsl-green-saturation); + --bhsl-inserted-lightness: var(--bhsl-green-lightness); + --bhsl-deleted-hue: var(--bhsl-red-hue); + --bhsl-deleted-saturation: var(--bhsl-red-saturation); + --bhsl-deleted-lightness: var(--bhsl-red-lightness); + } } diff --git a/dist/colors-royalblue.root.less b/dist/colors-royalblue.root.less index f0cba50..49163aa 100644 --- a/dist/colors-royalblue.root.less +++ b/dist/colors-royalblue.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/colors-royalblue.root.min.css b/dist/colors-royalblue.root.min.css index 3da4d71..b699770 100644 --- a/dist/colors-royalblue.root.min.css +++ b/dist/colors-royalblue.root.min.css @@ -1 +1 @@ -:where(body){--bhsl-background-hue:224deg;--bhsl-background-saturation:64%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:212deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:81%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:0%;--bhsl-primary-lightness:100%;--bhsl-link-hue:180deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:40%;--bhsl-mark-foreground-hue:32deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:32deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)} \ No newline at end of file +@media screen{:where(body){--burl-background-full:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/.jpg);--burl-background-3840:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/3840.jpg);--burl-background-1920:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1920.jpg);--burl-background-1366:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/1366.jpg);--burl-background-640:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/640.jpg);--burl-background-360:url(../images/fabrice-nerfin-puHQJZd3MDg-unsplash/360.jpg);--bhsl-background-hue:224deg;--bhsl-background-saturation:64%;--bhsl-background-lightness:14%;--bhsl-foreground-hue:212deg;--bhsl-foreground-saturation:100%;--bhsl-foreground-lightness:81%;--bhsl-primary-hue:0deg;--bhsl-primary-saturation:0%;--bhsl-primary-lightness:100%;--bhsl-link-hue:180deg;--bhsl-link-saturation:100%;--bhsl-link-lightness:40%;--bhsl-mark-foreground-hue:32deg;--bhsl-mark-foreground-saturation:64%;--bhsl-mark-foreground-lightness:14%;--bhsl-mark-background-hue:32deg;--bhsl-mark-background-saturation:100%;--bhsl-mark-background-lightness:81%;--bhsl-todo-foreground-hue:43deg;--bhsl-todo-foreground-saturation:100%;--bhsl-todo-foreground-lightness:65%;--bhsl-todo-background-hue:204deg;--bhsl-todo-background-saturation:11%;--bhsl-todo-background-lightness:18%;--bhsl-sample-input-hue:0deg;--bhsl-sample-input-saturation:100%;--bhsl-sample-input-lightness:0%;--bhsl-sample-output-hue:0deg;--bhsl-sample-output-saturation:100%;--bhsl-sample-output-lightness:100%;--bhsl-red-hue:0deg;--bhsl-red-saturation:100%;--bhsl-red-lightness:75%;--bhsl-yellow-hue:60deg;--bhsl-yellow-saturation:100%;--bhsl-yellow-lightness:75%;--bhsl-green-hue:120deg;--bhsl-green-saturation:100%;--bhsl-green-lightness:75%;--bhsl-cyan-hue:180deg;--bhsl-cyan-saturation:100%;--bhsl-cyan-lightness:75%;--bhsl-blue-hue:240deg;--bhsl-blue-saturation:100%;--bhsl-blue-lightness:75%;--bhsl-magenta-hue:300deg;--bhsl-magenta-saturation:100%;--bhsl-magenta-lightness:75%;--bhsl-inserted-hue:var(--bhsl-green-hue);--bhsl-inserted-saturation:var(--bhsl-green-saturation);--bhsl-inserted-lightness:var(--bhsl-green-lightness);--bhsl-deleted-hue:var(--bhsl-red-hue);--bhsl-deleted-saturation:var(--bhsl-red-saturation);--bhsl-deleted-lightness:var(--bhsl-red-lightness)}} \ No newline at end of file diff --git a/dist/fonts-fira-ghpages.module.less b/dist/fonts-fira-ghpages.module.less index 441c689..409657f 100644 --- a/dist/fonts-fira-ghpages.module.less +++ b/dist/fonts-fira-ghpages.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/fonts-fira-ghpages.root.less b/dist/fonts-fira-ghpages.root.less index ec6b679..d8e8e5f 100644 --- a/dist/fonts-fira-ghpages.root.less +++ b/dist/fonts-fira-ghpages.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/fun.module.less b/dist/fun.module.less index 07579a7..55d9558 100644 --- a/dist/fun.module.less +++ b/dist/fun.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/fun.root.less b/dist/fun.root.less index 01bb3d6..cde1802 100644 --- a/dist/fun.root.less +++ b/dist/fun.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/glass.module.css b/dist/glass.module.css index 1844ff8..c9a0608 100644 --- a/dist/glass.module.css +++ b/dist/glass.module.css @@ -48,11 +48,4 @@ background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); backdrop-filter: none; } - :where(.bluelib) :where(.panel):where(.modifier-todo) { - background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness) / 0.3); - backdrop-filter: blur(var(--b-panel-blur)) grayscale(100%); - } - :where(.bluelib) :where(.panel) :where(.panel):where(.modifier-todo) { - background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); - } } diff --git a/dist/glass.module.less b/dist/glass.module.less index 48d01b7..aeb184e 100644 --- a/dist/glass.module.less +++ b/dist/glass.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/glass.module.min.css b/dist/glass.module.min.css index 1fff7d8..dd7228a 100644 --- a/dist/glass.module.min.css +++ b/dist/glass.module.min.css @@ -1 +1 @@ -:where(.bluelib){--b-panel-blur:16px;--b-panel-initial-opacity:0.3;--b-panel-nested-opacity:0.075}@supports (backdrop-filter:blur(var(--b-panel-blur))){:where(.bluelib) :where(.panel),:where(.bluelib) :where(.table):where(.panel)>:where(.table-caption){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness) / var(--b-panel-initial-opacity));backdrop-filter:blur(var(--b-panel-blur)) hue-rotate(calc(var(--bhsl-current-hue) - var(--bhsl-foreground-hue)))}:where(.bluelib) :where(.panel) :where(.panel),:where(.bluelib) :where(.table):where(.panel)>:where(.table-caption) :where(.panel){background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / var(--b-panel-nested-opacity));backdrop-filter:none}:where(.bluelib) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));backdrop-filter:none}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness))}:where(.bluelib) :where(.modifier-todo),:where(.bluelib) :where(.panel):where(.modifier-todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(.bluelib) :where(.modifier-todo) :where(.panel),:where(.bluelib) :where(.panel):where(.modifier-todo) :where(.panel){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness));backdrop-filter:none}:where(.bluelib) :where(.panel):where(.modifier-todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness) / .3);backdrop-filter:blur(var(--b-panel-blur)) grayscale(100%)}:where(.bluelib) :where(.panel) :where(.panel):where(.modifier-todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}} \ No newline at end of file +:where(.bluelib){--b-panel-blur:16px;--b-panel-initial-opacity:0.3;--b-panel-nested-opacity:0.075}@supports (backdrop-filter:blur(var(--b-panel-blur))){:where(.bluelib) :where(.panel),:where(.bluelib) :where(.table):where(.panel)>:where(.table-caption){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness) / var(--b-panel-initial-opacity));backdrop-filter:blur(var(--b-panel-blur)) hue-rotate(calc(var(--bhsl-current-hue) - var(--bhsl-foreground-hue)))}:where(.bluelib) :where(.panel) :where(.panel),:where(.bluelib) :where(.table):where(.panel)>:where(.table-caption) :where(.panel){background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / var(--b-panel-nested-opacity));backdrop-filter:none}:where(.bluelib) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));backdrop-filter:none}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark),:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness))}:where(.bluelib) :where(.modifier-todo),:where(.bluelib) :where(.panel):where(.modifier-todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(.bluelib) :where(.modifier-todo) :where(.panel),:where(.bluelib) :where(.panel):where(.modifier-todo) :where(.panel){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness));backdrop-filter:none}} \ No newline at end of file diff --git a/dist/glass.root.css b/dist/glass.root.css index 7e6e920..e4281cd 100644 --- a/dist/glass.root.css +++ b/dist/glass.root.css @@ -48,11 +48,4 @@ background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); backdrop-filter: none; } - :where(body) :where(.panel):where(.todo) { - background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness) / 0.3); - backdrop-filter: blur(var(--b-panel-blur)) grayscale(100%); - } - :where(body) :where(.panel) :where(.panel):where(.todo) { - background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); - } } diff --git a/dist/glass.root.less b/dist/glass.root.less index 984fdd2..6bdd25f 100644 --- a/dist/glass.root.less +++ b/dist/glass.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/glass.root.min.css b/dist/glass.root.min.css index 6c6f304..3b422c0 100644 --- a/dist/glass.root.min.css +++ b/dist/glass.root.min.css @@ -1 +1 @@ -:where(body){--b-panel-blur:16px;--b-panel-initial-opacity:0.3;--b-panel-nested-opacity:0.075}@supports (backdrop-filter:blur(var(--b-panel-blur))){:where(body) :where(.panel),:where(body) :where(table):where(.panel)>:where(caption){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness) / var(--b-panel-initial-opacity));backdrop-filter:blur(var(--b-panel-blur)) hue-rotate(calc(var(--bhsl-current-hue) - var(--bhsl-foreground-hue)))}:where(body) :where(.panel) :where(.panel),:where(body) :where(table):where(.panel)>:where(caption) :where(.panel){background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / var(--b-panel-nested-opacity));backdrop-filter:none}:where(body) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));backdrop-filter:none}:where(body) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(mark,.mark),:where(body) :where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark) :where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(mark,.mark) :where(mark,.mark),:where(body) :where(mark,.mark) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark) :where(.panel):where(mark,.mark) :where(mark,.mark),:where(body) :where(mark,.mark) :where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness))}:where(body) :where(.panel):where(.todo),:where(body) :where(.todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(body) :where(.panel):where(.todo) :where(.panel),:where(body) :where(.todo) :where(.panel){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness));backdrop-filter:none}:where(body) :where(.panel):where(.todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness) / .3);backdrop-filter:blur(var(--b-panel-blur)) grayscale(100%)}:where(body) :where(.panel) :where(.panel):where(.todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}} \ No newline at end of file +:where(body){--b-panel-blur:16px;--b-panel-initial-opacity:0.3;--b-panel-nested-opacity:0.075}@supports (backdrop-filter:blur(var(--b-panel-blur))){:where(body) :where(.panel),:where(body) :where(table):where(.panel)>:where(caption){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness) / var(--b-panel-initial-opacity));backdrop-filter:blur(var(--b-panel-blur)) hue-rotate(calc(var(--bhsl-current-hue) - var(--bhsl-foreground-hue)))}:where(body) :where(.panel) :where(.panel),:where(body) :where(table):where(.panel)>:where(caption) :where(.panel){background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / var(--b-panel-nested-opacity));backdrop-filter:none}:where(body) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness));backdrop-filter:none}:where(body) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(mark,.mark),:where(body) :where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark) :where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(.panel):where(mark,.mark) :where(mark,.mark) :where(mark,.mark),:where(body) :where(mark,.mark) :where(.panel):where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark) :where(.panel):where(mark,.mark) :where(mark,.mark),:where(body) :where(mark,.mark) :where(mark,.mark) :where(.panel):where(mark,.mark),:where(body) :where(mark,.mark) :where(mark,.mark) :where(mark,.mark){background-color:hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness))}:where(body) :where(.panel):where(.todo),:where(body) :where(.todo){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness))}:where(body) :where(.panel):where(.todo) :where(.panel),:where(body) :where(.todo) :where(.panel){background-color:hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness));backdrop-filter:none}} \ No newline at end of file diff --git a/dist/layouts-center.module.less b/dist/layouts-center.module.less index 9c576de..cdcfd9f 100644 --- a/dist/layouts-center.module.less +++ b/dist/layouts-center.module.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/layouts-center.root.less b/dist/layouts-center.root.less index 3abc5b2..66694fc 100644 --- a/dist/layouts-center.root.less +++ b/dist/layouts-center.root.less @@ -1,4 +1,5 @@ // Mixins +@import (less) "../src/mixins/bg.less"; @import (less) "../src/mixins/fonts.less"; @import (less) "../src/mixins/hsl.less"; diff --git a/dist/layouts-flex.module.css b/dist/layouts-flex.module.css new file mode 100644 index 0000000..8659055 --- /dev/null +++ b/dist/layouts-flex.module.css @@ -0,0 +1,23 @@ +/** + * Bluelib Layouts Flex + * by + */ +:where(.bluelib) :where(.layout-flex-row), +:where(.bluelib) :where(.layout-flex-rrow), +:where(.bluelib) :where(.layout-flex-column), +:where(.bluelib) :where(.layout-flex-rcolumn) { + display: flex; + gap: 8px; +} +:where(.bluelib) :where(.layout-flex-row) { + flex-direction: row; +} +:where(.bluelib) :where(.layout-flex-rrow) { + flex-direction: row-reverse; +} +:where(.bluelib) :where(.layout-flex-column) { + flex-direction: column; +} +:where(.bluelib) :where(.layout-flex-rcolumn) { + flex-direction: column-reverse; +} diff --git a/dist/layouts-flex.module.less b/dist/layouts-flex.module.less new file mode 100644 index 0000000..5c6f9c6 --- /dev/null +++ b/dist/layouts-flex.module.less @@ -0,0 +1,11 @@ +// Mixins +@import (less) "../src/mixins/bg.less"; +@import (less) "../src/mixins/fonts.less"; +@import (less) "../src/mixins/hsl.less"; + +// Selector +@import (less) "../src/selectorsets/module.less"; + +// Rule +@import (less) "../src/rulesets/layouts/layouts-flex.less"; + diff --git a/dist/layouts-flex.module.min.css b/dist/layouts-flex.module.min.css new file mode 100644 index 0000000..aa17e48 --- /dev/null +++ b/dist/layouts-flex.module.min.css @@ -0,0 +1 @@ +:where(.bluelib) :where(.layout-flex-column),:where(.bluelib) :where(.layout-flex-rcolumn),:where(.bluelib) :where(.layout-flex-row),:where(.bluelib) :where(.layout-flex-rrow){display:flex;gap:8px}:where(.bluelib) :where(.layout-flex-row){flex-direction:row}:where(.bluelib) :where(.layout-flex-rrow){flex-direction:row-reverse}:where(.bluelib) :where(.layout-flex-column){flex-direction:column}:where(.bluelib) :where(.layout-flex-rcolumn){flex-direction:column-reverse} \ No newline at end of file diff --git a/dist/layouts-flex.root.css b/dist/layouts-flex.root.css new file mode 100644 index 0000000..abfc200 --- /dev/null +++ b/dist/layouts-flex.root.css @@ -0,0 +1,23 @@ +/** + * Bluelib Layouts Flex + * by + */ +:where(body) :where(.layout-flex-row), +:where(body) :where(.layout-flex-rrow), +:where(body) :where(.layout-flex-column), +:where(body) :where(.layout-flex-rcolumn) { + display: flex; + gap: 8px; +} +:where(body) :where(.layout-flex-row) { + flex-direction: row; +} +:where(body) :where(.layout-flex-rrow) { + flex-direction: row-reverse; +} +:where(body) :where(.layout-flex-column) { + flex-direction: column; +} +:where(body) :where(.layout-flex-rcolumn) { + flex-direction: column-reverse; +} diff --git a/dist/layouts-flex.root.less b/dist/layouts-flex.root.less new file mode 100644 index 0000000..8a40c09 --- /dev/null +++ b/dist/layouts-flex.root.less @@ -0,0 +1,11 @@ +// Mixins +@import (less) "../src/mixins/bg.less"; +@import (less) "../src/mixins/fonts.less"; +@import (less) "../src/mixins/hsl.less"; + +// Selector +@import (less) "../src/selectorsets/root.less"; + +// Rule +@import (less) "../src/rulesets/layouts/layouts-flex.less"; + diff --git a/dist/layouts-flex.root.min.css b/dist/layouts-flex.root.min.css new file mode 100644 index 0000000..ed102d7 --- /dev/null +++ b/dist/layouts-flex.root.min.css @@ -0,0 +1 @@ +:where(body) :where(.layout-flex-column),:where(body) :where(.layout-flex-rcolumn),:where(body) :where(.layout-flex-row),:where(body) :where(.layout-flex-rrow){display:flex;gap:8px}:where(body) :where(.layout-flex-row){flex-direction:row}:where(body) :where(.layout-flex-rrow){flex-direction:row-reverse}:where(body) :where(.layout-flex-column){flex-direction:column}:where(body) :where(.layout-flex-rcolumn){flex-direction:column-reverse} \ No newline at end of file diff --git a/examples/index.css b/examples/index.css deleted file mode 100644 index db97f11..0000000 --- a/examples/index.css +++ /dev/null @@ -1,7 +0,0 @@ -#body :is(.chapter-1, .chapter-2, .chapter-3, .chapter-4, .chapter-5, .chapter-6, .chapter-7, .chapter-8, .chapter-9) > .panel { - min-width: 360px; -} - -#body .panel :is(.chapter-1, .chapter-2, .chapter-3, .chapter-4, .chapter-5, .chapter-6, .chapter-7, .chapter-8, .chapter-9) > .panel { - min-width: unset; -} diff --git a/examples/index.html b/examples/index.html index 44b3280..2c15400 100644 --- a/examples/index.html +++ b/examples/index.html @@ -13,6 +13,7 @@ + @@ -21,7 +22,6 @@ -