diff --git a/dist/_build.sh b/dist/_build.sh index b69aa29..1058855 100755 --- a/dist/_build.sh +++ b/dist/_build.sh @@ -48,6 +48,8 @@ echo >> "$base.less" echo "Compiling $base.css..." lessc "$base.less" "$base.css" +echo "Compiling $base.min.css..." +lessc "$base.less" --clean-css "$base.min.css" done done diff --git a/dist/base.module.css b/dist/base.module.css index e175094..9516a89 100644 --- a/dist/base.module.css +++ b/dist/base.module.css @@ -17,7 +17,7 @@ font-family: var(--bfont-text-family); } :where(.bluelib), -:where(.bluelib) * { +:where(.bluelib) :where(*) { margin: 0; padding: 0; color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); @@ -27,56 +27,51 @@ 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(.bluelib) :where(*), :where(.bluelib)::before, -:where(.bluelib) *::before, +:where(.bluelib) :where(*)::before, :where(.bluelib)::after, -:where(.bluelib) *::after { +:where(.bluelib) :where(*)::after { box-sizing: border-box; } :where(.bluelib):focus-visible, -:where(.bluelib) *:focus-visible { +:where(.bluelib) :where(*):focus-visible { outline-width: 4px; outline-style: solid; outline-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.3); } -:where(.bluelib) .page-footer { +:where(.bluelib) :where(.page-footer) { margin: 1rem 0; text-align: center; font-size: x-small; } -:where(.bluelib) .float-top { +:where(.bluelib) :where(.float-top) { margin-bottom: auto; } -:where(.bluelib) .float-right { +:where(.bluelib) :where(.float-right) { margin-left: auto; } -:where(.bluelib) .float-bottom { +:where(.bluelib) :where(.float-bottom) { margin-top: auto; } -:where(.bluelib) .float-left { +:where(.bluelib) :where(.float-left) { margin-right: auto; } -:where(.bluelib) .float-hcenter { +:where(.bluelib) :where(.float-hcenter) { margin-left: auto; margin-right: auto; } -:where(.bluelib) .float-vcenter { +:where(.bluelib) :where(.float-vcenter) { margin-top: auto; margin-bottom: auto; } -:where(.bluelib) .header-1 { +:where(.bluelib) :where(.header-1) { font-size: 2.5em; } -:where(.bluelib) .header-2 { +:where(.bluelib) :where(.header-2) { font-size: 1.75em; } -:where(.bluelib) .header-1, -:where(.bluelib) .header-2, -:where(.bluelib) .header-3, -:where(.bluelib) .header-4, -:where(.bluelib) .header-5, -:where(.bluelib) .header-6 { +: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); @@ -88,7 +83,7 @@ line-height: var(--bfont-header-height); font-family: var(--bfont-header-family); } -:where(.bluelib) .panel { +:where(.bluelib) :where(.panel) { padding-top: 8px; padding-right: 8px; padding-left: 8px; @@ -101,187 +96,110 @@ gap: 8px; background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } -:where(.bluelib) .panel.border-top, -:where(.bluelib) .panel.panel-box { +:where(.bluelib) :where(.panel):where(.border-top), +:where(.bluelib) :where(.panel):where(.panel-box) { border-top-width: 2px; padding-top: 6px; } -:where(.bluelib) .panel.border-right, -:where(.bluelib) .panel.panel-box { +:where(.bluelib) :where(.panel):where(.border-right), +:where(.bluelib) :where(.panel):where(.panel-box) { border-right-width: 2px; padding-right: 6px; } -:where(.bluelib) .panel.border-left, -:where(.bluelib) .panel.panel-box, -:where(.bluelib) .panel.panel-dialog { +: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) .panel.border-bottom, -:where(.bluelib) .panel.panel-box { +:where(.bluelib) :where(.panel):where(.border-bottom), +:where(.bluelib) :where(.panel):where(.panel-box) { border-bottom-width: 2px; padding-bottom: 6px; } -:where(.bluelib) .panel.panel-parenthesis { +:where(.bluelib) :where(.panel):where(.panel-parenthesis) { font-size: smaller; } -:where(.bluelib) .chapter-0, -:where(.bluelib) .chapter-1, -:where(.bluelib) .chapter-2, -:where(.bluelib) .chapter-3, -:where(.bluelib) .chapter-4, -:where(.bluelib) .chapter-5, -:where(.bluelib) .chapter-6, -:where(.bluelib) .chapter-7, -:where(.bluelib) .chapter-8, -:where(.bluelib) .chapter-9 { - display: flex; - flex-wrap: wrap; - flex-direction: row; - gap: 8px; - justify-content: center; - align-items: stretch; - margin: 8px 0; -} -:where(.bluelib) .chapter-0 > *, -:where(.bluelib) .chapter-1 > *, -:where(.bluelib) .chapter-2 > *, -:where(.bluelib) .chapter-3 > *, -:where(.bluelib) .chapter-4 > *, -:where(.bluelib) .chapter-5 > *, -:where(.bluelib) .chapter-6 > *, -:where(.bluelib) .chapter-7 > *, -:where(.bluelib) .chapter-8 > *, -:where(.bluelib) .chapter-9 > * { - flex-grow: 1; - flex-shrink: 0; -} -:where(.bluelib) .chapter-0 > .header-1, -:where(.bluelib) .chapter-1 > .header-1, -:where(.bluelib) .chapter-2 > .header-1, -:where(.bluelib) .chapter-3 > .header-1, -:where(.bluelib) .chapter-4 > .header-1, -:where(.bluelib) .chapter-5 > .header-1, -:where(.bluelib) .chapter-6 > .header-1, -:where(.bluelib) .chapter-7 > .header-1, -:where(.bluelib) .chapter-8 > .header-1, -:where(.bluelib) .chapter-9 > .header-1, -:where(.bluelib) .chapter-0 > .header-2, -:where(.bluelib) .chapter-1 > .header-2, -:where(.bluelib) .chapter-2 > .header-2, -:where(.bluelib) .chapter-3 > .header-2, -:where(.bluelib) .chapter-4 > .header-2, -:where(.bluelib) .chapter-5 > .header-2, -:where(.bluelib) .chapter-6 > .header-2, -:where(.bluelib) .chapter-7 > .header-2, -:where(.bluelib) .chapter-8 > .header-2, -:where(.bluelib) .chapter-9 > .header-2, -:where(.bluelib) .chapter-0 > .header-3, -:where(.bluelib) .chapter-1 > .header-3, -:where(.bluelib) .chapter-2 > .header-3, -:where(.bluelib) .chapter-3 > .header-3, -:where(.bluelib) .chapter-4 > .header-3, -:where(.bluelib) .chapter-5 > .header-3, -:where(.bluelib) .chapter-6 > .header-3, -:where(.bluelib) .chapter-7 > .header-3, -:where(.bluelib) .chapter-8 > .header-3, -:where(.bluelib) .chapter-9 > .header-3, -:where(.bluelib) .chapter-0 > .header-4, -:where(.bluelib) .chapter-1 > .header-4, -:where(.bluelib) .chapter-2 > .header-4, -:where(.bluelib) .chapter-3 > .header-4, -:where(.bluelib) .chapter-4 > .header-4, -:where(.bluelib) .chapter-5 > .header-4, -:where(.bluelib) .chapter-6 > .header-4, -:where(.bluelib) .chapter-7 > .header-4, -:where(.bluelib) .chapter-8 > .header-4, -:where(.bluelib) .chapter-9 > .header-4, -:where(.bluelib) .chapter-0 > .header-5, -:where(.bluelib) .chapter-1 > .header-5, -:where(.bluelib) .chapter-2 > .header-5, -:where(.bluelib) .chapter-3 > .header-5, -:where(.bluelib) .chapter-4 > .header-5, -:where(.bluelib) .chapter-5 > .header-5, -:where(.bluelib) .chapter-6 > .header-5, -:where(.bluelib) .chapter-7 > .header-5, -:where(.bluelib) .chapter-8 > .header-5, -:where(.bluelib) .chapter-9 > .header-5, -:where(.bluelib) .chapter-0 > .header-6, -:where(.bluelib) .chapter-1 > .header-6, -:where(.bluelib) .chapter-2 > .header-6, -:where(.bluelib) .chapter-3 > .header-6, -:where(.bluelib) .chapter-4 > .header-6, -:where(.bluelib) .chapter-5 > .header-6, -:where(.bluelib) .chapter-6 > .header-6, -:where(.bluelib) .chapter-7 > .header-6, -:where(.bluelib) .chapter-8 > .header-6, -:where(.bluelib) .chapter-9 > .header-6 { - flex-basis: 100%; - margin-top: 1.2em; -} -:where(.bluelib) .chapter-0 { +:where(.bluelib) :where(.chapter-0) { flex-wrap: nowrap; } -:where(.bluelib) .chapter-0 > * { +:where(.bluelib) :where(.chapter-0) > :where(*) { flex-shrink: 1; } -:where(.bluelib) .chapter-1 > * { +:where(.bluelib) :where(.chapter-1) > :where(*) { flex-basis: calc(100% / 2); } -:where(.bluelib) .chapter-2 > * { +:where(.bluelib) :where(.chapter-2) > :where(*) { flex-basis: calc(100% / 3); } -:where(.bluelib) .chapter-3 > * { +:where(.bluelib) :where(.chapter-3) > :where(*) { flex-basis: calc(100% / 4); } -:where(.bluelib) .chapter-4 > * { +:where(.bluelib) :where(.chapter-4) > :where(*) { flex-basis: calc(100% / 5); } -:where(.bluelib) .chapter-5 > * { +:where(.bluelib) :where(.chapter-5) > :where(*) { flex-basis: calc(100% / 6); } -:where(.bluelib) .chapter-6 > * { +:where(.bluelib) :where(.chapter-6) > :where(*) { flex-basis: calc(100% / 7); } -:where(.bluelib) .chapter-7 > * { +:where(.bluelib) :where(.chapter-7) > :where(*) { flex-basis: calc(100% / 8); } -:where(.bluelib) .chapter-8 > * { +:where(.bluelib) :where(.chapter-8) > :where(*) { flex-basis: calc(100% / 9); } -:where(.bluelib) .chapter-9 > * { +:where(.bluelib) :where(.chapter-9) > :where(*) { flex-basis: calc(100% / 10); } -:where(.bluelib) .separator { +: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) .separator-light { +:where(.bluelib) :where(.separator-light) { border-style: dotted; } -:where(.bluelib) .separator-heavy { +:where(.bluelib) :where(.separator-heavy) { border-style: solid; } -:where(.bluelib) .image { +:where(.bluelib) :where(.image) { display: block; max-width: 100%; object-fit: contain; } -:where(.bluelib) .image-limit-half { +:where(.bluelib) :where(.image-limit-half) { max-height: max(28.2vw, 50vh); } -:where(.bluelib) .image-limit-quarter { +:where(.bluelib) :where(.image-limit-quarter) { max-height: max(14.1vw, 25vh); } -:where(.bluelib) .table { +:where(.bluelib) :where(.table) { border-collapse: collapse; } -:where(.bluelib) .table .table-head, -:where(.bluelib) .table .table-data { +:where(.bluelib) :where(.table) :where(.table-head), +:where(.bluelib) :where(.table) :where(.table-data) { padding: 3px 7px; border-width: 1px; } -:where(.bluelib) .table .table-caption { +:where(.bluelib) :where(.table) :where(.table-caption) { border-width: 1px; font-style: var(--bfont-caption-style); font-variant: var(--bfont-caption-variant); @@ -290,77 +208,77 @@ line-height: var(--bfont-caption-height); font-family: var(--bfont-caption-family); } -:where(.bluelib) .table .table-caption.table-caption-top { +:where(.bluelib) :where(.table) :where(.table-caption):where(.table-caption-top) { caption-side: top; border-bottom-width: 0; } -:where(.bluelib) .table .table-caption.table-caption-bottom { +:where(.bluelib) :where(.table) :where(.table-caption):where(.table-caption-bottom) { caption-side: bottom; border-top-width: 0; } -:where(.bluelib) .table.panel { +:where(.bluelib) :where(.table):where(.panel) { display: table; } -:where(.bluelib) .table.panel .table-head, -:where(.bluelib) .table.panel .table-data { +:where(.bluelib) :where(.table):where(.panel) :where(.table-head), +:where(.bluelib) :where(.table):where(.panel) :where(.table-data) { padding: 8px; } -:where(.bluelib) .table.panel .table-caption { +: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) .table.panel .table-caption * { +:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*) { margin-top: 8px; margin-bottom: 8px; } -:where(.bluelib) .table.panel .table-caption *:first-child { +:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*):first-child { margin-top: 0; } -:where(.bluelib) .table.panel .table-caption *:last-child { +:where(.bluelib) :where(.table):where(.panel) :where(.table-caption) :where(*):last-child { margin-bottom: 0; } -:where(.bluelib) .table.panel-box .table-row { +:where(.bluelib) :where(.table):where(.panel-box) :where(.table-row) { border-width: 1px; } -:where(.bluelib) .table.panel-box .table-head, -:where(.bluelib) .table.panel-box .table-data { +:where(.bluelib) :where(.table):where(.panel-box) :where(.table-head), +:where(.bluelib) :where(.table):where(.panel-box) :where(.table-data) { border-width: 1px; padding: 7px; } -:where(.bluelib) .table.panel-box .table-caption { +:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption) { border-width: 2px; padding: 6px; } -:where(.bluelib) .table.panel-box .table-caption.table-caption-top { +:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption):where(.table-caption-top) { border-bottom-width: 0; } -:where(.bluelib) .table.panel-box .table-caption.table-caption-bottom { +:where(.bluelib) :where(.table):where(.panel-box) :where(.table-caption):where(.table-caption-bottom) { border-top-width: 0; } -:where(.bluelib) .table.panel-dialog .table-header > .table-row { +:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-header) > :where(.table-row) { border-bottom-width: 1px; } -:where(.bluelib) .table.panel-dialog .table-body > .table-row { +:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-body) > :where(.table-row) { border-width: 0; } -:where(.bluelib) .table.panel-dialog .table-footer > .table-row { +:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-footer) > :where(.table-row) { border-top-width: 1px; } -:where(.bluelib) .table.panel-dialog .table-head, -:where(.bluelib) .table.panel-dialog .table-data { +:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-head), +:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-data) { border-width: 0 0 0 1px; padding: 8px 8px 8px 7px; } -:where(.bluelib) .table.panel-dialog .table-caption { +:where(.bluelib) :where(.table):where(.panel-dialog) :where(.table-caption) { border-width: 0 0 0 2px; padding: 8px 8px 8px 6px; } -:where(.bluelib) .panel > .list-unordered, -:where(.bluelib) .panel > .list-ordered { +:where(.bluelib) :where(.panel) > :where(.list-unordered), +:where(.bluelib) :where(.panel) > :where(.list-ordered) { margin-left: 6ex; } -:where(.bluelib) .glossary-term { +:where(.bluelib) :where(.glossary-term) { margin-top: 0.5em; padding: 0.2em 0; --bhsl-current-hue: var(--bhsl-primary-hue); @@ -373,14 +291,14 @@ line-height: var(--bfont-term-height); font-family: var(--bfont-term-family); } -:where(.bluelib) .glossary-description { +:where(.bluelib) :where(.glossary-description) { margin-left: 4.5ex; margin-bottom: 0.5em; } -:where(.bluelib) .glossary-details { +:where(.bluelib) :where(.glossary-details) { margin-left: 4.5ex; } -:where(.bluelib) .glossary-summary { +:where(.bluelib) :where(.glossary-summary) { cursor: pointer; margin-left: -4ex; padding: 0.2em 0; @@ -392,11 +310,10 @@ font-family: var(--bfont-summary-family); user-select: none; } -:where(.bluelib) .modifier-fade { +:where(.bluelib) :where(.modifier-fade) { opacity: 0.3; } -:where(.bluelib) .modifier-mark, -:where(.bluelib) .element-mark { +:where(.bluelib) :where(.modifier-mark) { font-style: var(--bfont-mark-style); font-variant: var(--bfont-mark-variant); font-weight: var(--bfont-mark-weight); @@ -408,73 +325,63 @@ --bhsl-current-saturation: var(--bhsl-mark-foreground-saturation); --bhsl-current-lightness: var(--bhsl-mark-foreground-lightness); } -:where(.bluelib) .modifier-mark .modifier-mark, -:where(.bluelib) .element-mark .modifier-mark, -:where(.bluelib) .modifier-mark .element-mark, -:where(.bluelib) .element-mark .element-mark { +: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) .modifier-mark .modifier-mark .modifier-mark, -:where(.bluelib) .element-mark .modifier-mark .modifier-mark, -:where(.bluelib) .modifier-mark .element-mark .modifier-mark, -:where(.bluelib) .element-mark .element-mark .modifier-mark, -:where(.bluelib) .modifier-mark .modifier-mark .element-mark, -:where(.bluelib) .element-mark .modifier-mark .element-mark, -:where(.bluelib) .modifier-mark .element-mark .element-mark, -:where(.bluelib) .element-mark .element-mark .element-mark { +: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) .modifier-todo { +: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) .modifier-todo, -:where(.bluelib) .modifier-todo .panel { +: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) .property-disabled { +:where(.bluelib) :where(.property-disabled) { border-style: dashed; cursor: not-allowed; } -:where(.bluelib) .modifier-red { +: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) .modifier-yellow { +: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) .modifier-green { +: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) .modifier-cyan { +: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) .modifier-blue { +: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) .modifier-magenta { +: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) .input { +:where(.bluelib) :where(.input) { font: inherit; cursor: pointer; background-color: transparent; @@ -484,50 +391,50 @@ border-width: 0; border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.4); } -:where(.bluelib) .input::placeholder { +:where(.bluelib) :where(.input)::placeholder { opacity: 1; color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.4); } -:where(.bluelib) .input:hover:not(.property-disabled) { +:where(.bluelib) :where(.input):hover:not(:where(.property-disabled)) { border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(.bluelib) .input:hover:not(.property-disabled)::placeholder { +:where(.bluelib) :where(.input):hover:not(:where(.property-disabled))::placeholder { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(.bluelib) .input:active:not(.property-disabled), -:where(.bluelib) .input:focus:not(.property-disabled) { +: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) .input-area { +:where(.bluelib) :where(.input-area) { resize: vertical; } -:where(.bluelib) .input-field, -:where(.bluelib) .input-select { +:where(.bluelib) :where(.input-field), +:where(.bluelib) :where(.input-select) { border-bottom-width: 2px; } -:where(.bluelib) .input-area, -:where(.bluelib) .input-multiselect { +:where(.bluelib) :where(.input-area), +:where(.bluelib) :where(.input-multiselect) { border-left-width: 2px; } -:where(.bluelib) .input-field:not(.property-disabled), -:where(.bluelib) .input-area:not(.property-disabled) { +:where(.bluelib) :where(.input-field):not(:where(.property-disabled)), +:where(.bluelib) :where(.input-area):not(:where(.property-disabled)) { cursor: text; } -:where(.bluelib) .input-select:not(.property-disabled), -:where(.bluelib) .input-multiselect:not(.property-disabled) { +:where(.bluelib) :where(.input-select):not(:where(.property-disabled)), +:where(.bluelib) :where(.input-multiselect):not(:where(.property-disabled)) { cursor: vertical-text; } -:where(.bluelib) .input-range:not(.property-disabled) { +:where(.bluelib) :where(.input-range):not(:where(.property-disabled)) { cursor: ew-resize; } -:where(.bluelib) .input-radio:not(.property-disabled), -:where(.bluelib) .input-checkbox:not(.property-disabled), -:where(.bluelib) .input-button:not(.property-disabled), -:where(.bluelib) .input-color:not(.property-disabled) { +:where(.bluelib) :where(.input-radio):not(:where(.property-disabled)), +:where(.bluelib) :where(.input-checkbox):not(:where(.property-disabled)), +:where(.bluelib) :where(.input-button):not(:where(.property-disabled)), +:where(.bluelib) :where(.input-color):not(:where(.property-disabled)) { cursor: pointer; } -:where(.bluelib) .input-select optgroup, -:where(.bluelib) .input-multiselect optgroup { +:where(.bluelib) :where(.input-select) optgroup, +:where(.bluelib) :where(.input-multiselect) optgroup { padding-bottom: 0.25em; font-style: var(--bfont-header-style); font-variant: var(--bfont-header-variant); @@ -536,12 +443,12 @@ line-height: var(--bfont-header-height); font-family: var(--bfont-header-family); } -:where(.bluelib) .input-select optgroup option, -:where(.bluelib) .input-multiselect optgroup option { +:where(.bluelib) :where(.input-select) optgroup option, +:where(.bluelib) :where(.input-multiselect) optgroup option { padding: 0.125em 0 0.125em 2ex; } -:where(.bluelib) .input-select option, -:where(.bluelib) .input-multiselect option { +:where(.bluelib) :where(.input-select) option, +:where(.bluelib) :where(.input-multiselect) option { font-style: var(--bfont-text-style); font-variant: var(--bfont-text-variant); font-weight: var(--bfont-text-weight); @@ -549,8 +456,8 @@ line-height: var(--bfont-text-height); font-family: var(--bfont-text-family); } -:where(.bluelib) .input-radio, -:where(.bluelib) .input-checkbox { +:where(.bluelib) :where(.input-radio), +:where(.bluelib) :where(.input-checkbox) { appearance: none; width: 1em; height: 1em; @@ -560,89 +467,65 @@ justify-content: center; align-items: center; } -:where(.bluelib) .input-radio::before, -:where(.bluelib) .input-checkbox::before { +:where(.bluelib) :where(.input-radio)::before, +:where(.bluelib) :where(.input-checkbox)::before { display: block; content: ""; width: 100%; height: 100%; } -:where(.bluelib) .input-radio:checked::before, -:where(.bluelib) .input-checkbox:checked::before { +:where(.bluelib) :where(.input-radio):checked::before, +:where(.bluelib) :where(.input-checkbox):checked::before { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(.bluelib) .input-radio { +:where(.bluelib) :where(.input-radio) { border-radius: 100%; } -:where(.bluelib) .input-radio::before { +:where(.bluelib) :where(.input-radio)::before { border-radius: 100%; } -:where(.bluelib) .input-range { +:where(.bluelib) :where(.input-range) { padding: 0; - /* - appearance: none; - - &::-moz-range-thumb { - width: 0; - border-radius: 0; - border-style: outset; - - border-color: .hsl-group(current)[@c]; - border-width: 4px; - - background-color: .hsl-group(primary)[@c]; - } - - &::-moz-range-track { - height: 0.125em; - background-color: .hsl-group(current)[@c]; - } - - &::-moz-range-progress { - height: 0.5em; - background-color: .hsl-group(current)[@c]; - } - */ -} -:where(.bluelib) .input-button { +} +:where(.bluelib) :where(.input-button) { border-width: 2px; border-style: outset; } -:where(.bluelib) .input-button:active { +:where(.bluelib) :where(.input-button):active { border-style: inset; } -:where(.bluelib) .input-file, -:where(.bluelib) .input-color { +:where(.bluelib) :where(.input-file), +:where(.bluelib) :where(.input-color) { padding: 0; } @media screen and (-webkit-min-device-pixel-ratio: 0) { - :where(.bluelib) .input-field::-webkit-calendar-picker-indicator { + :where(.bluelib) :where(.input-field)::-webkit-calendar-picker-indicator { filter: invert(calc(calc(var(--bhsl-current-lightness) - 50%) * 1000)); } - :where(.bluelib) .input-select optgroup, - :where(.bluelib) .input-select option { + :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) .input-select optgroup::before, - :where(.bluelib) .input-select option::before { + :where(.bluelib) :where(.input-select) optgroup::before, + :where(.bluelib) :where(.input-select) option::before { content: ""; } } -:where(.bluelib) .form-flex { +:where(.bluelib) :where(.form-flex) { display: flex; flex-direction: column; justify-content: stretch; } -:where(.bluelib) .form-flex > .form-flex-content { +:where(.bluelib) :where(.form-flex) > :where(.form-flex-content) { margin: 0.5em 0; } -:where(.bluelib) .form-flex > .form-flex-choice { +:where(.bluelib) :where(.form-flex) > :where(.form-flex-choice) { display: flex; gap: 1ex; min-height: 1.675em; } -:where(.bluelib) .form-flex > .form-flex-choice > *:first-child, -:where(.bluelib) .form-flex > .form-flex-choice > *:last-child { +: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; @@ -657,7 +540,7 @@ --bhsl-current-saturation: var(--bhsl-primary-saturation); --bhsl-current-lightness: var(--bhsl-primary-lightness); } -:where(.bluelib) .form-flex > .form-flex-choice > * { +:where(.bluelib) :where(.form-flex) > :where(.form-flex-choice) > :where(*) { flex-grow: 1; display: flex; justify-content: space-between; @@ -665,20 +548,20 @@ align-items: stretch; gap: 1ex; } -:where(.bluelib) .form-flex > .form-flex-choice > *:first-child { +:where(.bluelib) :where(.form-flex) > :where(.form-flex-choice) > :where(*):first-child { text-align: right; display: block; } -:where(.bluelib) .form-flex > .form-flex-choice > *:last-child { +:where(.bluelib) :where(.form-flex) > :where(.form-flex-choice) > :where(*):last-child { text-align: left; display: block; } -:where(.bluelib) .text-anchor { +: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) .text-idiomatic { +:where(.bluelib) :where(.text-idiomatic) { font-style: var(--bfont-idiomatic-style); font-variant: var(--bfont-idiomatic-variant); font-weight: var(--bfont-idiomatic-weight); @@ -686,7 +569,7 @@ line-height: var(--bfont-idiomatic-height); font-family: var(--bfont-idiomatic-family); } -:where(.bluelib) .text-emphasis { +:where(.bluelib) :where(.text-emphasis) { font-style: var(--bfont-emphasis-style); font-variant: var(--bfont-emphasis-variant); font-weight: var(--bfont-emphasis-weight); @@ -694,7 +577,7 @@ line-height: var(--bfont-emphasis-height); font-family: var(--bfont-emphasis-family); } -:where(.bluelib) .text-attention { +:where(.bluelib) :where(.text-attention) { font-style: var(--bfont-attention-style); font-variant: var(--bfont-attention-variant); font-weight: var(--bfont-attention-weight); @@ -702,7 +585,7 @@ line-height: var(--bfont-attention-height); font-family: var(--bfont-attention-family); } -:where(.bluelib) .text-strong { +:where(.bluelib) :where(.text-strong) { font-style: var(--bfont-strong-style); font-variant: var(--bfont-strong-variant); font-weight: var(--bfont-strong-weight); @@ -710,20 +593,20 @@ line-height: var(--bfont-strong-height); font-family: var(--bfont-strong-family); } -:where(.bluelib) .text-inserted { +: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) .text-deleted { +: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) .text-code, -:where(.bluelib) .text-preformatted, -:where(.bluelib) .text-input, -:where(.bluelib) .text-output { +:where(.bluelib) :where(.text-code), +:where(.bluelib) :where(.text-preformatted), +:where(.bluelib) :where(.text-input), +:where(.bluelib) :where(.text-output) { font-style: var(--bfont-code-style); font-variant: var(--bfont-code-variant); font-weight: var(--bfont-code-weight); @@ -731,20 +614,20 @@ line-height: var(--bfont-code-height); font-family: var(--bfont-code-family); } -:where(.bluelib) .text-preformatted { +:where(.bluelib) :where(.text-preformatted) { overflow-x: scroll; } -:where(.bluelib) .text-input, -:where(.bluelib) .text-output { +:where(.bluelib) :where(.text-input), +:where(.bluelib) :where(.text-output) { padding: 0 0.25ex; } -:where(.bluelib) .text-input { +: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) .text-input .text-input { +: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); @@ -752,13 +635,13 @@ line-height: var(--bfont-boldcode-height); font-family: var(--bfont-boldcode-family); } -:where(.bluelib) .text-output { +: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) .text-output .text-output { +: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); @@ -766,7 +649,7 @@ line-height: var(--bfont-boldcode-height); font-family: var(--bfont-boldcode-family); } -:where(.bluelib) .text-variable { +:where(.bluelib) :where(.text-variable) { font-style: var(--bfont-variable-style); font-variant: var(--bfont-variable-variant); font-weight: var(--bfont-variable-weight); @@ -774,7 +657,7 @@ line-height: var(--bfont-variable-height); font-family: var(--bfont-variable-family); } -:where(.bluelib) .text-citation { +:where(.bluelib) :where(.text-citation) { font-style: var(--bfont-citation-style); font-variant: var(--bfont-citation-variant); font-weight: var(--bfont-citation-weight); @@ -782,7 +665,7 @@ line-height: var(--bfont-citation-height); font-family: var(--bfont-citation-family); } -:where(.bluelib) .text-definition { +:where(.bluelib) :where(.text-definition) { font-style: var(--bfont-term-style); font-variant: var(--bfont-term-variant); font-weight: var(--bfont-term-weight); @@ -793,6 +676,6 @@ --bhsl-current-saturation: var(--bhsl-primary-saturation); --bhsl-current-lightness: var(--bhsl-primary-lightness); } -:where(.bluelib) .text-abbreviation { +:where(.bluelib) :where(.text-abbreviation) { cursor: help; } diff --git a/dist/base.module.min.css b/dist/base.module.min.css new file mode 100644 index 0000000..63f9bf1 --- /dev/null +++ b/dist/base.module.min.css @@ -0,0 +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){margin:1rem 0;text-align:center;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 diff --git a/dist/base.root.css b/dist/base.root.css index 45757ba..df0e52f 100644 --- a/dist/base.root.css +++ b/dist/base.root.css @@ -17,7 +17,7 @@ font-family: var(--bfont-text-family); } :where(body), -:where(body) * { +:where(body) :where(*) { margin: 0; padding: 0; color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); @@ -27,56 +27,51 @@ 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(body) :where(*), :where(body)::before, -:where(body) *::before, +:where(body) :where(*)::before, :where(body)::after, -:where(body) *::after { +:where(body) :where(*)::after { box-sizing: border-box; } :where(body):focus-visible, -:where(body) *:focus-visible { +:where(body) :where(*):focus-visible { outline-width: 4px; outline-style: solid; outline-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.3); } -:where(body) footer { +:where(body) :where(footer) { margin: 1rem 0; text-align: center; font-size: x-small; } -:where(body) .float-top { +:where(body) :where(.float-top) { margin-bottom: auto; } -:where(body) .float-right { +:where(body) :where(.float-right) { margin-left: auto; } -:where(body) .float-bottom { +:where(body) :where(.float-bottom) { margin-top: auto; } -:where(body) .float-left { +:where(body) :where(.float-left) { margin-right: auto; } -:where(body) .float-hcenter { +:where(body) :where(.float-hcenter) { margin-left: auto; margin-right: auto; } -:where(body) .float-vcenter { +:where(body) :where(.float-vcenter) { margin-top: auto; margin-bottom: auto; } -:where(body) h1 { +:where(body) :where(h1) { font-size: 2.5em; } -:where(body) h2 { +:where(body) :where(h2) { font-size: 1.75em; } -:where(body) h1, -:where(body) h2, -:where(body) h3, -:where(body) h4, -:where(body) h5, -:where(body) h6 { +: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); @@ -88,7 +83,7 @@ line-height: var(--bfont-header-height); font-family: var(--bfont-header-family); } -:where(body) .panel { +:where(body) :where(.panel) { padding-top: 8px; padding-right: 8px; padding-left: 8px; @@ -101,187 +96,110 @@ gap: 8px; background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } -:where(body) .panel.border-top, -:where(body) .panel.box { +:where(body) :where(.panel):where(.border-top), +:where(body) :where(.panel):where(.box) { border-top-width: 2px; padding-top: 6px; } -:where(body) .panel.border-right, -:where(body) .panel.box { +:where(body) :where(.panel):where(.border-right), +:where(body) :where(.panel):where(.box) { border-right-width: 2px; padding-right: 6px; } -:where(body) .panel.border-left, -:where(body) .panel.box, -:where(body) .panel.dialog { +: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) .panel.border-bottom, -:where(body) .panel.box { +:where(body) :where(.panel):where(.border-bottom), +:where(body) :where(.panel):where(.box) { border-bottom-width: 2px; padding-bottom: 6px; } -:where(body) .panel.parenthesis { +:where(body) :where(.panel):where(.parenthesis) { font-size: smaller; } -:where(body) .chapter-0, -:where(body) .chapter-1, -:where(body) .chapter-2, -:where(body) .chapter-3, -:where(body) .chapter-4, -:where(body) .chapter-5, -:where(body) .chapter-6, -:where(body) .chapter-7, -:where(body) .chapter-8, -:where(body) .chapter-9 { - display: flex; - flex-wrap: wrap; - flex-direction: row; - gap: 8px; - justify-content: center; - align-items: stretch; - margin: 8px 0; -} -:where(body) .chapter-0 > *, -:where(body) .chapter-1 > *, -:where(body) .chapter-2 > *, -:where(body) .chapter-3 > *, -:where(body) .chapter-4 > *, -:where(body) .chapter-5 > *, -:where(body) .chapter-6 > *, -:where(body) .chapter-7 > *, -:where(body) .chapter-8 > *, -:where(body) .chapter-9 > * { - flex-grow: 1; - flex-shrink: 0; -} -:where(body) .chapter-0 > h1, -:where(body) .chapter-1 > h1, -:where(body) .chapter-2 > h1, -:where(body) .chapter-3 > h1, -:where(body) .chapter-4 > h1, -:where(body) .chapter-5 > h1, -:where(body) .chapter-6 > h1, -:where(body) .chapter-7 > h1, -:where(body) .chapter-8 > h1, -:where(body) .chapter-9 > h1, -:where(body) .chapter-0 > h2, -:where(body) .chapter-1 > h2, -:where(body) .chapter-2 > h2, -:where(body) .chapter-3 > h2, -:where(body) .chapter-4 > h2, -:where(body) .chapter-5 > h2, -:where(body) .chapter-6 > h2, -:where(body) .chapter-7 > h2, -:where(body) .chapter-8 > h2, -:where(body) .chapter-9 > h2, -:where(body) .chapter-0 > h3, -:where(body) .chapter-1 > h3, -:where(body) .chapter-2 > h3, -:where(body) .chapter-3 > h3, -:where(body) .chapter-4 > h3, -:where(body) .chapter-5 > h3, -:where(body) .chapter-6 > h3, -:where(body) .chapter-7 > h3, -:where(body) .chapter-8 > h3, -:where(body) .chapter-9 > h3, -:where(body) .chapter-0 > h4, -:where(body) .chapter-1 > h4, -:where(body) .chapter-2 > h4, -:where(body) .chapter-3 > h4, -:where(body) .chapter-4 > h4, -:where(body) .chapter-5 > h4, -:where(body) .chapter-6 > h4, -:where(body) .chapter-7 > h4, -:where(body) .chapter-8 > h4, -:where(body) .chapter-9 > h4, -:where(body) .chapter-0 > h5, -:where(body) .chapter-1 > h5, -:where(body) .chapter-2 > h5, -:where(body) .chapter-3 > h5, -:where(body) .chapter-4 > h5, -:where(body) .chapter-5 > h5, -:where(body) .chapter-6 > h5, -:where(body) .chapter-7 > h5, -:where(body) .chapter-8 > h5, -:where(body) .chapter-9 > h5, -:where(body) .chapter-0 > h6, -:where(body) .chapter-1 > h6, -:where(body) .chapter-2 > h6, -:where(body) .chapter-3 > h6, -:where(body) .chapter-4 > h6, -:where(body) .chapter-5 > h6, -:where(body) .chapter-6 > h6, -:where(body) .chapter-7 > h6, -:where(body) .chapter-8 > h6, -:where(body) .chapter-9 > h6 { - flex-basis: 100%; - margin-top: 1.2em; -} -:where(body) .chapter-0 { +:where(body) :where(.chapter-0) { flex-wrap: nowrap; } -:where(body) .chapter-0 > * { +:where(body) :where(.chapter-0) > :where(*) { flex-shrink: 1; } -:where(body) .chapter-1 > * { +:where(body) :where(.chapter-1) > :where(*) { flex-basis: calc(100% / 2); } -:where(body) .chapter-2 > * { +:where(body) :where(.chapter-2) > :where(*) { flex-basis: calc(100% / 3); } -:where(body) .chapter-3 > * { +:where(body) :where(.chapter-3) > :where(*) { flex-basis: calc(100% / 4); } -:where(body) .chapter-4 > * { +:where(body) :where(.chapter-4) > :where(*) { flex-basis: calc(100% / 5); } -:where(body) .chapter-5 > * { +:where(body) :where(.chapter-5) > :where(*) { flex-basis: calc(100% / 6); } -:where(body) .chapter-6 > * { +:where(body) :where(.chapter-6) > :where(*) { flex-basis: calc(100% / 7); } -:where(body) .chapter-7 > * { +:where(body) :where(.chapter-7) > :where(*) { flex-basis: calc(100% / 8); } -:where(body) .chapter-8 > * { +:where(body) :where(.chapter-8) > :where(*) { flex-basis: calc(100% / 9); } -:where(body) .chapter-9 > * { +:where(body) :where(.chapter-9) > :where(*) { flex-basis: calc(100% / 10); } -:where(body) hr { +: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) .separator-light { +:where(body) :where(.separator-light) { border-style: dotted; } -:where(body) .separator-heavy { +:where(body) :where(.separator-heavy) { border-style: solid; } -:where(body) img { +:where(body) :where(img) { display: block; max-width: 100%; object-fit: contain; } -:where(body) .image-limit-half { +:where(body) :where(.image-limit-half) { max-height: max(28.2vw, 50vh); } -:where(body) .image-limit-quarter { +:where(body) :where(.image-limit-quarter) { max-height: max(14.1vw, 25vh); } -:where(body) table { +:where(body) :where(table) { border-collapse: collapse; } -:where(body) table th, -:where(body) table td { +:where(body) :where(table) :where(th), +:where(body) :where(table) :where(td) { padding: 3px 7px; border-width: 1px; } -:where(body) table caption { +:where(body) :where(table) :where(caption) { border-width: 1px; font-style: var(--bfont-caption-style); font-variant: var(--bfont-caption-variant); @@ -290,77 +208,77 @@ line-height: var(--bfont-caption-height); font-family: var(--bfont-caption-family); } -:where(body) table caption.table-caption-top { +:where(body) :where(table) :where(caption):where(.table-caption-top) { caption-side: top; border-bottom-width: 0; } -:where(body) table caption.table-caption-bottom { +:where(body) :where(table) :where(caption):where(.table-caption-bottom) { caption-side: bottom; border-top-width: 0; } -:where(body) table.panel { +:where(body) :where(table):where(.panel) { display: table; } -:where(body) table.panel th, -:where(body) table.panel td { +:where(body) :where(table):where(.panel) :where(th), +:where(body) :where(table):where(.panel) :where(td) { padding: 8px; } -:where(body) table.panel caption { +: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) table.panel caption * { +:where(body) :where(table):where(.panel) :where(caption) :where(*) { margin-top: 8px; margin-bottom: 8px; } -:where(body) table.panel caption *:first-child { +:where(body) :where(table):where(.panel) :where(caption) :where(*):first-child { margin-top: 0; } -:where(body) table.panel caption *:last-child { +:where(body) :where(table):where(.panel) :where(caption) :where(*):last-child { margin-bottom: 0; } -:where(body) table.box tr { +:where(body) :where(table):where(.box) :where(tr) { border-width: 1px; } -:where(body) table.box th, -:where(body) table.box td { +:where(body) :where(table):where(.box) :where(th), +:where(body) :where(table):where(.box) :where(td) { border-width: 1px; padding: 7px; } -:where(body) table.box caption { +:where(body) :where(table):where(.box) :where(caption) { border-width: 2px; padding: 6px; } -:where(body) table.box caption.table-caption-top { +:where(body) :where(table):where(.box) :where(caption):where(.table-caption-top) { border-bottom-width: 0; } -:where(body) table.box caption.table-caption-bottom { +:where(body) :where(table):where(.box) :where(caption):where(.table-caption-bottom) { border-top-width: 0; } -:where(body) table.dialog thead > tr { +:where(body) :where(table):where(.dialog) :where(thead) > :where(tr) { border-bottom-width: 1px; } -:where(body) table.dialog tbody > tr { +:where(body) :where(table):where(.dialog) :where(tbody) > :where(tr) { border-width: 0; } -:where(body) table.dialog tfoot > tr { +:where(body) :where(table):where(.dialog) :where(tfoot) > :where(tr) { border-top-width: 1px; } -:where(body) table.dialog th, -:where(body) table.dialog td { +:where(body) :where(table):where(.dialog) :where(th), +:where(body) :where(table):where(.dialog) :where(td) { border-width: 0 0 0 1px; padding: 8px 8px 8px 7px; } -:where(body) table.dialog caption { +:where(body) :where(table):where(.dialog) :where(caption) { border-width: 0 0 0 2px; padding: 8px 8px 8px 6px; } -:where(body) .panel > ul, -:where(body) .panel > ol { +:where(body) :where(.panel) > :where(ul), +:where(body) :where(.panel) > :where(ol) { margin-left: 6ex; } -:where(body) dt { +:where(body) :where(dt) { margin-top: 0.5em; padding: 0.2em 0; --bhsl-current-hue: var(--bhsl-primary-hue); @@ -373,14 +291,14 @@ line-height: var(--bfont-term-height); font-family: var(--bfont-term-family); } -:where(body) dd { +:where(body) :where(dd) { margin-left: 4.5ex; margin-bottom: 0.5em; } -:where(body) details { +:where(body) :where(details) { margin-left: 4.5ex; } -:where(body) summary { +:where(body) :where(summary) { cursor: pointer; margin-left: -4ex; padding: 0.2em 0; @@ -392,11 +310,10 @@ font-family: var(--bfont-summary-family); user-select: none; } -:where(body) .fade { +:where(body) :where(.fade) { opacity: 0.3; } -:where(body) .mark, -:where(body) mark { +:where(body) :where(mark, .mark) { font-style: var(--bfont-mark-style); font-variant: var(--bfont-mark-variant); font-weight: var(--bfont-mark-weight); @@ -408,76 +325,63 @@ --bhsl-current-saturation: var(--bhsl-mark-foreground-saturation); --bhsl-current-lightness: var(--bhsl-mark-foreground-lightness); } -:where(body) .mark .mark, -:where(body) mark .mark, -:where(body) .mark mark, -:where(body) 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)); --bhsl-current-hue: var(--bhsl-foreground-hue); --bhsl-current-saturation: var(--bhsl-foreground-saturation); --bhsl-current-lightness: var(--bhsl-foreground-lightness); } -:where(body) .mark .mark .mark, -:where(body) mark .mark .mark, -:where(body) .mark mark .mark, -:where(body) mark mark .mark, -:where(body) .mark .mark mark, -:where(body) mark .mark mark, -:where(body) .mark mark mark, -:where(body) mark 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)); --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) .todo { +: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) .todo, -:where(body) .todo .panel { +: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) [disabled] { +:where(body) :where([disabled]) { border-style: dashed; cursor: not-allowed; } -:where(body) .red { +: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) .yellow { +: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) .green { +: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) .cyan { +: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) .blue { +: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) .magenta { +: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) input, -:where(body) textarea, -:where(body) select, -:where(body) button { +:where(body) :where(input, textarea, select, button) { font: inherit; cursor: pointer; background-color: transparent; @@ -487,82 +391,50 @@ border-width: 0; border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.4); } -:where(body) input::placeholder, -:where(body) textarea::placeholder, -:where(body) select::placeholder, -:where(body) button::placeholder { +:where(body) :where(input, textarea, select, button)::placeholder { opacity: 1; color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.4); } -:where(body) input:hover:not([disabled]), -:where(body) textarea:hover:not([disabled]), -:where(body) select:hover:not([disabled]), -:where(body) button:hover:not([disabled]) { +: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) / 0.7); } -:where(body) input:hover:not([disabled])::placeholder, -:where(body) textarea:hover:not([disabled])::placeholder, -:where(body) select:hover:not([disabled])::placeholder, -:where(body) button:hover:not([disabled])::placeholder { +: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) / 0.7); } -:where(body) input:active:not([disabled]), -:where(body) textarea:active:not([disabled]), -:where(body) select:active:not([disabled]), -:where(body) button:active:not([disabled]), -:where(body) input:focus:not([disabled]), -:where(body) textarea:focus:not([disabled]), -:where(body) select:focus:not([disabled]), -:where(body) button:focus:not([disabled]) { +: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) textarea { +:where(body) :where(textarea) { resize: vertical; } -:where(body) input[type="text"], -:where(body) input[type="password"], -:where(body) input[type="email"], -:where(body) input[type="number"], -:where(body) input[type="search"], -:where(body) input[type="tel"], -:where(body) input[type="datetime-local"], -:where(body) input[type="date"], -:where(body) input[type="time"], -:where(body) select:not([multiple]) { +: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) textarea, -:where(body) select[multiple] { +:where(body) :where(textarea), +:where(body) :where(select[multiple]) { border-left-width: 2px; } -:where(body) input[type="text"], -:where(body) input[type="password"], -:where(body) input[type="email"], -:where(body) input[type="number"], -:where(body) input[type="search"], -:where(body) input[type="tel"], -:where(body) input[type="datetime-local"], -:where(body) input[type="date"], -:where(body) input[type="time"]:not([disabled]), -:where(body) textarea:not([disabled]) { +: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) select:not([multiple]):not([disabled]), -:where(body) select[multiple]:not([disabled]) { +:where(body) :where(select:not([multiple])):not(:where([disabled])), +:where(body) :where(select[multiple]):not(:where([disabled])) { cursor: vertical-text; } -:where(body) input[type="range"]:not([disabled]) { +:where(body) :where(input[type="range"]):not(:where([disabled])) { cursor: ew-resize; } -:where(body) input[type="radio"]:not([disabled]), -:where(body) input[type="checkbox"]:not([disabled]), -:where(body) input[type="button"], -:where(body) button:not([disabled]), -:where(body) input[type="color"]:not([disabled]) { +: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) select:not([multiple]) optgroup, -:where(body) select[multiple] optgroup { +:where(body) :where(select:not([multiple])) optgroup, +:where(body) :where(select[multiple]) optgroup { padding-bottom: 0.25em; font-style: var(--bfont-header-style); font-variant: var(--bfont-header-variant); @@ -571,12 +443,12 @@ line-height: var(--bfont-header-height); font-family: var(--bfont-header-family); } -:where(body) select:not([multiple]) optgroup option, -:where(body) select[multiple] optgroup option { +:where(body) :where(select:not([multiple])) optgroup option, +:where(body) :where(select[multiple]) optgroup option { padding: 0.125em 0 0.125em 2ex; } -:where(body) select:not([multiple]) option, -:where(body) select[multiple] option { +: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); @@ -584,8 +456,8 @@ line-height: var(--bfont-text-height); font-family: var(--bfont-text-family); } -:where(body) input[type="radio"], -:where(body) input[type="checkbox"] { +:where(body) :where(input[type="radio"]), +:where(body) :where(input[type="checkbox"]) { appearance: none; width: 1em; height: 1em; @@ -595,99 +467,65 @@ justify-content: center; align-items: center; } -:where(body) input[type="radio"]::before, -:where(body) input[type="checkbox"]::before { +:where(body) :where(input[type="radio"])::before, +:where(body) :where(input[type="checkbox"])::before { display: block; content: ""; width: 100%; height: 100%; } -:where(body) input[type="radio"]:checked::before, -:where(body) input[type="checkbox"]:checked::before { +: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) input[type="radio"] { +:where(body) :where(input[type="radio"]) { border-radius: 100%; } -:where(body) input[type="radio"]::before { +:where(body) :where(input[type="radio"])::before { border-radius: 100%; } -:where(body) input[type="range"] { +:where(body) :where(input[type="range"]) { padding: 0; - /* - appearance: none; - - &::-moz-range-thumb { - width: 0; - border-radius: 0; - border-style: outset; - - border-color: .hsl-group(current)[@c]; - border-width: 4px; - - background-color: .hsl-group(primary)[@c]; - } - - &::-moz-range-track { - height: 0.125em; - background-color: .hsl-group(current)[@c]; - } - - &::-moz-range-progress { - height: 0.5em; - background-color: .hsl-group(current)[@c]; - } - */ -} -:where(body) input[type="button"], -:where(body) button { +} +:where(body) :where(input[type="button"], button) { border-width: 2px; border-style: outset; } -:where(body) input[type="button"]:active, -:where(body) button:active { +:where(body) :where(input[type="button"], button):active { border-style: inset; } -:where(body) input[type="file"], -:where(body) input[type="color"] { +:where(body) :where(input[type="file"]), +:where(body) :where(input[type="color"]) { padding: 0; } @media screen and (-webkit-min-device-pixel-ratio: 0) { - :where(body) input[type="text"]::-webkit-calendar-picker-indicator, - :where(body) input[type="password"]::-webkit-calendar-picker-indicator, - :where(body) input[type="email"]::-webkit-calendar-picker-indicator, - :where(body) input[type="number"]::-webkit-calendar-picker-indicator, - :where(body) input[type="search"]::-webkit-calendar-picker-indicator, - :where(body) input[type="tel"]::-webkit-calendar-picker-indicator, - :where(body) input[type="datetime-local"]::-webkit-calendar-picker-indicator, - :where(body) input[type="date"]::-webkit-calendar-picker-indicator, - :where(body) input[type="time"]::-webkit-calendar-picker-indicator { + :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) select:not([multiple]) optgroup, - :where(body) select:not([multiple]) option { + :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) select:not([multiple]) optgroup::before, - :where(body) select:not([multiple]) option::before { + :where(body) :where(select:not([multiple])) optgroup::before, + :where(body) :where(select:not([multiple])) option::before { content: ""; } } -:where(body) .form-flex { +:where(body) :where(.form-flex) { display: flex; flex-direction: column; justify-content: stretch; } -:where(body) .form-flex > :is(.form-flex-content, p) { +:where(body) :where(.form-flex) > :where(.form-flex-content, p) { margin: 0.5em 0; } -:where(body) .form-flex > :is(.form-flex-choice, label) { +:where(body) :where(.form-flex) > :where(.form-flex-choice, label) { display: flex; gap: 1ex; min-height: 1.675em; } -:where(body) .form-flex > :is(.form-flex-choice, label) > *:first-child, -:where(body) .form-flex > :is(.form-flex-choice, label) > *:last-child { +: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; @@ -702,7 +540,7 @@ --bhsl-current-saturation: var(--bhsl-primary-saturation); --bhsl-current-lightness: var(--bhsl-primary-lightness); } -:where(body) .form-flex > :is(.form-flex-choice, label) > * { +:where(body) :where(.form-flex) > :where(.form-flex-choice, label) > :where(*) { flex-grow: 1; display: flex; justify-content: space-between; @@ -710,20 +548,20 @@ align-items: stretch; gap: 1ex; } -:where(body) .form-flex > :is(.form-flex-choice, label) > *:first-child { +:where(body) :where(.form-flex) > :where(.form-flex-choice, label) > :where(*):first-child { text-align: right; display: block; } -:where(body) .form-flex > :is(.form-flex-choice, label) > *:last-child { +:where(body) :where(.form-flex) > :where(.form-flex-choice, label) > :where(*):last-child { text-align: left; display: block; } -:where(body) a { +: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) i { +:where(body) :where(i) { font-style: var(--bfont-idiomatic-style); font-variant: var(--bfont-idiomatic-variant); font-weight: var(--bfont-idiomatic-weight); @@ -731,7 +569,7 @@ line-height: var(--bfont-idiomatic-height); font-family: var(--bfont-idiomatic-family); } -:where(body) em { +:where(body) :where(em) { font-style: var(--bfont-emphasis-style); font-variant: var(--bfont-emphasis-variant); font-weight: var(--bfont-emphasis-weight); @@ -739,7 +577,7 @@ line-height: var(--bfont-emphasis-height); font-family: var(--bfont-emphasis-family); } -:where(body) b { +:where(body) :where(b) { font-style: var(--bfont-attention-style); font-variant: var(--bfont-attention-variant); font-weight: var(--bfont-attention-weight); @@ -747,7 +585,7 @@ line-height: var(--bfont-attention-height); font-family: var(--bfont-attention-family); } -:where(body) strong { +:where(body) :where(strong) { font-style: var(--bfont-strong-style); font-variant: var(--bfont-strong-variant); font-weight: var(--bfont-strong-weight); @@ -755,20 +593,20 @@ line-height: var(--bfont-strong-height); font-family: var(--bfont-strong-family); } -:where(body) ins { +: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) del { +: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) code, -:where(body) pre, -:where(body) kbd, -:where(body) samp { +:where(body) :where(code), +:where(body) :where(pre), +:where(body) :where(kbd), +:where(body) :where(samp) { font-style: var(--bfont-code-style); font-variant: var(--bfont-code-variant); font-weight: var(--bfont-code-weight); @@ -776,20 +614,20 @@ line-height: var(--bfont-code-height); font-family: var(--bfont-code-family); } -:where(body) pre { +:where(body) :where(pre) { overflow-x: scroll; } -:where(body) kbd, -:where(body) samp { +:where(body) :where(kbd), +:where(body) :where(samp) { padding: 0 0.25ex; } -:where(body) kbd { +: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) kbd kbd { +:where(body) :where(kbd) :where(kbd) { font-style: var(--bfont-boldcode-style); font-variant: var(--bfont-boldcode-variant); font-weight: var(--bfont-boldcode-weight); @@ -797,13 +635,13 @@ line-height: var(--bfont-boldcode-height); font-family: var(--bfont-boldcode-family); } -:where(body) samp { +: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) samp samp { +:where(body) :where(samp) :where(samp) { font-style: var(--bfont-boldcode-style); font-variant: var(--bfont-boldcode-variant); font-weight: var(--bfont-boldcode-weight); @@ -811,7 +649,7 @@ line-height: var(--bfont-boldcode-height); font-family: var(--bfont-boldcode-family); } -:where(body) var { +:where(body) :where(var) { font-style: var(--bfont-variable-style); font-variant: var(--bfont-variable-variant); font-weight: var(--bfont-variable-weight); @@ -819,7 +657,7 @@ line-height: var(--bfont-variable-height); font-family: var(--bfont-variable-family); } -:where(body) cite { +:where(body) :where(cite) { font-style: var(--bfont-citation-style); font-variant: var(--bfont-citation-variant); font-weight: var(--bfont-citation-weight); @@ -827,7 +665,7 @@ line-height: var(--bfont-citation-height); font-family: var(--bfont-citation-family); } -:where(body) dfn { +:where(body) :where(dfn) { font-style: var(--bfont-term-style); font-variant: var(--bfont-term-variant); font-weight: var(--bfont-term-weight); @@ -838,6 +676,6 @@ --bhsl-current-saturation: var(--bhsl-primary-saturation); --bhsl-current-lightness: var(--bhsl-primary-lightness); } -:where(body) abbr { +:where(body) :where(abbr) { cursor: help; } diff --git a/dist/base.root.min.css b/dist/base.root.min.css new file mode 100644 index 0000000..12a3665 --- /dev/null +++ b/dist/base.root.min.css @@ -0,0 +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){margin:1rem 0;text-align:center;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 diff --git a/dist/classic.module.css b/dist/classic.module.css index 8c66b38..d02e7f6 100644 --- a/dist/classic.module.css +++ b/dist/classic.module.css @@ -7,157 +7,122 @@ --b-outer-shadow: 2px 2px 4px hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } :where(.bluelib), -:where(.bluelib) * { +:where(.bluelib) :where(*) { border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.15); } -:where(.bluelib) .header-1, -:where(.bluelib) .header-2, -:where(.bluelib) .header-3, -:where(.bluelib) .header-4, -:where(.bluelib) .header-5, -:where(.bluelib) .header-6 { +:where(.bluelib) :where(h1, h2, h3, h4, h5, h6) { text-shadow: var(--b-outer-shadow); } -:where(.bluelib) .panel .header-1, -:where(.bluelib) .panel .header-2, -:where(.bluelib) .panel .header-3, -:where(.bluelib) .panel .header-4, -:where(.bluelib) .panel .header-5, -:where(.bluelib) .panel .header-6 { +:where(.bluelib) :where(.panel) :where(h1, h2, h3, h4, h5, h6) { text-shadow: none; } -:where(.bluelib) .panel, -:where(.bluelib) .table.panel > .table-caption { +:where(.bluelib) :where(.panel), +:where(.bluelib) :where(.table):where(.panel) > :where(.table-caption) { border-radius: var(--b-border-radius); box-shadow: var(--b-outer-shadow); } -:where(.bluelib) .panel .panel, -:where(.bluelib) .table.panel > .table-caption .panel { +: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) / 0.075); backdrop-filter: none; box-shadow: none; } -:where(.bluelib) .modifier-mark, -:where(.bluelib) .element-mark, -:where(.bluelib) .panel.modifier-mark { +: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)); } -:where(.bluelib) .modifier-mark .modifier-mark, -:where(.bluelib) .element-mark .modifier-mark, -:where(.bluelib) .panel.modifier-mark .modifier-mark, -:where(.bluelib) .modifier-mark .element-mark, -:where(.bluelib) .element-mark .element-mark, -:where(.bluelib) .panel.modifier-mark .element-mark, -:where(.bluelib) .modifier-mark .panel.modifier-mark, -:where(.bluelib) .element-mark .panel.modifier-mark, -:where(.bluelib) .panel.modifier-mark .panel.modifier-mark { +:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark), +:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark), +:where(.bluelib) :where(.modifier-mark) :where(.panel):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) .modifier-mark .modifier-mark .modifier-mark, -:where(.bluelib) .element-mark .modifier-mark .modifier-mark, -:where(.bluelib) .panel.modifier-mark .modifier-mark .modifier-mark, -:where(.bluelib) .modifier-mark .element-mark .modifier-mark, -:where(.bluelib) .element-mark .element-mark .modifier-mark, -:where(.bluelib) .panel.modifier-mark .element-mark .modifier-mark, -:where(.bluelib) .modifier-mark .panel.modifier-mark .modifier-mark, -:where(.bluelib) .element-mark .panel.modifier-mark .modifier-mark, -:where(.bluelib) .panel.modifier-mark .panel.modifier-mark .modifier-mark, -:where(.bluelib) .modifier-mark .modifier-mark .element-mark, -:where(.bluelib) .element-mark .modifier-mark .element-mark, -:where(.bluelib) .panel.modifier-mark .modifier-mark .element-mark, -:where(.bluelib) .modifier-mark .element-mark .element-mark, -:where(.bluelib) .element-mark .element-mark .element-mark, -:where(.bluelib) .panel.modifier-mark .element-mark .element-mark, -:where(.bluelib) .modifier-mark .panel.modifier-mark .element-mark, -:where(.bluelib) .element-mark .panel.modifier-mark .element-mark, -:where(.bluelib) .panel.modifier-mark .panel.modifier-mark .element-mark, -:where(.bluelib) .modifier-mark .modifier-mark .panel.modifier-mark, -:where(.bluelib) .element-mark .modifier-mark .panel.modifier-mark, -:where(.bluelib) .panel.modifier-mark .modifier-mark .panel.modifier-mark, -:where(.bluelib) .modifier-mark .element-mark .panel.modifier-mark, -:where(.bluelib) .element-mark .element-mark .panel.modifier-mark, -:where(.bluelib) .panel.modifier-mark .element-mark .panel.modifier-mark, -:where(.bluelib) .modifier-mark .panel.modifier-mark .panel.modifier-mark, -:where(.bluelib) .element-mark .panel.modifier-mark .panel.modifier-mark, -:where(.bluelib) .panel.modifier-mark .panel.modifier-mark .panel.modifier-mark { +:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark), +:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark), +:where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark), +:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark), +:where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark), +:where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.panel):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(.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) .modifier-todo, -:where(.bluelib) .panel.modifier-todo { +: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)); border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(.bluelib) .modifier-todo .panel, -:where(.bluelib) .panel.modifier-todo .panel { +: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)); border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(.bluelib) .table.panel { +:where(.bluelib) :where(.table):where(.panel) { border-radius: 0; } -:where(.bluelib) .table.panel > .table-caption { +:where(.bluelib) :where(.table):where(.panel) > :where(.table-caption) { border-radius: 0; box-shadow: var(--b-outer-shadow); } -:where(.bluelib) .table.panel-dialog > .table-caption { +:where(.bluelib) :where(.table):where(.panel-dialog) > :where(.table-caption) { border-bottom-width: 2px; } -:where(.bluelib) .input { +:where(.bluelib) :where(.input) { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.025); } -:where(.bluelib) .input:hover { +:where(.bluelib) :where(.input):hover { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.05); } -:where(.bluelib) .input:active { +:where(.bluelib) :where(.input):active { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.075); } -:where(.bluelib) .input-field, -:where(.bluelib) .input-select { +:where(.bluelib) :where(.input-field), +:where(.bluelib) :where(.input-select) { border-radius: var(--b-border-radius) var(--b-border-radius) 0 0; } -:where(.bluelib) .input-area, -:where(.bluelib) .input-multiselect { +:where(.bluelib) :where(.input-area), +:where(.bluelib) :where(.input-multiselect) { border-radius: 0 var(--b-border-radius) var(--b-border-radius) 0; } -:where(.bluelib) .input-button { +:where(.bluelib) :where(.input-button) { border-radius: var(--b-border-radius); } -:where(.bluelib) .list-unordered > *::marker, -:where(.bluelib) .list-ordered > *::marker { +:where(.bluelib) :where(.list-unordered) > *::marker, +:where(.bluelib) :where(.list-ordered) > *::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.5); } -:where(.bluelib) .glossary-summary { +:where(.bluelib) :where(.glossary-summary) { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(.bluelib) .glossary-summary::marker { +:where(.bluelib) :where(.glossary-summary)::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.5); } -:where(.bluelib) .glossary-summary:hover { +:where(.bluelib) :where(.glossary-summary):hover { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(.bluelib) .glossary-summary:hover::marker { +:where(.bluelib) :where(.glossary-summary):hover::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(.bluelib) .glossary-summary:active::marker { +:where(.bluelib) :where(.glossary-summary):active::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(.bluelib) .text-anchor:hover { +:where(.bluelib) :where(.text-anchor):hover { color: hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0%) calc(var(--bhsl-link-lightness) + 20%) / 1); } -:where(.bluelib) .text-anchor:active { +:where(.bluelib) :where(.text-anchor):active { color: hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0%) calc(var(--bhsl-link-lightness) + 40%) / 1); } -:where(.bluelib) .text-input, -:where(.bluelib) .text-output { +:where(.bluelib) :where(.text-input), +:where(.bluelib) :where(.text-output) { border-radius: calc(var(--b-border-radius) / 4); } -:where(.bluelib) .text-variable { +:where(.bluelib) :where(.text-variable) { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(.bluelib) .text-quote::before, -:where(.bluelib) .text-quote::after { +:where(.bluelib) :where(.text-quote)::before, +:where(.bluelib) :where(.text-quote)::after { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(.bluelib) .text-ruby-annotation { +:where(.bluelib) :where(.text-ruby-annotation) { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } diff --git a/dist/classic.module.min.css b/dist/classic.module.min.css new file mode 100644 index 0000000..560bf15 --- /dev/null +++ b/dist/classic.module.min.css @@ -0,0 +1 @@ +:where(.bluelib){--b-border-radius:8px;--b-outer-shadow:2px 2px 4px hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(.bluelib),:where(.bluelib) :where(*){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .15)}:where(.bluelib) :where(h1,h2,h3,h4,h5,h6){text-shadow:var(--b-outer-shadow)}:where(.bluelib) :where(.panel) :where(h1,h2,h3,h4,h5,h6){text-shadow:none}:where(.bluelib) :where(.panel),:where(.bluelib) :where(.table):where(.panel)>:where(.table-caption){border-radius:var(--b-border-radius);box-shadow:var(--b-outer-shadow)}: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) / .075);backdrop-filter:none;box-shadow: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))}: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));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-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));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(.bluelib) :where(.table):where(.panel){border-radius:0}:where(.bluelib) :where(.table):where(.panel)>:where(.table-caption){border-radius:0;box-shadow:var(--b-outer-shadow)}:where(.bluelib) :where(.table):where(.panel-dialog)>:where(.table-caption){border-bottom-width:2px}:where(.bluelib) :where(.input){background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .025)}:where(.bluelib) :where(.input):hover{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .05)}:where(.bluelib) :where(.input):active{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .075)}:where(.bluelib) :where(.input-field),:where(.bluelib) :where(.input-select){border-radius:var(--b-border-radius) var(--b-border-radius) 0 0}:where(.bluelib) :where(.input-area),:where(.bluelib) :where(.input-multiselect){border-radius:0 var(--b-border-radius) var(--b-border-radius) 0}:where(.bluelib) :where(.input-button){border-radius:var(--b-border-radius)}:where(.bluelib) :where(.list-ordered)>::marker,:where(.bluelib) :where(.list-unordered)>::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .5)}:where(.bluelib) :where(.glossary-summary){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.glossary-summary)::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .5)}:where(.bluelib) :where(.glossary-summary):hover{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(.bluelib) :where(.glossary-summary):hover::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.glossary-summary):active::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(.bluelib) :where(.text-anchor):hover{color:hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0) calc(var(--bhsl-link-lightness) + 20%)/ 1)}:where(.bluelib) :where(.text-anchor):active{color:hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0) calc(var(--bhsl-link-lightness) + 40%)/ 1)}:where(.bluelib) :where(.text-input),:where(.bluelib) :where(.text-output){border-radius:calc(var(--b-border-radius)/ 4)}:where(.bluelib) :where(.text-variable){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.text-quote)::after,:where(.bluelib) :where(.text-quote)::before{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(.bluelib) :where(.text-ruby-annotation){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)} \ No newline at end of file diff --git a/dist/classic.root.css b/dist/classic.root.css index 76ddc58..1e27552 100644 --- a/dist/classic.root.css +++ b/dist/classic.root.css @@ -7,175 +7,122 @@ --b-outer-shadow: 2px 2px 4px hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } :where(body), -:where(body) * { +:where(body) :where(*) { border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.15); } -:where(body) h1, -:where(body) h2, -:where(body) h3, -:where(body) h4, -:where(body) h5, -:where(body) h6 { +:where(body) :where(h1, h2, h3, h4, h5, h6) { text-shadow: var(--b-outer-shadow); } -:where(body) .panel h1, -:where(body) .panel h2, -:where(body) .panel h3, -:where(body) .panel h4, -:where(body) .panel h5, -:where(body) .panel h6 { +:where(body) :where(.panel) :where(h1, h2, h3, h4, h5, h6) { text-shadow: none; } -:where(body) .panel, -:where(body) table.panel > caption { +:where(body) :where(.panel), +:where(body) :where(table):where(.panel) > :where(caption) { border-radius: var(--b-border-radius); box-shadow: var(--b-outer-shadow); } -:where(body) .panel .panel, -:where(body) table.panel > caption .panel { +: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) / 0.075); backdrop-filter: none; box-shadow: none; } -:where(body) .mark, -:where(body) mark, -:where(body) .panel.mark { +:where(body) :where(mark, .mark), +:where(body) :where(.panel):where(mark, .mark) { background-color: hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness)); } -:where(body) .mark .mark, -:where(body) mark .mark, -:where(body) .panel.mark .mark, -:where(body) .mark mark, -:where(body) mark mark, -:where(body) .panel.mark mark, -:where(body) .mark .panel.mark, -:where(body) mark .panel.mark, -:where(body) .panel.mark .panel.mark { +:where(body) :where(mark, .mark) :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(.panel):where(mark, .mark) :where(.panel):where(mark, .mark) { background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } -:where(body) .mark .mark .mark, -:where(body) mark .mark .mark, -:where(body) .panel.mark .mark .mark, -:where(body) .mark mark .mark, -:where(body) mark mark .mark, -:where(body) .panel.mark mark .mark, -:where(body) .mark .panel.mark .mark, -:where(body) mark .panel.mark .mark, -:where(body) .panel.mark .panel.mark .mark, -:where(body) .mark .mark mark, -:where(body) mark .mark mark, -:where(body) .panel.mark .mark mark, -:where(body) .mark mark mark, -:where(body) mark mark mark, -:where(body) .panel.mark mark mark, -:where(body) .mark .panel.mark mark, -:where(body) mark .panel.mark mark, -:where(body) .panel.mark .panel.mark mark, -:where(body) .mark .mark .panel.mark, -:where(body) mark .mark .panel.mark, -:where(body) .panel.mark .mark .panel.mark, -:where(body) .mark mark .panel.mark, -:where(body) mark mark .panel.mark, -:where(body) .panel.mark mark .panel.mark, -:where(body) .mark .panel.mark .panel.mark, -:where(body) mark .panel.mark .panel.mark, -:where(body) .panel.mark .panel.mark .panel.mark { +:where(body) :where(mark, .mark) :where(mark, .mark) :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(mark, .mark), +:where(body) :where(.panel):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(.panel):where(mark, .mark) :where(mark, .mark) :where(.panel):where(mark, .mark), +:where(body) :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(.panel):where(mark, .mark) { background-color: hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness)); } -:where(body) .todo, -:where(body) .panel.todo { +:where(body) :where(.todo), +:where(body) :where(.panel):where(.todo) { background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(body) .todo .panel, -:where(body) .panel.todo .panel { +:where(body) :where(.todo) :where(.panel), +:where(body) :where(.panel):where(.todo) :where(.panel) { background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(body) table.panel { +:where(body) :where(table):where(.panel) { border-radius: 0; } -:where(body) table.panel > caption { +:where(body) :where(table):where(.panel) > :where(caption) { border-radius: 0; box-shadow: var(--b-outer-shadow); } -:where(body) table.dialog > caption { +:where(body) :where(table):where(.dialog) > :where(caption) { border-bottom-width: 2px; } -:where(body) input, -:where(body) textarea, -:where(body) select, -:where(body) button { +:where(body) :where(input, textarea, select, button) { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.025); } -:where(body) input:hover, -:where(body) textarea:hover, -:where(body) select:hover, -:where(body) button:hover { +:where(body) :where(input, textarea, select, button):hover { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.05); } -:where(body) input:active, -:where(body) textarea:active, -:where(body) select:active, -:where(body) button:active { +:where(body) :where(input, textarea, select, button):active { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.075); } -:where(body) input[type="text"], -:where(body) input[type="password"], -:where(body) input[type="email"], -:where(body) input[type="number"], -:where(body) input[type="search"], -:where(body) input[type="tel"], -:where(body) input[type="datetime-local"], -:where(body) input[type="date"], -:where(body) input[type="time"], -:where(body) select:not([multiple]) { +: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-radius: var(--b-border-radius) var(--b-border-radius) 0 0; } -:where(body) textarea, -:where(body) select[multiple] { +:where(body) :where(textarea), +:where(body) :where(select[multiple]) { border-radius: 0 var(--b-border-radius) var(--b-border-radius) 0; } -:where(body) input[type="button"], -:where(body) button { +:where(body) :where(input[type="button"], button) { border-radius: var(--b-border-radius); } -:where(body) ul > *::marker, -:where(body) ol > *::marker { +:where(body) :where(ul) > *::marker, +:where(body) :where(ol) > *::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.5); } -:where(body) summary { +:where(body) :where(summary) { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(body) summary::marker { +:where(body) :where(summary)::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.5); } -:where(body) summary:hover { +:where(body) :where(summary):hover { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(body) summary:hover::marker { +:where(body) :where(summary):hover::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(body) summary:active::marker { +:where(body) :where(summary):active::marker { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness)); } -:where(body) a:hover { +:where(body) :where(a):hover { color: hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0%) calc(var(--bhsl-link-lightness) + 20%) / 1); } -:where(body) a:active { +:where(body) :where(a):active { color: hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0%) calc(var(--bhsl-link-lightness) + 40%) / 1); } -:where(body) kbd, -:where(body) samp { +:where(body) :where(kbd), +:where(body) :where(samp) { border-radius: calc(var(--b-border-radius) / 4); } -:where(body) var { +:where(body) :where(var) { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(body) q::before, -:where(body) q::after { +:where(body) :where(q)::before, +:where(body) :where(q)::after { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } -:where(body) rt { +:where(body) :where(rt) { color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / 0.7); } diff --git a/dist/classic.root.min.css b/dist/classic.root.min.css new file mode 100644 index 0000000..6f8c97c --- /dev/null +++ b/dist/classic.root.min.css @@ -0,0 +1 @@ +:where(body){--b-border-radius:8px;--b-outer-shadow:2px 2px 4px hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness))}:where(body),:where(body) :where(*){border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .15)}:where(body) :where(h1,h2,h3,h4,h5,h6){text-shadow:var(--b-outer-shadow)}:where(body) :where(.panel) :where(h1,h2,h3,h4,h5,h6){text-shadow:none}:where(body) :where(.panel),:where(body) :where(table):where(.panel)>:where(caption){border-radius:var(--b-border-radius);box-shadow:var(--b-outer-shadow)}: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) / .075);backdrop-filter:none;box-shadow: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))}: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));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-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));border-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(body) :where(table):where(.panel){border-radius:0}:where(body) :where(table):where(.panel)>:where(caption){border-radius:0;box-shadow:var(--b-outer-shadow)}:where(body) :where(table):where(.dialog)>:where(caption){border-bottom-width:2px}:where(body) :where(input,textarea,select,button){background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .025)}:where(body) :where(input,textarea,select,button):hover{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .05)}:where(body) :where(input,textarea,select,button):active{background-color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .075)}: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-radius:var(--b-border-radius) var(--b-border-radius) 0 0}:where(body) :where(select[multiple]),:where(body) :where(textarea){border-radius:0 var(--b-border-radius) var(--b-border-radius) 0}:where(body) :where(input[type=button],button){border-radius:var(--b-border-radius)}:where(body) :where(ol)>::marker,:where(body) :where(ul)>::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .5)}:where(body) :where(summary){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(summary)::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .5)}:where(body) :where(summary):hover{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(body) :where(summary):hover::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(summary):active::marker{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness))}:where(body) :where(a):hover{color:hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0) calc(var(--bhsl-link-lightness) + 20%)/ 1)}:where(body) :where(a):active{color:hsl(calc(var(--bhsl-link-hue) + 0deg) calc(var(--bhsl-link-saturation) + 0) calc(var(--bhsl-link-lightness) + 40%)/ 1)}:where(body) :where(kbd),:where(body) :where(samp){border-radius:calc(var(--b-border-radius)/ 4)}:where(body) :where(var){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(q)::after,:where(body) :where(q)::before{color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)}:where(body) :where(rt){color:hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .7)} \ No newline at end of file diff --git a/dist/colors-amber.module.min.css b/dist/colors-amber.module.min.css new file mode 100644 index 0000000..e105029 --- /dev/null +++ b/dist/colors-amber.module.min.css @@ -0,0 +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 diff --git a/dist/colors-amber.root.min.css b/dist/colors-amber.root.min.css new file mode 100644 index 0000000..4716ad4 --- /dev/null +++ b/dist/colors-amber.root.min.css @@ -0,0 +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 diff --git a/dist/colors-pixeldawn.module.css b/dist/colors-pixeldawn.module.css index c07663c..acbe4dd 100644 --- a/dist/colors-pixeldawn.module.css +++ b/dist/colors-pixeldawn.module.css @@ -75,21 +75,21 @@ --b-border-radius: 0; --b-outer-shadow: none; } -:where(.bluelib):is(:where(.bluelib)) .header-1, -:where(.bluelib):is(:where(.bluelib)) .header-2, -:where(.bluelib):is(:where(.bluelib)) .header-3, -:where(.bluelib):is(:where(.bluelib)) .header-4, -:where(.bluelib):is(:where(.bluelib)) .header-5, -:where(.bluelib):is(:where(.bluelib)) .header-6 { +: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)) .panel .header-1, -:where(.bluelib):is(:where(.bluelib)) .panel .header-2, -:where(.bluelib):is(:where(.bluelib)) .panel .header-3, -:where(.bluelib):is(:where(.bluelib)) .panel .header-4, -:where(.bluelib):is(:where(.bluelib)) .panel .header-5, -:where(.bluelib):is(:where(.bluelib)) .panel .header-6 { +: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.min.css b/dist/colors-pixeldawn.module.min.css new file mode 100644 index 0000000..2750b38 --- /dev/null +++ b/dist/colors-pixeldawn.module.min.css @@ -0,0 +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 diff --git a/dist/colors-pixeldawn.root.css b/dist/colors-pixeldawn.root.css index f0d5416..8c083dc 100644 --- a/dist/colors-pixeldawn.root.css +++ b/dist/colors-pixeldawn.root.css @@ -75,21 +75,21 @@ --b-border-radius: 0; --b-outer-shadow: none; } -:where(body):is(:where(body)) h1, -:where(body):is(:where(body)) h2, -:where(body):is(:where(body)) h3, -:where(body):is(:where(body)) h4, -:where(body):is(:where(body)) h5, -:where(body):is(:where(body)) h6 { +: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)) .panel h1, -:where(body):is(:where(body)) .panel h2, -:where(body):is(:where(body)) .panel h3, -:where(body):is(:where(body)) .panel h4, -:where(body):is(:where(body)) .panel h5, -:where(body):is(:where(body)) .panel h6 { +: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.min.css b/dist/colors-pixeldawn.root.min.css new file mode 100644 index 0000000..17ad736 --- /dev/null +++ b/dist/colors-pixeldawn.root.min.css @@ -0,0 +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 diff --git a/dist/colors-purplestar.module.min.css b/dist/colors-purplestar.module.min.css new file mode 100644 index 0000000..79ec03f --- /dev/null +++ b/dist/colors-purplestar.module.min.css @@ -0,0 +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 diff --git a/dist/colors-purplestar.root.min.css b/dist/colors-purplestar.root.min.css new file mode 100644 index 0000000..d5ba9ac --- /dev/null +++ b/dist/colors-purplestar.root.min.css @@ -0,0 +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 diff --git a/dist/colors-royalblue.module.min.css b/dist/colors-royalblue.module.min.css new file mode 100644 index 0000000..938f52e --- /dev/null +++ b/dist/colors-royalblue.module.min.css @@ -0,0 +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 diff --git a/dist/colors-royalblue.root.min.css b/dist/colors-royalblue.root.min.css new file mode 100644 index 0000000..3da4d71 --- /dev/null +++ b/dist/colors-royalblue.root.min.css @@ -0,0 +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 diff --git a/dist/fonts-fira-ghpages.module.min.css b/dist/fonts-fira-ghpages.module.min.css new file mode 100644 index 0000000..db21e41 --- /dev/null +++ b/dist/fonts-fira-ghpages.module.min.css @@ -0,0 +1 @@ +@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Hair.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Hair.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Hair.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Hair.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Hair.ttf) format('truetype');font-weight:100;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-HairItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-HairItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-HairItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-HairItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-HairItalic.ttf) format('truetype');font-weight:100;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLight.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLight.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-UltraLight.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-UltraLight.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-UltraLight.ttf) format('truetype');font-weight:200;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLightItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLightItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-UltraLightItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-UltraLightItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-UltraLightItalic.ttf) format('truetype');font-weight:200;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Light.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Light.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Light.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Light.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Light.ttf) format('truetype');font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-LightItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-LightItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-LightItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-LightItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-LightItalic.ttf) format('truetype');font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Regular.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Regular.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Regular.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Regular.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Regular.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Italic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Italic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Italic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Italic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Italic.ttf) format('truetype');font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Medium.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Medium.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Medium.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Medium.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Medium.ttf) format('truetype');font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-MediumItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-MediumItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-MediumItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-MediumItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-MediumItalic.ttf) format('truetype');font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-SemiBold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-SemiBold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-SemiBold.ttf) format('truetype');font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBoldItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBoldItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-SemiBoldItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-SemiBoldItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-SemiBoldItalic.ttf) format('truetype');font-weight:600;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Bold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Bold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Bold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Bold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Bold.ttf) format('truetype');font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-BoldItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-BoldItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-BoldItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-BoldItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-BoldItalic.ttf) format('truetype');font-weight:700;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-ExtraBold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-ExtraBold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-ExtraBold.ttf) format('truetype');font-weight:800;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBoldItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBoldItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-ExtraBoldItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-ExtraBoldItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-ExtraBoldItalic.ttf) format('truetype');font-weight:800;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Heavy.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Heavy.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Heavy.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Heavy.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Heavy.ttf) format('truetype');font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-HeavyItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-HeavyItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-HeavyItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-HeavyItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-HeavyItalic.ttf) format('truetype');font-weight:900;font-style:italic;font-display:swap}@font-face{font-family:'Fira Mono';src:url(https://mozilla.github.io/Fira/eot/FiraMono-Regular.eot);src:url(https://mozilla.github.io/Fira/eot/FiraMono-Regular.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraMono-Regular.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraMono-Regular.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraMono-Regular.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Fira Mono';src:url(https://mozilla.github.io/Fira/eot/FiraMono-Bold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraMono-Bold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraMono-Bold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraMono-Bold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraMono-Bold.ttf) format('truetype');font-weight:600;font-style:normal;font-display:swap}:where(.bluelib){--bfont-text-style:normal;--bfont-text-variant:normal;--bfont-text-weight:400;--bfont-text-stretch:normal;--bfont-text-height:1.3;--bfont-text-family:"Fira Sans",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:"Fira Sans",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:"Fira Mono",monospace;--bfont-boldcode-style:normal;--bfont-boldcode-variant:normal;--bfont-boldcode-weight:600;--bfont-boldcode-stretch:normal;--bfont-boldcode-height:1.3;--bfont-boldcode-family:"Fira Mono",monospace;--bfont-term-style:italic;--bfont-term-variant:normal;--bfont-term-weight:500;--bfont-term-stretch:normal;--bfont-term-height:1.3;--bfont-term-family:"Fira Sans",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:"Fira Sans",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:"Fira Sans",sans-serif;--bfont-emphasis-style:italic;--bfont-emphasis-variant:normal;--bfont-emphasis-weight:500;--bfont-emphasis-stretch:normal;--bfont-emphasis-height:1.3;--bfont-emphasis-family:"Fira Sans",sans-serif;--bfont-attention-style:normal;--bfont-attention-variant:normal;--bfont-attention-weight:600;--bfont-attention-stretch:normal;--bfont-attention-height:1.3;--bfont-attention-family:"Fira Sans",sans-serif;--bfont-strong-style:normal;--bfont-strong-variant:normal;--bfont-strong-weight:900;--bfont-strong-stretch:normal;--bfont-strong-height:1.3;--bfont-strong-family:"Fira Sans",sans-serif;--bfont-variable-style:normal;--bfont-variable-variant:normal;--bfont-variable-weight:300;--bfont-variable-stretch:normal;--bfont-variable-height:1.3;--bfont-variable-family:"Fira Sans",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:"Fira Sans",sans-serif;--bfont-label-style:normal;--bfont-label-variant:normal;--bfont-label-weight:500;--bfont-label-stretch:normal;--bfont-label-height:1.3;--bfont-label-family:"Fira Sans",sans-serif} \ No newline at end of file diff --git a/dist/fonts-fira-ghpages.root.min.css b/dist/fonts-fira-ghpages.root.min.css new file mode 100644 index 0000000..6ac7850 --- /dev/null +++ b/dist/fonts-fira-ghpages.root.min.css @@ -0,0 +1 @@ +@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Hair.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Hair.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Hair.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Hair.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Hair.ttf) format('truetype');font-weight:100;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-HairItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-HairItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-HairItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-HairItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-HairItalic.ttf) format('truetype');font-weight:100;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLight.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLight.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-UltraLight.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-UltraLight.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-UltraLight.ttf) format('truetype');font-weight:200;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLightItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-UltraLightItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-UltraLightItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-UltraLightItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-UltraLightItalic.ttf) format('truetype');font-weight:200;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Light.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Light.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Light.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Light.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Light.ttf) format('truetype');font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-LightItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-LightItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-LightItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-LightItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-LightItalic.ttf) format('truetype');font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Regular.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Regular.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Regular.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Regular.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Regular.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Italic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Italic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Italic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Italic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Italic.ttf) format('truetype');font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Medium.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Medium.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Medium.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Medium.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Medium.ttf) format('truetype');font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-MediumItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-MediumItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-MediumItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-MediumItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-MediumItalic.ttf) format('truetype');font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-SemiBold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-SemiBold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-SemiBold.ttf) format('truetype');font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBoldItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-SemiBoldItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-SemiBoldItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-SemiBoldItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-SemiBoldItalic.ttf) format('truetype');font-weight:600;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Bold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Bold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Bold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Bold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Bold.ttf) format('truetype');font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-BoldItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-BoldItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-BoldItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-BoldItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-BoldItalic.ttf) format('truetype');font-weight:700;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-ExtraBold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-ExtraBold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-ExtraBold.ttf) format('truetype');font-weight:800;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBoldItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-ExtraBoldItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-ExtraBoldItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-ExtraBoldItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-ExtraBoldItalic.ttf) format('truetype');font-weight:800;font-style:italic;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-Heavy.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-Heavy.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-Heavy.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-Heavy.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-Heavy.ttf) format('truetype');font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:'Fira Sans';src:url(https://mozilla.github.io/Fira/eot/FiraSans-HeavyItalic.eot);src:url(https://mozilla.github.io/Fira/eot/FiraSans-HeavyItalic.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraSans-HeavyItalic.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraSans-HeavyItalic.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraSans-HeavyItalic.ttf) format('truetype');font-weight:900;font-style:italic;font-display:swap}@font-face{font-family:'Fira Mono';src:url(https://mozilla.github.io/Fira/eot/FiraMono-Regular.eot);src:url(https://mozilla.github.io/Fira/eot/FiraMono-Regular.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraMono-Regular.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraMono-Regular.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraMono-Regular.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Fira Mono';src:url(https://mozilla.github.io/Fira/eot/FiraMono-Bold.eot);src:url(https://mozilla.github.io/Fira/eot/FiraMono-Bold.eot) format('embedded-opentype'),url(https://mozilla.github.io/Fira/woff2/FiraMono-Bold.woff2) format('woff2'),url(https://mozilla.github.io/Fira/woff/FiraMono-Bold.woff) format('woff'),url(https://mozilla.github.io/Fira/ttf/FiraMono-Bold.ttf) format('truetype');font-weight:600;font-style:normal;font-display:swap}:where(body){--bfont-text-style:normal;--bfont-text-variant:normal;--bfont-text-weight:400;--bfont-text-stretch:normal;--bfont-text-height:1.3;--bfont-text-family:"Fira Sans",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:"Fira Sans",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:"Fira Mono",monospace;--bfont-boldcode-style:normal;--bfont-boldcode-variant:normal;--bfont-boldcode-weight:600;--bfont-boldcode-stretch:normal;--bfont-boldcode-height:1.3;--bfont-boldcode-family:"Fira Mono",monospace;--bfont-term-style:italic;--bfont-term-variant:normal;--bfont-term-weight:500;--bfont-term-stretch:normal;--bfont-term-height:1.3;--bfont-term-family:"Fira Sans",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:"Fira Sans",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:"Fira Sans",sans-serif;--bfont-emphasis-style:italic;--bfont-emphasis-variant:normal;--bfont-emphasis-weight:500;--bfont-emphasis-stretch:normal;--bfont-emphasis-height:1.3;--bfont-emphasis-family:"Fira Sans",sans-serif;--bfont-attention-style:normal;--bfont-attention-variant:normal;--bfont-attention-weight:600;--bfont-attention-stretch:normal;--bfont-attention-height:1.3;--bfont-attention-family:"Fira Sans",sans-serif;--bfont-strong-style:normal;--bfont-strong-variant:normal;--bfont-strong-weight:900;--bfont-strong-stretch:normal;--bfont-strong-height:1.3;--bfont-strong-family:"Fira Sans",sans-serif;--bfont-variable-style:normal;--bfont-variable-variant:normal;--bfont-variable-weight:300;--bfont-variable-stretch:normal;--bfont-variable-height:1.3;--bfont-variable-family:"Fira Sans",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:"Fira Sans",sans-serif;--bfont-label-style:normal;--bfont-label-variant:normal;--bfont-label-weight:500;--bfont-label-stretch:normal;--bfont-label-height:1.3;--bfont-label-family:"Fira Sans",sans-serif} \ No newline at end of file diff --git a/dist/fun.module.css b/dist/fun.module.css index 4c76935..05ae6ba 100644 --- a/dist/fun.module.css +++ b/dist/fun.module.css @@ -15,6 +15,6 @@ --bhsl-current-hue: 360deg; } } -.animation-rainbow { +:where(.animation-rainbow) { animation: 2s linear infinite rainbow; } diff --git a/dist/fun.module.min.css b/dist/fun.module.min.css new file mode 100644 index 0000000..aea4d84 --- /dev/null +++ b/dist/fun.module.min.css @@ -0,0 +1 @@ +@keyframes rainbow{0%{--bhsl-current-hue:0deg}100%{--bhsl-current-hue:360deg}}:where(.animation-rainbow){animation:2s linear infinite rainbow} \ No newline at end of file diff --git a/dist/fun.root.css b/dist/fun.root.css index b53b4d9..b9bbc9a 100644 --- a/dist/fun.root.css +++ b/dist/fun.root.css @@ -15,6 +15,6 @@ --bhsl-current-hue: 360deg; } } -.rainbow { +:where(.rainbow) { animation: 2s linear infinite rainbow; } diff --git a/dist/fun.root.min.css b/dist/fun.root.min.css new file mode 100644 index 0000000..7d9482b --- /dev/null +++ b/dist/fun.root.min.css @@ -0,0 +1 @@ +@keyframes rainbow{0%{--bhsl-current-hue:0deg}100%{--bhsl-current-hue:360deg}}:where(.rainbow){animation:2s linear infinite rainbow} \ No newline at end of file diff --git a/dist/glass.module.css b/dist/glass.module.css index e4f7cea..1844ff8 100644 --- a/dist/glass.module.css +++ b/dist/glass.module.css @@ -8,76 +8,51 @@ --b-panel-nested-opacity: 0.075; } @supports (backdrop-filter: blur(var(--b-panel-blur))) { - :where(.bluelib) .panel, - :where(.bluelib) .table.panel > .table-caption { + :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) .panel .panel, - :where(.bluelib) .table.panel > .table-caption .panel { + :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) .modifier-mark, - :where(.bluelib) .element-mark, - :where(.bluelib) .panel.modifier-mark { + :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) .modifier-mark .modifier-mark, - :where(.bluelib) .element-mark .modifier-mark, - :where(.bluelib) .panel.modifier-mark .modifier-mark, - :where(.bluelib) .modifier-mark .element-mark, - :where(.bluelib) .element-mark .element-mark, - :where(.bluelib) .panel.modifier-mark .element-mark, - :where(.bluelib) .modifier-mark .panel.modifier-mark, - :where(.bluelib) .element-mark .panel.modifier-mark, - :where(.bluelib) .panel.modifier-mark .panel.modifier-mark { + :where(.bluelib) :where(.modifier-mark) :where(.modifier-mark), + :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark), + :where(.bluelib) :where(.modifier-mark) :where(.panel):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) .modifier-mark .modifier-mark .modifier-mark, - :where(.bluelib) .element-mark .modifier-mark .modifier-mark, - :where(.bluelib) .panel.modifier-mark .modifier-mark .modifier-mark, - :where(.bluelib) .modifier-mark .element-mark .modifier-mark, - :where(.bluelib) .element-mark .element-mark .modifier-mark, - :where(.bluelib) .panel.modifier-mark .element-mark .modifier-mark, - :where(.bluelib) .modifier-mark .panel.modifier-mark .modifier-mark, - :where(.bluelib) .element-mark .panel.modifier-mark .modifier-mark, - :where(.bluelib) .panel.modifier-mark .panel.modifier-mark .modifier-mark, - :where(.bluelib) .modifier-mark .modifier-mark .element-mark, - :where(.bluelib) .element-mark .modifier-mark .element-mark, - :where(.bluelib) .panel.modifier-mark .modifier-mark .element-mark, - :where(.bluelib) .modifier-mark .element-mark .element-mark, - :where(.bluelib) .element-mark .element-mark .element-mark, - :where(.bluelib) .panel.modifier-mark .element-mark .element-mark, - :where(.bluelib) .modifier-mark .panel.modifier-mark .element-mark, - :where(.bluelib) .element-mark .panel.modifier-mark .element-mark, - :where(.bluelib) .panel.modifier-mark .panel.modifier-mark .element-mark, - :where(.bluelib) .modifier-mark .modifier-mark .panel.modifier-mark, - :where(.bluelib) .element-mark .modifier-mark .panel.modifier-mark, - :where(.bluelib) .panel.modifier-mark .modifier-mark .panel.modifier-mark, - :where(.bluelib) .modifier-mark .element-mark .panel.modifier-mark, - :where(.bluelib) .element-mark .element-mark .panel.modifier-mark, - :where(.bluelib) .panel.modifier-mark .element-mark .panel.modifier-mark, - :where(.bluelib) .modifier-mark .panel.modifier-mark .panel.modifier-mark, - :where(.bluelib) .element-mark .panel.modifier-mark .panel.modifier-mark, - :where(.bluelib) .panel.modifier-mark .panel.modifier-mark .panel.modifier-mark { + :where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark), + :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark), + :where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark), + :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark), + :where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark), + :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.panel):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(.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) .modifier-todo, - :where(.bluelib) .panel.modifier-todo { + :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) .modifier-todo .panel, - :where(.bluelib) .panel.modifier-todo .panel { + :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) .panel.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) / 0.3); backdrop-filter: blur(var(--b-panel-blur)) grayscale(100%); } - :where(.bluelib) .panel .panel.modifier-todo { + :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.min.css b/dist/glass.module.min.css new file mode 100644 index 0000000..1fff7d8 --- /dev/null +++ b/dist/glass.module.min.css @@ -0,0 +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 diff --git a/dist/glass.root.css b/dist/glass.root.css index fde15ab..7e6e920 100644 --- a/dist/glass.root.css +++ b/dist/glass.root.css @@ -8,76 +8,51 @@ --b-panel-nested-opacity: 0.075; } @supports (backdrop-filter: blur(var(--b-panel-blur))) { - :where(body) .panel, - :where(body) table.panel > caption { + :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) .panel .panel, - :where(body) table.panel > caption .panel { + :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) .mark, - :where(body) mark, - :where(body) .panel.mark { + :where(body) :where(mark, .mark), + :where(body) :where(.panel):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) .mark .mark, - :where(body) mark .mark, - :where(body) .panel.mark .mark, - :where(body) .mark mark, - :where(body) mark mark, - :where(body) .panel.mark mark, - :where(body) .mark .panel.mark, - :where(body) mark .panel.mark, - :where(body) .panel.mark .panel.mark { + :where(body) :where(mark, .mark) :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(.panel):where(mark, .mark) :where(.panel):where(mark, .mark) { background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } - :where(body) .mark .mark .mark, - :where(body) mark .mark .mark, - :where(body) .panel.mark .mark .mark, - :where(body) .mark mark .mark, - :where(body) mark mark .mark, - :where(body) .panel.mark mark .mark, - :where(body) .mark .panel.mark .mark, - :where(body) mark .panel.mark .mark, - :where(body) .panel.mark .panel.mark .mark, - :where(body) .mark .mark mark, - :where(body) mark .mark mark, - :where(body) .panel.mark .mark mark, - :where(body) .mark mark mark, - :where(body) mark mark mark, - :where(body) .panel.mark mark mark, - :where(body) .mark .panel.mark mark, - :where(body) mark .panel.mark mark, - :where(body) .panel.mark .panel.mark mark, - :where(body) .mark .mark .panel.mark, - :where(body) mark .mark .panel.mark, - :where(body) .panel.mark .mark .panel.mark, - :where(body) .mark mark .panel.mark, - :where(body) mark mark .panel.mark, - :where(body) .panel.mark mark .panel.mark, - :where(body) .mark .panel.mark .panel.mark, - :where(body) mark .panel.mark .panel.mark, - :where(body) .panel.mark .panel.mark .panel.mark { + :where(body) :where(mark, .mark) :where(mark, .mark) :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(mark, .mark), + :where(body) :where(.panel):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(.panel):where(mark, .mark) :where(mark, .mark) :where(.panel):where(mark, .mark), + :where(body) :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(.panel):where(mark, .mark) { background-color: hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness)); } - :where(body) .todo, - :where(body) .panel.todo { + :where(body) :where(.todo), + :where(body) :where(.panel):where(.todo) { background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); } - :where(body) .todo .panel, - :where(body) .panel.todo .panel { + :where(body) :where(.todo) :where(.panel), + :where(body) :where(.panel):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) .panel.todo { + :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) .panel .panel.todo { + :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.min.css b/dist/glass.root.min.css new file mode 100644 index 0000000..6c6f304 --- /dev/null +++ b/dist/glass.root.min.css @@ -0,0 +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 diff --git a/examples/index.css b/examples/index.css index 2dd908c..daf1779 100644 --- a/examples/index.css +++ b/examples/index.css @@ -37,27 +37,11 @@ } } -#body .chapter-1 > .panel, -#body .chapter-2 > .panel, -#body .chapter-3 > .panel, -#body .chapter-4 > .panel, -#body .chapter-5 > .panel, -#body .chapter-6 > .panel, -#body .chapter-7 > .panel, -#body .chapter-8 > .panel, -#body .chapter-9 > .panel { +#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 .chapter-1 > .panel, -#body .panel .chapter-2 > .panel, -#body .panel .chapter-3 > .panel, -#body .panel .chapter-4 > .panel, -#body .panel .chapter-5 > .panel, -#body .panel .chapter-6 > .panel, -#body .panel .chapter-7 > .panel, -#body .panel .chapter-8 > .panel, -#body .panel .chapter-9 > .panel { +#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 12d4be4..3f251d9 100644 --- a/examples/index.html +++ b/examples/index.html @@ -222,7 +222,7 @@

- Experimental. A purple-ish theme for Star Shard Studio. + A purple-ish theme for Star Shard Studio.
@@ -270,6 +270,12 @@

<link rel="stylesheet" href="https://unpkg.com/@steffo/bluelib@VERSION/dist/RULESET.SELECTORSET.css" type="text/css"/>
+

+ To save a bit extra bandwidth, at the cost of harder-to-read stylesheets, you can use minified stylesheets, like this: +

+
+ <link rel="stylesheet" href="https://unpkg.com/@steffo/bluelib@VERSION/dist/RULESET.SELECTORSET.min.css" type="text/css"/> +

diff --git a/package.json b/package.json index 7934dfb..6dbe62a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@steffo/bluelib", - "version": "7.2.0", + "version": "8.0.0", "description": "A stylesheet that supports fast dynamic recoloring via CSS variables", "scripts": { "dev": "web-dev-server --watch", @@ -56,6 +56,7 @@ "private": false, "devDependencies": { "@web/dev-server": "^0.1.34", - "less": "^4.1.3" + "less": "^4.1.3", + "less-plugin-clean-css": "^1.5.1" } } diff --git a/src/rulesets/base.less b/src/rulesets/base.less index a6b2105..3faacfb 100644 --- a/src/rulesets/base.less +++ b/src/rulesets/base.less @@ -71,9 +71,12 @@ // + @{page-header}, @{page-footer} { + text-align: center; + } + @{page-footer} { margin: 1rem 0; - text-align: center; font-size: x-small; } @@ -123,7 +126,7 @@ font-size: 1.75em; } - @{header-1}, @{header-2}, @{header-3}, @{header-4}, @{header-5}, @{header-6} { + @{header} { text-align: center; .map-hsl-group(current; primary); @@ -194,33 +197,6 @@ // - @{chapter-0}, @{chapter-1}, @{chapter-2}, @{chapter-3}, @{chapter-4}, @{chapter-5}, @{chapter-6}, @{chapter-7}, @{chapter-8}, @{chapter-9} { - // Be a row flexbox to separate elements in columns - display: flex; - flex-wrap: wrap; - flex-direction: row; - gap: 8px; - justify-content: center; - align-items: stretch; - - // Add the gap as a vertical margin, so that multiple chapters can be placed next to each other - margin: 8px 0; - - > @{all} { - // Allow all children to grow - flex-grow: 1; - // But not to shrink - flex-shrink: 0; - } - - > @{header-1}, > @{header-2}, > @{header-3}, > @{header-4}, > @{header-5}, > @{header-6} { - // Headings should fill up all horizontal space available and force a wrap - flex-basis: 100%; - - margin-top: 1.2em; - } - } - // Chapter zero means that the number of panels is not set and they should not be wrapped @{chapter-0} { flex-wrap: nowrap; @@ -278,6 +254,33 @@ } } + @{chapter} { + // Be a row flexbox to separate elements in columns + display: flex; + flex-wrap: wrap; + flex-direction: row; + gap: 8px; + justify-content: center; + align-items: stretch; + + // Add the gap as a vertical margin, so that multiple chapters can be placed next to each other + margin: 8px 0; + + > @{all} { + // Allow all children to grow + flex-grow: 1; + // But not to shrink + flex-shrink: 0; + } + + > @{header} { + // Headings should fill up all horizontal space available and force a wrap + flex-basis: 100%; + + margin-top: 1.2em; + } + } + // /// ===== Separators ===== @@ -513,7 +516,7 @@ opacity: 0.3; } - @{modifier-mark}, @{element-mark} { + @{modifier-mark} { // Assign marks to their own font group .use-font-group(mark); @@ -522,12 +525,12 @@ .map-hsl-group(current; mark-foreground); // If applied twice, go back to "normality" - @{modifier-mark}, @{element-mark} { + @{modifier-mark} { background-color: .hsl-group(background)[@c]; .map-hsl-group(current; foreground); // If applied thrice, mark again and not anymore - @{modifier-mark}, @{element-mark} { + @{modifier-mark} { background-color: .hsl-group(mark-background)[@c]; .map-hsl-group(current; mark-foreground); } @@ -710,30 +713,28 @@ @{input-range} { padding: 0; - /* - appearance: none; - - &::-moz-range-thumb { - width: 0; - border-radius: 0; - border-style: outset; - - border-color: .hsl-group(current)[@c]; - border-width: 4px; - - background-color: .hsl-group(primary)[@c]; - } - - &::-moz-range-track { - height: 0.125em; - background-color: .hsl-group(current)[@c]; - } - - &::-moz-range-progress { - height: 0.5em; - background-color: .hsl-group(current)[@c]; - } - */ + // appearance: none; + // + // &::-moz-range-thumb { + // width: 0; + // border-radius: 0; + // border-style: outset; + // + // border-color: .hsl-group(current)[@c]; + // border-width: 4px; + // + // background-color: .hsl-group(primary)[@c]; + // } + // + // &::-moz-range-track { + // height: 0.125em; + // background-color: .hsl-group(current)[@c]; + // } + // + // &::-moz-range-progress { + // height: 0.5em; + // background-color: .hsl-group(current)[@c]; + // } } @{input-button} { @@ -900,6 +901,4 @@ } // - - } \ No newline at end of file diff --git a/src/rulesets/classic.less b/src/rulesets/classic.less index 61ceab2..e332dd6 100644 --- a/src/rulesets/classic.less +++ b/src/rulesets/classic.less @@ -19,13 +19,13 @@ } // Give headers a slight shadow so they are easier to read outside of panels - @{header-1}, @{header-2}, @{header-3}, @{header-4}, @{header-5}, @{header-6} { + @{header} { text-shadow: var(--b-outer-shadow); } // But do not give it to headers inside panels @{panel} { - @{header-1}, @{header-2}, @{header-3}, @{header-4}, @{header-5}, @{header-6} { + @{header} { text-shadow: none; } } @@ -45,15 +45,15 @@ } // Make sure mark still works, even considering specificity - @{modifier-mark}, @{element-mark}, @{panel}@{modifier-mark} { + @{modifier-mark}, @{panel}@{modifier-mark} { background-color: .hsl-group(mark-background)[@c]; // Make the modifier toggle properly - @{modifier-mark}, @{element-mark}, @{panel}@{modifier-mark} { + @{modifier-mark}, @{panel}@{modifier-mark} { background-color: .hsl-group(background)[@c]; // Make the modifier toggle properly - @{modifier-mark}, @{element-mark}, @{panel}@{modifier-mark} { + @{modifier-mark}, @{panel}@{modifier-mark} { background-color: .hsl-group(mark-background)[@c]; } } diff --git a/src/rulesets/glass.less b/src/rulesets/glass.less index 8d96d0a..786b897 100644 --- a/src/rulesets/glass.less +++ b/src/rulesets/glass.less @@ -30,16 +30,16 @@ } // Make sure mark still works, even considering specificity - @{modifier-mark}, @{element-mark}, @{panel}@{modifier-mark} { + @{modifier-mark}, @{panel}@{modifier-mark} { background-color: .hsl-group(mark-background)[@c]; backdrop-filter: none; // Make the modifier toggle properly - @{modifier-mark}, @{element-mark}, @{panel}@{modifier-mark} { + @{modifier-mark}, @{panel}@{modifier-mark} { background-color: .hsl-group(background)[@c]; // Make the modifier toggle properly - @{modifier-mark}, @{element-mark}, @{panel}@{modifier-mark} { + @{modifier-mark}, @{panel}@{modifier-mark} { background-color: .hsl-group(mark-background)[@c]; } } diff --git a/src/selectorsets/module.less b/src/selectorsets/module.less index 4ad0423..2ac42f4 100644 --- a/src/selectorsets/module.less +++ b/src/selectorsets/module.less @@ -1,123 +1,124 @@ @bluelib: ~":where(.bluelib)"; -@all: ~"*"; - -@page-main: ~".page-main"; -@page-aside: ~".page-aside"; -@page-header: ~".page-header"; -@page-footer: ~".page-footer"; - -@border-top: ~".border-top"; -@border-right: ~".border-right"; -@border-bottom: ~".border-bottom"; -@border-left: ~".border-left"; - -@float-top: ~".float-top"; -@float-right: ~".float-right"; -@float-bottom: ~".float-bottom"; -@float-left: ~".float-left"; -@float-hcenter: ~".float-hcenter"; -@float-vcenter: ~".float-vcenter"; - -@header-1: ~".header-1"; -@header-2: ~".header-2"; -@header-3: ~".header-3"; -@header-4: ~".header-4"; -@header-5: ~".header-5"; -@header-6: ~".header-6"; - -@panel: ~".panel"; -@panel-box: ~".panel-box"; -@panel-dialog: ~".panel-dialog"; -@panel-parenthesis: ~".panel-parenthesis"; - -@chapter-0: ~".chapter-0"; -@chapter-1: ~".chapter-1"; -@chapter-2: ~".chapter-2"; -@chapter-3: ~".chapter-3"; -@chapter-4: ~".chapter-4"; -@chapter-5: ~".chapter-5"; -@chapter-6: ~".chapter-6"; -@chapter-7: ~".chapter-7"; -@chapter-8: ~".chapter-8"; -@chapter-9: ~".chapter-9"; - -@separator: ~".separator"; -@separator-light: ~".separator-light"; -@separator-heavy: ~".separator-heavy"; - -@image: ~".image"; -@image-limit-half: ~".image-limit-half"; -@image-limit-quarter: ~".image-limit-quarter"; -@figure: ~".figure"; -@figure-caption: ~".figure-caption"; - -@table: ~".table"; -@table-caption: ~".table-caption"; -@table-caption-top: ~".table-caption-top"; -@table-caption-bottom: ~".table-caption-bottom"; -@table-header: ~".table-header"; -@table-body: ~".table-body"; -@table-footer: ~".table-footer"; -@table-row: ~".table-row"; -@table-head: ~".table-head"; -@table-data: ~".table-data"; - -@list-unordered: ~".list-unordered"; -@list-ordered: ~".list-ordered"; - -@glossary-term: ~".glossary-term"; -@glossary-description: ~".glossary-description"; -@glossary-details: ~".glossary-details"; -@glossary-summary: ~".glossary-summary"; - -@modifier-fade: ~".modifier-fade"; -@modifier-mark: ~".modifier-mark"; -@element-mark: ~".element-mark"; -@modifier-todo: ~".modifier-todo"; -@property-disabled: ~".property-disabled"; -@modifier-red: ~".modifier-red"; -@modifier-yellow: ~".modifier-yellow"; -@modifier-green: ~".modifier-green"; -@modifier-cyan: ~".modifier-cyan"; -@modifier-blue: ~".modifier-blue"; -@modifier-magenta: ~".modifier-magenta"; - -@input: ~".input"; -@input-field: ~".input-field"; -@input-area: ~".input-area"; -@input-select: ~".input-select"; -@input-multiselect: ~".input-multiselect"; -@input-radio: ~".input-radio"; -@input-checkbox: ~".input-checkbox"; -@input-color: ~".input-color"; -@input-file: ~".input-file"; -@input-range: ~".input-range"; -@input-button: ~".input-button"; - -@form-flex: ~'.form-flex'; -@form-flex-content: ~'.form-flex-content'; -@form-flex-choice: ~'.form-flex-choice'; - -@text-anchor: ~".text-anchor"; -@text-idiomatic: ~".text-idiomatic"; -@text-emphasis: ~".text-emphasis"; -@text-attention: ~".text-attention"; -@text-strong: ~".text-strong"; -@text-annotation: ~".text-annotation"; -@text-strike: ~".text-strike"; -@text-inserted: ~".text-inserted"; -@text-deleted: ~".text-deleted"; -@text-preformatted: ~".text-preformatted"; -@text-code: ~".text-code"; -@text-input: ~".text-input"; -@text-output: ~".text-output"; -@text-variable: ~".text-variable"; -@text-quote: ~".text-quote"; -@text-citation: ~".text-citation"; -@text-definition: ~".text-definition"; -@text-abbreviation: ~".text-abbreviation"; -@text-ruby: ~".text-ruby"; -@text-ruby-annotation: ~".text-ruby-annotation"; - -@animation-rainbow: ~".animation-rainbow"; +@all: ~":where(*)"; + +@page-main: ~":where(.page-main)"; +@page-aside: ~":where(.page-aside)"; +@page-header: ~":where(.page-header)"; +@page-footer: ~":where(.page-footer)"; + +@border-top: ~":where(.border-top)"; +@border-right: ~":where(.border-right)"; +@border-bottom: ~":where(.border-bottom)"; +@border-left: ~":where(.border-left)"; + +@float-top: ~":where(.float-top)"; +@float-right: ~":where(.float-right)"; +@float-bottom: ~":where(.float-bottom)"; +@float-left: ~":where(.float-left)"; +@float-hcenter: ~":where(.float-hcenter)"; +@float-vcenter: ~":where(.float-vcenter)"; + +@header: ~":where(h1, h2, h3, h4, h5, h6)"; +@header-1: ~":where(.header-1)"; +@header-2: ~":where(.header-2)"; +@header-3: ~":where(.header-3)"; +@header-4: ~":where(.header-4)"; +@header-5: ~":where(.header-5)"; +@header-6: ~":where(.header-6)"; + +@panel: ~":where(.panel)"; +@panel-box: ~":where(.panel-box)"; +@panel-dialog: ~":where(.panel-dialog)"; +@panel-parenthesis: ~":where(.panel-parenthesis)"; + +@chapter: ~":where(.chapter-0, .chapter-1, .chapter-2, .chapter-3, .chapter-4, .chapter-5, .chapter-6, .chapter-7, .chapter-8, .chapter-9)"; +@chapter-0: ~":where(.chapter-0)"; +@chapter-1: ~":where(.chapter-1)"; +@chapter-2: ~":where(.chapter-2)"; +@chapter-3: ~":where(.chapter-3)"; +@chapter-4: ~":where(.chapter-4)"; +@chapter-5: ~":where(.chapter-5)"; +@chapter-6: ~":where(.chapter-6)"; +@chapter-7: ~":where(.chapter-7)"; +@chapter-8: ~":where(.chapter-8)"; +@chapter-9: ~":where(.chapter-9)"; + +@separator: ~":where(.separator)"; +@separator-light: ~":where(.separator-light)"; +@separator-heavy: ~":where(.separator-heavy)"; + +@image: ~":where(.image)"; +@image-limit-half: ~":where(.image-limit-half)"; +@image-limit-quarter: ~":where(.image-limit-quarter)"; +@figure: ~":where(.figure)"; +@figure-caption: ~":where(.figure-caption)"; + +@table: ~":where(.table)"; +@table-caption: ~":where(.table-caption)"; +@table-caption-top: ~":where(.table-caption-top)"; +@table-caption-bottom: ~":where(.table-caption-bottom)"; +@table-header: ~":where(.table-header)"; +@table-body: ~":where(.table-body)"; +@table-footer: ~":where(.table-footer)"; +@table-row: ~":where(.table-row)"; +@table-head: ~":where(.table-head)"; +@table-data: ~":where(.table-data)"; + +@list-unordered: ~":where(.list-unordered)"; +@list-ordered: ~":where(.list-ordered)"; + +@glossary-term: ~":where(.glossary-term)"; +@glossary-description: ~":where(.glossary-description)"; +@glossary-details: ~":where(.glossary-details)"; +@glossary-summary: ~":where(.glossary-summary)"; + +@modifier-fade: ~":where(.modifier-fade)"; +@modifier-mark: ~":where(.modifier-mark)"; +@modifier-todo: ~":where(.modifier-todo)"; +@property-disabled: ~":where(.property-disabled)"; +@modifier-red: ~":where(.modifier-red)"; +@modifier-yellow: ~":where(.modifier-yellow)"; +@modifier-green: ~":where(.modifier-green)"; +@modifier-cyan: ~":where(.modifier-cyan)"; +@modifier-blue: ~":where(.modifier-blue)"; +@modifier-magenta: ~":where(.modifier-magenta)"; + +@input: ~":where(.input)"; +@input-field: ~":where(.input-field)"; +@input-area: ~":where(.input-area)"; +@input-select: ~":where(.input-select)"; +@input-multiselect: ~":where(.input-multiselect)"; +@input-radio: ~":where(.input-radio)"; +@input-checkbox: ~":where(.input-checkbox)"; +@input-color: ~":where(.input-color)"; +@input-file: ~":where(.input-file)"; +@input-range: ~":where(.input-range)"; +@input-button: ~":where(.input-button)"; + +@form-flex: ~":where(.form-flex)"; +@form-flex-content: ~":where(.form-flex-content)"; +@form-flex-choice: ~":where(.form-flex-choice)"; + +@text-anchor: ~":where(.text-anchor)"; +@text-idiomatic: ~":where(.text-idiomatic)"; +@text-emphasis: ~":where(.text-emphasis)"; +@text-attention: ~":where(.text-attention)"; +@text-strong: ~":where(.text-strong)"; +@text-annotation: ~":where(.text-annotation)"; +@text-strike: ~":where(.text-strike)"; +@text-inserted: ~":where(.text-inserted)"; +@text-deleted: ~":where(.text-deleted)"; +@text-preformatted: ~":where(.text-preformatted)"; +@text-code: ~":where(.text-code)"; +@text-input: ~":where(.text-input)"; +@text-output: ~":where(.text-output)"; +@text-variable: ~":where(.text-variable)"; +@text-quote: ~":where(.text-quote)"; +@text-citation: ~":where(.text-citation)"; +@text-definition: ~":where(.text-definition)"; +@text-abbreviation: ~":where(.text-abbreviation)"; +@text-ruby: ~":where(.text-ruby)"; +@text-ruby-annotation: ~":where(.text-ruby-annotation)"; + +@animation-rainbow: ~":where(.animation-rainbow)"; diff --git a/src/selectorsets/root.less b/src/selectorsets/root.less index b5b313f..353b781 100644 --- a/src/selectorsets/root.less +++ b/src/selectorsets/root.less @@ -1,123 +1,124 @@ @bluelib: ~":where(body)"; -@all: ~"*"; - -@page-main: ~"main"; -@page-aside: ~"aside"; -@page-header: ~"header"; -@page-footer: ~"footer"; - -@border-top: ~".border-top"; -@border-right: ~".border-right"; -@border-bottom: ~".border-bottom"; -@border-left: ~".border-left"; - -@float-top: ~".float-top"; -@float-right: ~".float-right"; -@float-bottom: ~".float-bottom"; -@float-left: ~".float-left"; -@float-hcenter: ~".float-hcenter"; -@float-vcenter: ~".float-vcenter"; - -@header-1: ~"h1"; -@header-2: ~"h2"; -@header-3: ~"h3"; -@header-4: ~"h4"; -@header-5: ~"h5"; -@header-6: ~"h6"; - -@panel: ~".panel"; -@panel-box: ~".box"; -@panel-dialog: ~".dialog"; -@panel-parenthesis: ~".parenthesis"; - -@chapter-0: ~".chapter-0"; -@chapter-1: ~".chapter-1"; -@chapter-2: ~".chapter-2"; -@chapter-3: ~".chapter-3"; -@chapter-4: ~".chapter-4"; -@chapter-5: ~".chapter-5"; -@chapter-6: ~".chapter-6"; -@chapter-7: ~".chapter-7"; -@chapter-8: ~".chapter-8"; -@chapter-9: ~".chapter-9"; - -@separator: ~"hr"; -@separator-light: ~".separator-light"; -@separator-heavy: ~".separator-heavy"; - -@image: ~"img"; -@image-limit-half: ~".image-limit-half"; -@image-limit-quarter: ~".image-limit-quarter"; -@figure: ~"figure"; -@figure-caption: ~"figcaption"; - -@table: ~"table"; -@table-caption: ~"caption"; -@table-caption-top: ~".table-caption-top"; -@table-caption-bottom: ~".table-caption-bottom"; -@table-header: ~"thead"; -@table-body: ~"tbody"; -@table-footer: ~"tfoot"; -@table-row: ~"tr"; -@table-head: ~"th"; -@table-data: ~"td"; - -@list-unordered: ~"ul"; -@list-ordered: ~"ol"; - -@glossary-term: ~"dt"; -@glossary-description: ~"dd"; -@glossary-details: ~"details"; -@glossary-summary: ~"summary"; - -@modifier-fade: ~".fade"; -@modifier-mark: ~".mark"; -@element-mark: ~"mark"; -@modifier-todo: ~".todo"; -@property-disabled: ~"[disabled]"; -@modifier-red: ~".red"; -@modifier-yellow: ~".yellow"; -@modifier-green: ~".green"; -@modifier-cyan: ~".cyan"; -@modifier-blue: ~".blue"; -@modifier-magenta: ~".magenta"; - -@input: ~"input, textarea, select, button"; -@input-field: ~'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"]'; -@input-area: ~"textarea"; -@input-select: ~"select:not([multiple])"; -@input-multiselect: ~"select[multiple]"; -@input-radio: ~'input[type="radio"]'; -@input-checkbox: ~'input[type="checkbox"]'; -@input-color: ~'input[type="color"]'; -@input-file: ~'input[type="file"]'; -@input-range: ~'input[type="range"]'; -@input-button: ~'input[type="button"], button'; - -@form-flex: ~'.form-flex'; -@form-flex-content: ~':is(.form-flex-content, p)'; -@form-flex-choice: ~':is(.form-flex-choice, label)'; - -@text-anchor: ~"a"; -@text-idiomatic: ~"i"; -@text-emphasis: ~"em"; -@text-attention: ~"b"; -@text-strong: ~"strong"; -@text-annotation: ~"u"; -@text-strike: ~"s"; -@text-inserted: ~"ins"; -@text-deleted: ~"del"; -@text-preformatted: ~"pre"; -@text-code: ~"code"; -@text-input: ~"kbd"; -@text-output: ~"samp"; -@text-variable: ~"var"; -@text-quote: ~"q"; -@text-citation: ~"cite"; -@text-definition: ~"dfn"; -@text-abbreviation: ~"abbr"; -@text-ruby: ~"ruby"; -@text-ruby-annotation: ~"rt"; - -@animation-rainbow: ~".rainbow"; +@all: ~":where(*)"; + +@page-main: ~":where(main)"; +@page-aside: ~":where(aside)"; +@page-header: ~":where(header)"; +@page-footer: ~":where(footer)"; + +@border-top: ~":where(.border-top)"; +@border-right: ~":where(.border-right)"; +@border-bottom: ~":where(.border-bottom)"; +@border-left: ~":where(.border-left)"; + +@float-top: ~":where(.float-top)"; +@float-right: ~":where(.float-right)"; +@float-bottom: ~":where(.float-bottom)"; +@float-left: ~":where(.float-left)"; +@float-hcenter: ~":where(.float-hcenter)"; +@float-vcenter: ~":where(.float-vcenter)"; + +@header: ~":where(h1, h2, h3, h4, h5, h6)"; +@header-1: ~":where(h1)"; +@header-2: ~":where(h2)"; +@header-3: ~":where(h3)"; +@header-4: ~":where(h4)"; +@header-5: ~":where(h5)"; +@header-6: ~":where(h6)"; + +@panel: ~":where(.panel)"; +@panel-box: ~":where(.box)"; +@panel-dialog: ~":where(.dialog)"; +@panel-parenthesis: ~":where(.parenthesis)"; + +@chapter: ~":where(.chapter-0, .chapter-1, .chapter-2, .chapter-3, .chapter-4, .chapter-5, .chapter-6, .chapter-7, .chapter-8, .chapter-9)"; +@chapter-0: ~":where(.chapter-0)"; +@chapter-1: ~":where(.chapter-1)"; +@chapter-2: ~":where(.chapter-2)"; +@chapter-3: ~":where(.chapter-3)"; +@chapter-4: ~":where(.chapter-4)"; +@chapter-5: ~":where(.chapter-5)"; +@chapter-6: ~":where(.chapter-6)"; +@chapter-7: ~":where(.chapter-7)"; +@chapter-8: ~":where(.chapter-8)"; +@chapter-9: ~":where(.chapter-9)"; + +@separator: ~":where(hr)"; +@separator-light: ~":where(.separator-light)"; +@separator-heavy: ~":where(.separator-heavy)"; + +@image: ~":where(img)"; +@image-limit-half: ~":where(.image-limit-half)"; +@image-limit-quarter: ~":where(.image-limit-quarter)"; +@figure: ~":where(figure)"; +@figure-caption: ~":where(figcaption)"; + +@table: ~":where(table)"; +@table-caption: ~":where(caption)"; +@table-caption-top: ~":where(.table-caption-top)"; +@table-caption-bottom: ~":where(.table-caption-bottom)"; +@table-header: ~":where(thead)"; +@table-body: ~":where(tbody)"; +@table-footer: ~":where(tfoot)"; +@table-row: ~":where(tr)"; +@table-head: ~":where(th)"; +@table-data: ~":where(td)"; + +@list-unordered: ~":where(ul)"; +@list-ordered: ~":where(ol)"; + +@glossary-term: ~":where(dt)"; +@glossary-description: ~":where(dd)"; +@glossary-details: ~":where(details)"; +@glossary-summary: ~":where(summary)"; + +@modifier-fade: ~":where(.fade)"; +@modifier-mark: ~":where(mark, .mark)"; +@modifier-todo: ~":where(.todo)"; +@property-disabled: ~":where([disabled])"; +@modifier-red: ~":where(.red)"; +@modifier-yellow: ~":where(.yellow)"; +@modifier-green: ~":where(.green)"; +@modifier-cyan: ~":where(.cyan)"; +@modifier-blue: ~":where(.blue)"; +@modifier-magenta: ~":where(.magenta)"; + +@input: ~":where(input, textarea, select, button)"; +@input-field: ~':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"])'; +@input-area: ~":where(textarea)"; +@input-select: ~":where(select:not([multiple]))"; +@input-multiselect: ~":where(select[multiple])"; +@input-radio: ~':where(input[type="radio"])'; +@input-checkbox: ~':where(input[type="checkbox"])'; +@input-color: ~':where(input[type="color"])'; +@input-file: ~':where(input[type="file"])'; +@input-range: ~':where(input[type="range"])'; +@input-button: ~':where(input[type="button"], button)'; + +@form-flex: ~':where(.form-flex)'; +@form-flex-content: ~':where(.form-flex-content, p)'; +@form-flex-choice: ~':where(.form-flex-choice, label)'; + +@text-anchor: ~":where(a)"; +@text-idiomatic: ~":where(i)"; +@text-emphasis: ~":where(em)"; +@text-attention: ~":where(b)"; +@text-strong: ~":where(strong)"; +@text-annotation: ~":where(u)"; +@text-strike: ~":where(s)"; +@text-inserted: ~":where(ins)"; +@text-deleted: ~":where(del)"; +@text-preformatted: ~":where(pre)"; +@text-code: ~":where(code)"; +@text-input: ~":where(kbd)"; +@text-output: ~":where(samp)"; +@text-variable: ~":where(var)"; +@text-quote: ~":where(q)"; +@text-citation: ~":where(cite)"; +@text-definition: ~":where(dfn)"; +@text-abbreviation: ~":where(abbr)"; +@text-ruby: ~":where(ruby)"; +@text-ruby-annotation: ~":where(rt)"; + +@animation-rainbow: ~":where(.rainbow)"; diff --git a/yarn.lock b/yarn.lock index c8c9d52..65c3556 100644 --- a/yarn.lock +++ b/yarn.lock @@ -272,6 +272,11 @@ accepts@^1.3.5: mime-types "~2.1.34" negotiator "0.6.3" +amdefine@>=0.0.4: + version "1.0.1" + resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5" + integrity sha512-S2Hw0TtNkMJhIabBwIojKL9YHO5T0n5eNqWJ7Lrlel/zDbftQpxpapi8tZs3X1HWa+u+QeydGmzzNU0m09+Rcg== + ansi-styles@^3.2.1: version "3.2.1" resolved "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d" @@ -358,6 +363,14 @@ chokidar@^3.4.3: optionalDependencies: fsevents "~2.3.2" +clean-css@^3.0.1: + version "3.4.28" + resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-3.4.28.tgz#bf1945e82fc808f55695e6ddeaec01400efd03ff" + integrity sha512-aTWyttSdI2mYi07kWqHi24NUU9YlELFKGOAgFzZjDN1064DMAOy2FBuoyGmkKRlXkbpXd0EVHmiVkbKhKoirTw== + dependencies: + commander "2.8.x" + source-map "0.4.x" + clone@^2.1.2: version "2.1.2" resolved "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz#1b7f4b9f591f1e8f83670401600345a02887435f" @@ -400,6 +413,13 @@ command-line-usage@^6.1.1: table-layout "^1.0.2" typical "^5.2.0" +commander@2.8.x: + version "2.8.1" + resolved "https://registry.yarnpkg.com/commander/-/commander-2.8.1.tgz#06be367febfda0c330aa1e2a072d3dc9762425d4" + integrity sha512-+pJLBFVk+9ZZdlAOB5WuIElVPPth47hILFkmGym57aq8kwxsowvByvB0DHs1vQAhyMZzdcpTtF0VDKGkSDR4ZQ== + dependencies: + graceful-readlink ">= 1.0.0" + content-disposition@~0.5.2: version "0.5.4" resolved "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz#8b82b4efac82512a02bb0b1dcec9d2c5e8eb5bfe" @@ -574,6 +594,11 @@ graceful-fs@^4.1.2: resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.10.tgz#147d3a006da4ca3ce14728c7aefc287c367d7a6c" integrity sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA== +"graceful-readlink@>= 1.0.0": + version "1.0.1" + resolved "https://registry.yarnpkg.com/graceful-readlink/-/graceful-readlink-1.0.1.tgz#4cafad76bc62f02fa039b2f94e9a3dd3a391a725" + integrity sha512-8tLu60LgxF6XpdbK8OW3FA+IfTNBn1ZHGHKF4KQbEeSkajYw5PlYJcKluntgegDPTg8UkHjpet1T82vk6TQ68w== + has-flag@^3.0.0: version "3.0.0" resolved "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd" @@ -809,6 +834,13 @@ koa@^2.13.0: type-is "^1.6.16" vary "^1.1.2" +less-plugin-clean-css@^1.5.1: + version "1.5.1" + resolved "https://registry.yarnpkg.com/less-plugin-clean-css/-/less-plugin-clean-css-1.5.1.tgz#cc57af7aa3398957e56decebe63cb60c23429703" + integrity sha512-Pc68AFHAEJO3aAoRvnUTW5iAiAv6y+TQsWLTTwVNqjiDno6xCvxz1AtfQl7Y0MZSpHPalFajM1EU4RB5UVINpw== + dependencies: + clean-css "^3.0.1" + less@^4.1.3: version "4.1.3" resolved "https://registry.yarnpkg.com/less/-/less-4.1.3.tgz#175be9ddcbf9b250173e0a00b4d6920a5b770246" @@ -1067,6 +1099,13 @@ setprototypeof@1.2.0: resolved "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz#66c9a24a73f9fc28cbe66b09fed3d33dcaf1b424" integrity sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw== +source-map@0.4.x: + version "0.4.4" + resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b" + integrity sha512-Y8nIfcb1s/7DcobUz1yOO1GSp7gyL+D9zLHDehT7iRESqGSxjJ448Sg7rvfgsRJCnKLdSl11uGf0s9X80cH0/A== + dependencies: + amdefine ">=0.0.4" + source-map@~0.6.0: version "0.6.1" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"