switch from scss/sass to plain css with postcss plugins

This commit is contained in:
Luna D. 2024-04-30 12:16:09 +02:00
parent 044df29a38
commit 5aad931ba7
No known key found for this signature in database
GPG key ID: 4B1C63448394F688
43 changed files with 849 additions and 696 deletions

View file

@ -7,22 +7,20 @@
*
*/
$fa-font-path: "@fortawesome/fontawesome-free/webfonts";
@import "@fortawesome/fontawesome-free/css/fontawesome.css";
@import "@fortawesome/fontawesome-free/css/solid.css";
@import "@fortawesome/fontawesome-free/css/regular.css";
@import "@fortawesome/fontawesome-free/css/brands.css";
@import "normalize.css";
@import "@fortawesome/fontawesome-free/scss/fontawesome.scss";
@import "@fortawesome/fontawesome-free/scss/solid.scss";
@import "@fortawesome/fontawesome-free/scss/regular.scss";
@import "@fortawesome/fontawesome-free/scss/brands.scss";
@import "normalize-scss/sass/normalize/import-now";
// Import the default theme to act as a fallback.
/* Import the default theme to act as a fallback. */
@import "themes/dark-blue";
// Files containing common properties, such as variable definitions.
/* Files containing common properties, such as variable definitions. */
@import "common/measurements";
@import "common/mixins";
// General style elements that are used throughout the project.
/* General style elements that are used throughout the project. */
@import "elements/avatar";
@import "elements/base";
@import "elements/block";
@ -39,7 +37,7 @@ $fa-font-path: "@fortawesome/fontawesome-free/webfonts";
@import "elements/separator";
@import "elements/table";
// Style elements specific to certain pages.
/* Style elements specific to certain pages. */
@import "views/admin";
@import "views/burger";
@import "views/communication";

View file

@ -1,58 +0,0 @@
@mixin if-desktop {
@media (min-width: $min-desktop-width + 1) {
@content;
}
}
@mixin if-tablet {
@media (max-width: $min-desktop-width) and (min-width: $max-phone-width + 1) {
@content;
}
}
@mixin if-phone {
@media (max-width: $max-phone-width) {
@content;
}
}
@mixin if-mobile {
@media (max-width: $min-desktop-width) {
@content;
}
}
@mixin even-odd-type($type) {
&:nth-child(odd).#{$type},
&:nth-child(odd) .#{$type} {
background: var(--#{$type}-color);
}
&:nth-child(even).#{$type},
&:nth-child(even) .#{$type} {
background: var(--#{$type}-dark-color);
}
&:nth-child(even) &:nth-child(odd).#{$type},
&:nth-child(even) &:nth-child(odd) .#{$type} {
background: var(--#{$type}-color);
}
}
@mixin even-odd {
&:nth-child(odd) {
background: var(--secondary-dark-color);
}
&:nth-child(even) {
background: var(--secondary-muted-color);;
}
@include even-odd-type(primary);
@include even-odd-type(success);
@include even-odd-type(warning);
@include even-odd-type(danger);
@include even-odd-type(information);
@include even-odd-type(special);
}
@mixin animated-transition {
transition: color var(--transition-animation-duration) ease, background var(--transition-animation-duration) ease;
}

View file

@ -29,7 +29,7 @@ $font-family-monospace: "Droid Sans Mono", monospace;
--button-group-tall-height: 2.5rem;
--button-group-small-height: 1.5rem;
--tag-height: calc(1em * 2);
--tag-height: 2em;
--tag-border-width: 0;
--column-left-width: 360px;
@ -53,8 +53,8 @@ $font-family-monospace: "Droid Sans Mono", monospace;
--number-badge-lower-offset: 0.7rem;
--number-badge-upper-offset: 0.7rem;
--font-family: #{$font-family-base};
--font-family-monospace: #{$font-family-monospace};
--font-family: $font-family-base;
--font-family-monospace: $font-family-monospace;
--font-size: 14px;
--font-tiny-size: 12px;
@ -69,10 +69,10 @@ $font-family-monospace: "Droid Sans Mono", monospace;
--input-text-height: 9rem;
--min-desktop-width: #{$min-desktop-width};
--max-phone-width: #{$max-phone-width};
--medium-layout-width: #{$medium-layout-width};
--narrow-layout-width: #{$narrow-layout-width};
--min-desktop-width: $min-desktop-width;
--max-phone-width: $max-phone-width;
--medium-layout-width: $medium-layout-width;
--narrow-layout-width: $narrow-layout-width;
--transition-animation-duration: 0.15s;
}

View file

@ -0,0 +1,58 @@
@define-mixin if-desktop {
@media (min-width: calc($min-desktop-width + 1px)) {
@mixin-content;
}
}
@define-mixin if-tablet {
@media (max-width: $min-desktop-width) and (min-width: calc($max-phone-width + 1px)) {
@mixin-content;
}
}
@define-mixin if-phone {
@media (max-width: $max-phone-width) {
@mixin-content;
}
}
@define-mixin if-mobile {
@media (max-width: $min-desktop-width) {
@mixin-content;
}
}
@define-mixin even-odd-type $type {
&:nth-child(odd).$(type),
&:nth-child(odd) .$(type) {
background: var(--$(type)-color);
}
&:nth-child(even).$(type),
&:nth-child(even) .$(type) {
background: var(--$(type)-dark-color);
}
&:nth-child(even) &:nth-child(odd).$(type),
&:nth-child(even) &:nth-child(odd) .$(type) {
background: var(--$(type)-color);
}
}
@define-mixin even-odd {
&:nth-child(odd) {
background: var(--secondary-dark-color);
}
&:nth-child(even) {
background: var(--secondary-muted-color);;
}
@mixin even-odd-type primary;
@mixin even-odd-type success;
@mixin even-odd-type warning;
@mixin even-odd-type danger;
@mixin even-odd-type information;
@mixin even-odd-type special;
}
@define-mixin animated-transition {
transition: color var(--transition-animation-duration) ease, background var(--transition-animation-duration) ease;
}

View file

@ -1,48 +0,0 @@
@mixin flash-type($type) {
.flash--#{$type} {
border: 1px solid var(--#{$type}-border-color);
background: var(--#{$type}-color);
.flash__message {
border-left: 1px solid var(--#{$type}-border-color);
}
& a {
color: var(--#{$type}-link-color);
&:hover {
color: var(--link-hover-color);
}
}
}
}
.flash {
display: grid;
grid-template-columns: auto 1fr;
margin: var(--padding-normal);
margin-bottom: 0;
border-radius: var(--border-radius-inner);
}
@include if-phone {
.flash {
margin: var(--padding-small);
margin-bottom: 0;
}
}
.flash__icon {
@extend .flex__column--centered;
padding: var(--padding-normal);
}
.flash__message {
padding: var(--padding-normal);
}
@include flash-type(success);
@include flash-type(warning);
@include flash-type(danger);
@include flash-type(information);
@include flash-type(special);

View file

@ -1,40 +0,0 @@
@mixin heading($el) {
#{$el} {
font-size: var(--font-#{$el}-size);
font-weight: bold;
font-variant: small-caps;
padding: var(--padding-small) 0;
margin-top: 0;
border-bottom: 1px solid var(--primary-border-color);
}
}
@mixin heading-type($type) {
.heading--#{$type} {
border-bottom-color: var(--#{$type}-border-color);
}
.block--#{$type} {
h1, h2, h3, h4, h5, h6 {
border-bottom-color: var(--#{$type}-border-color);
}
}
}
@include heading(h1);
@include heading(h2);
@include heading(h3);
@include heading(h4);
@include heading(h5);
@include heading(h6);
/* To differentiate between h5 and h6, simply make h6 not bold */
h6 {
font-weight: normal;
}
@include heading-type(success);
@include heading-type(warning);
@include heading-type(danger);
@include heading-type(information);
@include heading-type(special);

View file

@ -1,39 +0,0 @@
@mixin separator-type($type) {
.separator--#{$type} {
border-color: var(--#{$type}-border-color);
&.separator--vertical {
background: var(--#{$type}-border-color);
}
}
.button__group--standalone .separator--#{$type},
.button__group .separator--#{$type} {
&.separator--vertical {
background: var(--#{$type}-color) !important;
}
}
}
.separator {
margin: var(--padding-normal) 0;
}
.separator--thin {
margin: var(--padding-small) 0;
}
.separator--vertical {
width: 1px;
height: inherit;
margin: 0 var(--padding-small);
background: var(--primary-border-color);
}
@include separator-type(primary);
@include separator-type(secondary);
@include separator-type(success);
@include separator-type(warning);
@include separator-type(danger);
@include separator-type(information);
@include separator-type(special);

View file

@ -16,7 +16,7 @@ main {
flex-grow: 1;
}
@include if-mobile {
@mixin if-mobile {
main {
padding: var(--padding-small);
}

View file

@ -1,24 +1,24 @@
@mixin block-type($type) {
.block--#{$type} {
@define-mixin block-type $type {
.block--$(type) {
.block__content {
border-color: var(--#{$type}-border-color);
background: var(--#{$type}-dark-color);
border-color: var(--$(type)-border-color);
background: var(--$(type)-dark-color);
}
.block__footer {
background: var(--#{$type}-color);
background: var(--$(type)-color);
}
&.block--muted {
border-color: var(--#{$type}-color);
border-color: var(--$(type)-color);
}
&.block--fixed {
background: var(--#{$type}-color);
background: var(--$(type)-color);
}
& a {
color: var(--#{$type}-link-color);
color: var(--$(type)-link-color);
&:hover {
color: var(--link-hover-color);
@ -56,8 +56,9 @@
padding: var(--padding-small);
}
.block__footer {
@extend .flex__row;
.block__footer, .block__footer--small {
display: flex;
flex-direction: row;
background: var(--primary-muted-color);
padding: var(--padding-normal);
margin: var(--padding-normal);
@ -65,12 +66,11 @@
}
.block__footer--small {
@extend .block__footer;
margin: var(--padding-small);
margin-top: 0;
}
@include if-phone {
@mixin if-phone {
.block__content {
padding: var(--padding-small);
}
@ -81,7 +81,7 @@
}
}
.block__header {
.block__header, .block__header--single-item {
line-height: var(--block-header-height);
padding: 0 var(--padding-normal);
font-size: var(--font-header-size);
@ -93,7 +93,6 @@
}
.block__header--single-item {
@extend .block__header;
display: inline-block;
width: 100%;
box-sizing: border-box;
@ -150,9 +149,9 @@
margin-top: var(--padding-normal);
}
@include block-type(secondary);
@include block-type(success);
@include block-type(warning);
@include block-type(danger);
@include block-type(information);
@include block-type(special);
@mixin block-type secondary;
@mixin block-type success;
@mixin block-type warning;
@mixin block-type danger;
@mixin block-type information;
@mixin block-type special;

View file

@ -1,38 +1,38 @@
@mixin button-type($type) {
.button--#{$type} {
color: var(--#{$type}-link-color) !important;
border-color: var(--#{$type}-border-color);
background: var(--#{$type}-dark-color);
@define-mixin button-type $type {
.button--$(type) {
color: var(--$(type)-link-color) !important;
border-color: var(--$(type)-border-color);
background: var(--$(type)-dark-color);
&.button--important {
color: var(--text-color) !important;
background: var(--#{$type}-color);
box-shadow: 0 -1px var(--#{$type}-dark-color) inset;
background: var(--$(type)-color);
box-shadow: 0 -1px var(--$(type)-dark-color) inset;
}
&:hover {
background: var(--#{$type}-muted-color) !important;
background: var(--$(type)-muted-color) !important;
}
}
.button__group--#{$type} {
border-color: var(--#{$type}-color);
background: var(--#{$type}-dark-color);
.button__group--$(type) {
border-color: var(--$(type)-color);
background: var(--$(type)-dark-color);
& a {
color: var(--#{$type}-link-color);
color: var(--$(type)-link-color);
&:hover {
@include animated-transition;
@mixin animated-transition;
color: var(--text-color);
background: var(--#{$type}-color);
background: var(--$(type)-color);
}
}
}
}
.button {
@include animated-transition;
@mixin animated-transition;
display: flex;
flex: 0 1 auto;
width: fit-content;
@ -48,7 +48,7 @@
align-items: center;
&:hover {
@include animated-transition;
@mixin animated-transition;
background: var(--primary-muted-color);
cursor: pointer;
}
@ -64,15 +64,17 @@
}
.button__row {
@extend .flex__row;
display: flex;
flex-direction: row;
& > button {
margin-right: var(--padding-small);
}
}
.button__group {
@extend .flex__row;
.button__group, .button__group--single, .button__group--standalone {
display: flex;
flex-direction: row;
border: 1px solid var(--secondary-color);
border-radius: var(--border-radius-inner);
margin-right: var(--padding-normal);
@ -102,21 +104,16 @@
}
.button__group--single {
@extend .button__group;
margin-right: 0;
}
.button__group--standalone {
@extend .button__group;
}
.button__group--standalone a {
@include animated-transition;
@mixin animated-transition;
font-weight: bold;
padding: 0 var(--padding-small);
&:hover {
@include animated-transition;
@mixin animated-transition;
background: var(--secondary-muted-color);
}
}
@ -135,8 +132,8 @@
}
}
@include button-type(success);
@include button-type(warning);
@include button-type(danger);
@include button-type(information);
@include button-type(special);
@mixin button-type success;
@mixin button-type warning;
@mixin button-type danger;
@mixin button-type information;
@mixin button-type special;

View file

@ -0,0 +1,51 @@
@define-mixin flash-type $type {
.flash--$(type) {
border: 1px solid var(--$(type)-border-color);
background: var(--$(type)-color);
.flash__message {
border-left: 1px solid var(--$(type)-border-color);
}
& a {
color: var(--$(type)-link-color);
&:hover {
color: var(--link-hover-color);
}
}
}
}
.flash {
display: grid;
grid-template-columns: auto 1fr;
margin: var(--padding-normal);
margin-bottom: 0;
border-radius: var(--border-radius-inner);
}
@mixin if-phone {
.flash {
margin: var(--padding-small);
margin-bottom: 0;
}
}
.flash__icon {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: var(--padding-normal);
}
.flash__message {
padding: var(--padding-normal);
}
@mixin flash-type success;
@mixin flash-type warning;
@mixin flash-type danger;
@mixin flash-type information;
@mixin flash-type special;

View file

@ -13,13 +13,15 @@
}
.flex__row--centered {
@extend .flex__row;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.flex__column--centered {
@extend .flex__column;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
@ -77,13 +79,13 @@
flex: 1 0 auto;
}
@include if-desktop {
@mixin if-desktop {
.flex--maybe-wrap {
flex-wrap: nowrap;
}
}
@include if-mobile {
@mixin if-mobile {
.flex--maybe-wrap {
flex-wrap: wrap;
}

View file

@ -0,0 +1,40 @@
@define-mixin heading $el {
$(el) {
font-size: var(--font-$(el)-size);
font-weight: bold;
font-variant: small-caps;
padding: var(--padding-small) 0;
margin-top: 0;
border-bottom: 1px solid var(--primary-border-color);
}
}
@define-mixin heading-type $type {
.heading--$(type) {
border-bottom-color: var(--$(type)-border-color);
}
.block--$(type) {
h1, h2, h3, h4, h5, h6 {
border-bottom-color: var(--$(type)-border-color);
}
}
}
@mixin heading h1;
@mixin heading h2;
@mixin heading h3;
@mixin heading h4;
@mixin heading h5;
@mixin heading h6;
/* To differentiate between h5 and h6, simply make h6 not bold */
h6 {
font-weight: normal;
}
@mixin heading-type success;
@mixin heading-type warning;
@mixin heading-type danger;
@mixin heading-type information;
@mixin heading-type special;

View file

@ -1,22 +1,22 @@
@mixin interaction-type($type) {
.interaction--#{$type} {
@define-mixin interaction-type $type {
.interaction--$(type) {
position: relative;
color: var(--#{$type}-color) !important;
color: var(--$(type)-color) !important;
padding: 0 var(--padding-tiny);
width: 1rem;
&.active, &:hover {
color: var(--text-color) !important;
background-color: var(--#{$type}-color);
background-color: var(--$(type)-color);
}
}
}
@include interaction-type(fave);
@include interaction-type(upvote);
@include interaction-type(downvote);
@include interaction-type(comment);
@include interaction-type(hide);
@mixin interaction-type fave;
@mixin interaction-type upvote;
@mixin interaction-type downvote;
@mixin interaction-type comment;
@mixin interaction-type hide;
.comments_count {
position: absolute;

View file

@ -1,5 +1,6 @@
.column-layout {
@extend .flex__row;
display: flex;
flex-direction: row;
width: 100%;
}
@ -12,7 +13,7 @@
flex: 1 0 auto;
}
@include if-mobile {
@mixin if-mobile {
.column-layout {
flex-direction: column;
}
@ -23,7 +24,8 @@
}
#container {
@extend .flex__column;
display: flex;
flex-direction: column;
box-sizing: border-box;
height: 100%;
margin: auto;
@ -41,7 +43,7 @@
max-width: var(--medium-layout-width);
}
@include if-desktop {
@mixin if-desktop {
.centered-layout {
.layout--medium, .layout--narrow {
margin-left: auto;

View file

@ -1,5 +1,8 @@
.image-constrained {
@extend .flex__row--centered;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.media-list {
@ -17,7 +20,7 @@
grid-column: 1 / 1;
}
@include if-phone {
@mixin if-phone {
.media-list {
grid-template-columns: repeat(auto-fill, minmax(var(--media-small-container-width), 1fr));
}
@ -93,15 +96,18 @@
}
.image-container {
@extend .flex__column--centered;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.image-container a {
display: flex;
max-height: 100%;
// For some reason tall images don't center properly within the container
// without this hack. I blame CSS.
/* For some reason tall images don't center properly within the container
without this hack. I blame CSS. */
& > img {
max-height: 100%;
margin: auto;

View file

@ -1,26 +1,26 @@
// Phones.
@include if-phone {
/* Phones. */
@mixin if-phone {
.hidden--phone {
display: none !important;
}
}
// Tablets.
@include if-tablet {
/* Tablets. */
@mixin if-tablet {
.hidden--tablet {
display: none !important;
}
}
// Phones and tablets.
@include if-mobile {
/* Phones and tablets. */
@mixin if-mobile {
.hidden--mobile {
display: none !important;
}
}
// Anything larger than 1280px (Desktops).
@include if-desktop {
/* Anything larger than 1280px (Desktops). */
@mixin if-desktop {
.hidden--desktop {
display: none !important;
}

View file

@ -0,0 +1,39 @@
@define-mixin separator-type $type {
.separator--$(type) {
border-color: var(--$(type)-border-color);
&.separator--vertical {
background: var(--$(type)-border-color);
}
}
.button__group--standalone .separator--$(type),
.button__group .separator--$(type) {
&.separator--vertical {
background: var(--$(type)-color) !important;
}
}
}
.separator {
margin: var(--padding-normal) 0;
}
.separator--thin {
margin: var(--padding-small) 0;
}
.separator--vertical {
width: 1px;
height: inherit;
margin: 0 var(--padding-small);
background: var(--primary-border-color);
}
@mixin separator-type primary;
@mixin separator-type secondary;
@mixin separator-type success;
@mixin separator-type warning;
@mixin separator-type danger;
@mixin separator-type information;
@mixin separator-type special;

View file

@ -0,0 +1,89 @@
$background-color: #131a22;
$text-color: #e0e0e0;
$primary-color: #2e4c80;
$secondary-color: #434f69;
$danger-color: #672a21;
$warning-color: #684f2c;
$success-color: #25603e;
$information-color: #205861;
$special-color: #561e5e;
$upvote-color: #5b9b26;
$downvote-color: #da3412;
$fave-color: #a18e27;
$comment-color: #b099dd;
$hide-color: #da3412;
$tag-default-color: #1b3c21;
$tag-error-color: #4f181d;
$tag-rating-color: #113456;
$tag-origin-color: #1d1858;
$tag-character-color: #193f47;
$tag-oc-color: #451f47;
$tag-species-color: #362118;
$tag-body-type-color: #393939;
$tag-content-fanmade-color: #622c4e;
$tag-content-official-color: #4b491c;
$tag-spoiler-color: #4f3811;
$spoiler-color: #0f0f0f;
@define-mixin tag-color $tagname, $color, $text-percentage: 35, $border-percentage: 15 {
--tag-$(tagname)-color: $(color);
--tag-$(tagname)-border-color: hsl(from $color h s calc(l + $border-percentage));
--tag-$(tagname)-text-color: hsl(from $color h s calc(l + $text-percentage));
}
@define-mixin type-color $type, $color {
--$(type)-color: $color;
--$(type)-border-color: hsl(from $color h calc(s - 20) calc(l + 10));
--$(type)-dark-color: hsl(from $color h calc(s - 25) calc(l - 12));
--$(type)-link-color: hsl(from $color h calc(s + 10) calc(l + 45));
}
:root {
--background-color: $background-color;
--text-color: $text-color;
--link-color: hsl(from $primary-color h calc(s + 7) calc(l + 35));
--link-hover-color: $text-color;
--primary-color: $primary-color;
--primary-border-color: hsl(from $primary-color h calc(s - 20) calc(l + 10));
--primary-muted-color: hsl(from $primary-color h calc(s - 10) calc(l - 10));
--primary-dark-color: hsl(from $primary-color h calc(s - 15) calc(l - 20));
--secondary-color: $secondary-color;
--secondary-border-color: hsl(from $secondary-color h s calc(l + 10));
--secondary-muted-color: hsl(from $secondary-color h calc(s - 5) calc(l - 10));
--secondary-dark-color: hsl(from $secondary-color h s calc(l - 15));
--secondary-link-color: hsl(from $secondary-color h s calc(l + 55));
--upvote-color: $upvote-color;
--downvote-color: $downvote-color;
--fave-color: $fave-color;
--comment-color: $comment-color;
--hide-color: $hide-color;
--spoiler-color: $spoiler-color;
--spoiler-revealed-color: hsl(from $spoiler-color h s calc(l + 20));
@mixin type-color success, $success-color;
@mixin type-color warning, $warning-color;
@mixin type-color danger, $danger-color;
@mixin type-color information, $information-color;
@mixin type-color special, $special-color;
@mixin tag-color default, $tag-default-color;
@mixin tag-color error, $tag-error-color, 37;
@mixin tag-color rating, $tag-rating-color, 37;
@mixin tag-color origin, $tag-origin-color, 42;
@mixin tag-color character, $tag-character-color;
@mixin tag-color oc, $tag-oc-color, 40;
@mixin tag-color species, $tag-species-color, 37;
@mixin tag-color body-type, $tag-body-type-color, 45, 12;
@mixin tag-color content-fanmade, $tag-content-fanmade-color, 40;
@mixin tag-color content-official, $tag-content-official-color;
@mixin tag-color spoiler, $tag-spoiler-color;
}

View file

@ -1,92 +0,0 @@
$background-color: #131a22;
$text-color: #e0e0e0;
$primary-color: #2e4c80;
$secondary-color: #434f69;
$danger-color: #672a21;
$warning-color: #684f2c;
$success-color: #25603e;
$information-color: #205861;
$special-color: #561e5e;
$upvote-color: #5b9b26;
$downvote-color: #da3412;
$fave-color: #a18e27;
$comment-color: #b099dd;
$hide-color: #da3412;
$tag-default-color: #1b3c21;
$tag-error-color: #4f181d;
$tag-rating-color: #113456;
$tag-origin-color: #1d1858;
$tag-character-color: #193f47;
$tag-oc-color: #451f47;
$tag-species-color: #362118;
$tag-body-type-color: #393939;
$tag-content-fanmade-color: #622c4e;
$tag-content-official-color: #4b491c;
$tag-spoiler-color: #4f3811;
$spoiler-color: #0f0f0f;
@mixin tag-color($tagname, $color, $text-percentage: 35%, $border-percentage: 15%) {
--tag-#{$tagname}-color: #{$color};
--tag-#{$tagname}-border-color: #{lighten($color, $border-percentage)};
--tag-#{$tagname}-text-color: #{lighten($color, $text-percentage)};
}
@mixin type-color($type, $color) {
--#{$type}-color: #{$color};
--#{$type}-border-color: #{lighten(desaturate($color, 20%), 10%)};
--#{$type}-dark-color: #{darken(desaturate($color, 25%), 12%)};
--#{$type}-link-color: #{lighten(saturate($color, 10%), 45%)};
}
:root {
--background-color: #{$background-color};
--text-color: #{$text-color};
--link-color: #{lighten(saturate($primary-color, 7%), 35%)};
--link-hover-color: #{$text-color};
--primary-color: #{$primary-color};
--primary-border-color: #{lighten(desaturate($primary-color, 20%), 10%)};
--primary-muted-color: #{darken(desaturate($primary-color, 10%), 10%)};
--primary-dark-color: #{darken(desaturate($primary-color, 15%), 20%)};
--secondary-color: #{$secondary-color};
--secondary-border-color: #{lighten($secondary-color, 10%)};
--secondary-muted-color: #{darken(desaturate($secondary-color, 5%), 10%)};
--secondary-dark-color: #{darken($secondary-color, 15%)};
--secondary-link-color: #{lighten($secondary-color, 55%)};
--upvote-color: #{$upvote-color};
--downvote-color: #{$downvote-color};
--fave-color: #{$fave-color};
--comment-color: #{$comment-color};
--hide-color: #{$hide-color};
--spoiler-color: #{$spoiler-color};
--spoiler-revealed-color: #{lighten($spoiler-color, 20%)};
@include type-color(success, $success-color);
@include type-color(warning, $warning-color);
@include type-color(danger, $danger-color);
@include type-color(information, $information-color);
@include type-color(special, $special-color);
@include tag-color(default, $tag-default-color);
@include tag-color(error, $tag-error-color, 37%);
@include tag-color(rating, $tag-rating-color, 37%);
@include tag-color(origin, $tag-origin-color, 42%);
@include tag-color(character, $tag-character-color);
@include tag-color(oc, $tag-oc-color, 40%);
@include tag-color(species, $tag-species-color, 37%);
@include tag-color(body-type, $tag-body-type-color, 45%, 12%);
@include tag-color(content-fanmade, $tag-content-fanmade-color, 40%);
@include tag-color(content-official, $tag-content-official-color);
@include tag-color(spoiler, $tag-spoiler-color);
/* Exceptions to mixin colors */
--tag-origin-border-color: #{lighten(desaturate($tag-origin-color, 10%), 22%)};
}

View file

@ -1,92 +0,0 @@
$background-color: #1d1924;
$text-color: #dadada;
$primary-color: #3e2d5c;
$secondary-color: #4f4066;
$danger-color: #57261f;
$warning-color: #5c472a;
$success-color: #255339;
$information-color: #1f5057;
$special-color: #501f57;
$upvote-color: #5b9b26;
$downvote-color: #da3412;
$fave-color: #a18e27;
$comment-color: #b099dd;
$hide-color: #da3412;
$tag-default-color: #1b3c21;
$tag-error-color: #4f181d;
$tag-rating-color: #113456;
$tag-origin-color: #1d1858;
$tag-character-color: #193f47;
$tag-oc-color: #451f47;
$tag-species-color: #362118;
$tag-body-type-color: #393939;
$tag-content-fanmade-color: #622c4e;
$tag-content-official-color: #4b491c;
$tag-spoiler-color: #4f3811;
$spoiler-color: #0f0f0f;
@mixin tag-color($tagname, $color, $text-percentage: 35%, $border-percentage: 15%) {
--tag-#{$tagname}-color: #{$color};
--tag-#{$tagname}-border-color: #{lighten($color, $border-percentage)};
--tag-#{$tagname}-text-color: #{lighten($color, $text-percentage)};
}
@mixin type-color($type, $color) {
--#{$type}-color: #{$color};
--#{$type}-border-color: #{lighten(desaturate($color, 5%), 30%)};
--#{$type}-dark-color: #{darken($color, 15%)};
--#{$type}-link-color: #{lighten($color, 45%)};
}
:root {
--background-color: #{$background-color};
--text-color: #{$text-color};
--link-color: #{lighten(saturate($primary-color, 7%), 30%)};
--link-hover-color: #{$text-color};
--primary-color: #{$primary-color};
--primary-border-color: #{lighten($primary-color, 20%)};
--primary-muted-color: #{darken(desaturate($primary-color, 10%), 10%)};
--primary-dark-color: #{darken(desaturate($primary-color, 5%), 15%)};
--secondary-color: #{$secondary-color};
--secondary-border-color: #{lighten($secondary-color, 20%)};
--secondary-muted-color: #{darken(desaturate($secondary-color, 5%), 10%)};
--secondary-dark-color: #{darken($secondary-color, 15%)};
--secondary-link-color: #{lighten($secondary-color, 55%)};
--upvote-color: #{$upvote-color};
--downvote-color: #{$downvote-color};
--fave-color: #{$fave-color};
--comment-color: #{$comment-color};
--hide-color: #{$hide-color};
--spoiler-color: #{$spoiler-color};
--spoiler-revealed-color: #{lighten($spoiler-color, 20%)};
@include type-color(success, $success-color);
@include type-color(warning, $warning-color);
@include type-color(danger, $danger-color);
@include type-color(information, $information-color);
@include type-color(special, $special-color);
@include tag-color(default, $tag-default-color);
@include tag-color(error, $tag-error-color, 37%);
@include tag-color(rating, $tag-rating-color, 37%);
@include tag-color(origin, $tag-origin-color, 42%);
@include tag-color(character, $tag-character-color);
@include tag-color(oc, $tag-oc-color, 40%);
@include tag-color(species, $tag-species-color, 37%);
@include tag-color(body-type, $tag-body-type-color, 45%, 12%);
@include tag-color(content-fanmade, $tag-content-fanmade-color, 40%);
@include tag-color(content-official, $tag-content-official-color);
@include tag-color(spoiler, $tag-spoiler-color);
/* Exceptions to mixin colors */
--tag-origin-border-color: #{lighten(desaturate($tag-origin-color, 10%), 22%)};
}

View file

@ -1,4 +0,0 @@
// Temporary; todo: make it work
#burger {
display: none;
}

View file

@ -37,7 +37,7 @@
line-height: 100%;
}
@media (max-width: $min_px_width_for_desktop_layout) {
@mixin if-mobile {
.approval-grid {
grid-template-columns: 1fr;
grid-template-rows: auto;

View file

@ -0,0 +1,4 @@
/* Temporary; todo: make it work */
#burger {
display: none;
}

View file

@ -20,7 +20,8 @@
}
.communication-edit__actions {
@extend .flex__row;
display: flex;
flex-direction: row;
line-height: var(--block-header-height);
border: 0;
margin: var(--padding-normal);
@ -29,7 +30,8 @@
}
.communication__anonymous {
@extend .flex__row;
display: flex;
flex-direction: row;
line-height: ar(--block-header-height);
background: var(--secondary-color);
border: 1px solid var(--secondary-border-color);

View file

@ -22,10 +22,9 @@ header {
}
.header__search {
@extend .flex;
@extend .flex--no-wrap;
@extend .flex--centered;
display: flex;
flex-wrap: nowrap;
align-items: center;
border: 0;
border-radius: var(--border-radius-inner);
background: var(--primary-muted-color);
@ -38,7 +37,7 @@ header {
}
.header__input {
@include animated-transition;
@mixin animated-transition;
height: var(--navbar-input-size);
font-size: var(--font-size);
background: 0;
@ -82,7 +81,7 @@ nav.dropdown__content {
line-height: var(--navbar-secondary-size);
}
@include if-mobile {
@mixin if-mobile {
header {
gap: var(--padding-normal);
flex-wrap: wrap;

View file

@ -1,5 +1,6 @@
.textile-syntax-reference {
@extend .flex__row;
display: flex;
flex-direction: row;
line-height: var(--block-header-height);
vertical-align: center;
margin-bottom: var(--padding-small);

View file

@ -1,19 +1,19 @@
@mixin fix-interaction($type) {
.interaction--#{$type} {
@define-mixin fix-interaction $type {
.interaction--$(type) {
padding: var(--padding-tiny) var(--padding-small);
}
}
@include if-phone {
@mixin if-phone {
.metabar__interactions {
display: grid;
width: 100%;
grid-template-columns: repeat(5, 1fr);
@include fix-interaction(fave);
@include fix-interaction(upvote);
@include fix-interaction(downvote);
@include fix-interaction(hide);
@mixin fix-interaction fave;
@mixin fix-interaction upvote;
@mixin fix-interaction downvote;
@mixin fix-interaction hide;
}
.metabar__interactions * {
@ -42,7 +42,10 @@
}
.metabar {
@extend .flex__row--centered;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
line-height: var(--block-header-height);
}

View file

@ -1,12 +1,13 @@
.statistics {
@extend .flex__column;
display: flex;
flex-direction: column;
border: 1.5px solid var(--secondary-color);
border-radius: var(--border-radius-inner);
overflow: hidden;
}
.statistics__statistic {
@include even-odd;
@mixin even-odd;
display: grid;
grid-template-columns: 15% 15% auto;

View file

@ -1,25 +1,26 @@
@mixin tag-color($tag_type) {
&[data-tag-category=#{$tag_type}] {
color: var(--tag-#{$tag_type}-text-color);
background: var(--tag-#{$tag_type}-color);
border-color: var(--tag-#{$tag_type}-border-color);
@define-mixin tag-color $tagtype {
&[data-tag-category=$(tagtype)] {
color: var(--tag-$(tagtype)-text-color);
background: var(--tag-$(tagtype)-color);
border-color: var(--tag-$(tagtype)-border-color);
.tag__state {
color: var(--tag-#{$tag_type}-text-color);
color: var(--tag-$(tagtype)-text-color);
}
.tag__name {
color: var(--tag-#{$tag_type}-text-color);
color: var(--tag-$(tagtype)-text-color);
}
.tag__count {
background: var(--tag-#{$tag_type}-border-color);
background: var(--tag-$(tagtype)-border-color);
}
}
}
.tag-list {
@extend .flex__row;
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: var(--padding-small);
margin-bottom: var(--padding-normal);
@ -39,16 +40,16 @@
color: inherit;
}
@include tag-color(error);
@include tag-color(rating);
@include tag-color(origin);
@include tag-color(character);
@include tag-color(oc);
@include tag-color(species);
@include tag-color(body-type);
@include tag-color(content-fanmade);
@include tag-color(content-official);
@include tag-color(spoiler);
@mixin tag-color error;
@mixin tag-color rating;
@mixin tag-color origin;
@mixin tag-color character;
@mixin tag-color oc;
@mixin tag-color species;
@mixin tag-color body-type;
@mixin tag-color content-fanmade;
@mixin tag-color content-official;
@mixin tag-color spoiler;
}
.tag > span {

View file

@ -8,10 +8,3 @@
// Our code
import './ujs';
import './when-ready';
// Base stylesheet.
import '../css/application.scss';
// Themes.
import '../css/themes/dark-blue.scss';
import '../css/themes/dark-purple.scss';

575
assets/package-lock.json generated
View file

@ -5,7 +5,9 @@
"packages": {
"": {
"dependencies": {
"@csstools/postcss-relative-color-syntax": "^2.0.14",
"@fortawesome/fontawesome-free": "^6.5.2",
"@types/postcss-mixins": "^9.0.5",
"@types/web": "^0.0.143",
"@typescript-eslint/eslint-plugin": "^7.8.0",
"@typescript-eslint/parser": "^7.8.0",
@ -13,8 +15,10 @@
"cross-env": "^7.0.3",
"eslint": "^8.34.0",
"jest-environment-jsdom": "^29.7.0",
"normalize-scss": "^8.0.0",
"sass": "^1.75.0",
"normalize.css": "^8.0.1",
"postcss-mixins": "^10.0.1",
"postcss-nested": "^6.0.1",
"postcss-simple-vars": "^7.0.1",
"typescript": "^5.4",
"vite": "^5.2"
},
@ -629,6 +633,184 @@
"integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==",
"dev": true
},
"node_modules/@csstools/color-helpers": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-4.2.0.tgz",
"integrity": "sha512-hJJrSBzbfGxUsaR6X4Bzd/FLx0F1ulKnR5ljY9AiXCtsR+H+zSWQDFWlKES1BRaVZTDHLpIIHS9K2o0h+JLlrg==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"engines": {
"node": "^14 || ^16 || >=18"
}
},
"node_modules/@csstools/css-calc": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-1.2.0.tgz",
"integrity": "sha512-iQqIW5vDPqQdLx07/atCuNKDprhIWjB0b8XRhUyXZWBZYUG+9mNyFwyu30rypX84WLevVo25NYW2ipxR8WyseQ==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"engines": {
"node": "^14 || ^16 || >=18"
},
"peerDependencies": {
"@csstools/css-parser-algorithms": "^2.6.1",
"@csstools/css-tokenizer": "^2.2.4"
}
},
"node_modules/@csstools/css-color-parser": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-2.0.0.tgz",
"integrity": "sha512-0/v6OPpcg+b8TJT2N1Rcp0oH5xEvVOU5K2qDkaR3IMHNXuJ7XfVCQLINt3Cuj8mr54DbilEoZ9uvAmHBoZ//Fw==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"dependencies": {
"@csstools/color-helpers": "^4.2.0",
"@csstools/css-calc": "^1.2.0"
},
"engines": {
"node": "^14 || ^16 || >=18"
},
"peerDependencies": {
"@csstools/css-parser-algorithms": "^2.6.1",
"@csstools/css-tokenizer": "^2.2.4"
}
},
"node_modules/@csstools/css-parser-algorithms": {
"version": "2.6.1",
"resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.6.1.tgz",
"integrity": "sha512-ubEkAaTfVZa+WwGhs5jbo5Xfqpeaybr/RvWzvFxRs4jfq16wH8l8Ty/QEEpINxll4xhuGfdMbipRyz5QZh9+FA==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"engines": {
"node": "^14 || ^16 || >=18"
},
"peerDependencies": {
"@csstools/css-tokenizer": "^2.2.4"
}
},
"node_modules/@csstools/css-tokenizer": {
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.4.tgz",
"integrity": "sha512-PuWRAewQLbDhGeTvFuq2oClaSCKPIBmHyIobCV39JHRYN0byDcUWJl5baPeNUcqrjtdMNqFooE0FGl31I3JOqw==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"engines": {
"node": "^14 || ^16 || >=18"
}
},
"node_modules/@csstools/postcss-progressive-custom-properties": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/@csstools/postcss-progressive-custom-properties/-/postcss-progressive-custom-properties-3.2.0.tgz",
"integrity": "sha512-BZlirVxCRgKlE7yVme+Xvif72eTn1MYXj8oZ4Knb+jwaH4u3AN1DjbhM7j86RP5vvuAOexJ4JwfifYYKWMN/QQ==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"dependencies": {
"postcss-value-parser": "^4.2.0"
},
"engines": {
"node": "^14 || ^16 || >=18"
},
"peerDependencies": {
"postcss": "^8.4"
}
},
"node_modules/@csstools/postcss-relative-color-syntax": {
"version": "2.0.14",
"resolved": "https://registry.npmjs.org/@csstools/postcss-relative-color-syntax/-/postcss-relative-color-syntax-2.0.14.tgz",
"integrity": "sha512-NlxgLjAjVCTUVGiWk8WNj3dKvux9eC6O5aLM3BmdA8UXEwBHYI9r4IqlanxG9PlcXnzhTUX6eZsqgmxwt4FPow==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"dependencies": {
"@csstools/css-color-parser": "^2.0.0",
"@csstools/css-parser-algorithms": "^2.6.1",
"@csstools/css-tokenizer": "^2.2.4",
"@csstools/postcss-progressive-custom-properties": "^3.2.0",
"@csstools/utilities": "^1.0.0"
},
"engines": {
"node": "^14 || ^16 || >=18"
},
"peerDependencies": {
"postcss": "^8.4"
}
},
"node_modules/@csstools/utilities": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/@csstools/utilities/-/utilities-1.0.0.tgz",
"integrity": "sha512-tAgvZQe/t2mlvpNosA4+CkMiZ2azISW5WPAcdSalZlEjQvUfghHxfQcrCiK/7/CrfAWVxyM88kGFYO82heIGDg==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"engines": {
"node": "^14 || ^16 || >=18"
},
"peerDependencies": {
"postcss": "^8.4"
}
},
"node_modules/@esbuild/aix-ppc64": {
"version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.20.2.tgz",
@ -1600,9 +1782,9 @@
}
},
"node_modules/@rollup/rollup-android-arm-eabi": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.17.1.tgz",
"integrity": "sha512-P6Wg856Ou/DLpR+O0ZLneNmrv7QpqBg+hK4wE05ijbC/t349BRfMfx+UFj5Ha3fCFopIa6iSZlpdaB4agkWp2Q==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.17.2.tgz",
"integrity": "sha512-NM0jFxY8bB8QLkoKxIQeObCaDlJKewVlIEkuyYKm5An1tdVZ966w2+MPQ2l8LBZLjR+SgyV+nRkTIunzOYBMLQ==",
"cpu": [
"arm"
],
@ -1612,9 +1794,9 @@
]
},
"node_modules/@rollup/rollup-android-arm64": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.17.1.tgz",
"integrity": "sha512-piwZDjuW2WiHr05djVdUkrG5JbjnGbtx8BXQchYCMfib/nhjzWoiScelZ+s5IJI7lecrwSxHCzW026MWBL+oJQ==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.17.2.tgz",
"integrity": "sha512-yeX/Usk7daNIVwkq2uGoq2BYJKZY1JfyLTaHO/jaiSwi/lsf8fTFoQW/n6IdAsx5tx+iotu2zCJwz8MxI6D/Bw==",
"cpu": [
"arm64"
],
@ -1624,9 +1806,9 @@
]
},
"node_modules/@rollup/rollup-darwin-arm64": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.17.1.tgz",
"integrity": "sha512-LsZXXIsN5Q460cKDT4Y+bzoPDhBmO5DTr7wP80d+2EnYlxSgkwdPfE3hbE+Fk8dtya+8092N9srjBTJ0di8RIA==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.17.2.tgz",
"integrity": "sha512-kcMLpE6uCwls023+kknm71ug7MZOrtXo+y5p/tsg6jltpDtgQY1Eq5sGfHcQfb+lfuKwhBmEURDga9N0ol4YPw==",
"cpu": [
"arm64"
],
@ -1636,9 +1818,9 @@
]
},
"node_modules/@rollup/rollup-darwin-x64": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.17.1.tgz",
"integrity": "sha512-S7TYNQpWXB9APkxu/SLmYHezWwCoZRA9QLgrDeml+SR2A1LLPD2DBUdUlvmCF7FUpRMKvbeeWky+iizQj65Etw==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.17.2.tgz",
"integrity": "sha512-AtKwD0VEx0zWkL0ZjixEkp5tbNLzX+FCqGG1SvOu993HnSz4qDI6S4kGzubrEJAljpVkhRSlg5bzpV//E6ysTQ==",
"cpu": [
"x64"
],
@ -1648,9 +1830,9 @@
]
},
"node_modules/@rollup/rollup-linux-arm-gnueabihf": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.17.1.tgz",
"integrity": "sha512-Lq2JR5a5jsA5um2ZoLiXXEaOagnVyCpCW7xvlcqHC7y46tLwTEgUSTM3a2TfmmTMmdqv+jknUioWXlmxYxE9Yw==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.17.2.tgz",
"integrity": "sha512-3reX2fUHqN7sffBNqmEyMQVj/CKhIHZd4y631duy0hZqI8Qoqf6lTtmAKvJFYa6bhU95B1D0WgzHkmTg33In0A==",
"cpu": [
"arm"
],
@ -1660,9 +1842,9 @@
]
},
"node_modules/@rollup/rollup-linux-arm-musleabihf": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.17.1.tgz",
"integrity": "sha512-9BfzwyPNV0IizQoR+5HTNBGkh1KXE8BqU0DBkqMngmyFW7BfuIZyMjQ0s6igJEiPSBvT3ZcnIFohZ19OqjhDPg==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.17.2.tgz",
"integrity": "sha512-uSqpsp91mheRgw96xtyAGP9FW5ChctTFEoXP0r5FAzj/3ZRv3Uxjtc7taRQSaQM/q85KEKjKsZuiZM3GyUivRg==",
"cpu": [
"arm"
],
@ -1672,9 +1854,9 @@
]
},
"node_modules/@rollup/rollup-linux-arm64-gnu": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.17.1.tgz",
"integrity": "sha512-e2uWaoxo/rtzA52OifrTSXTvJhAXb0XeRkz4CdHBK2KtxrFmuU/uNd544Ogkpu938BzEfvmWs8NZ8Axhw33FDw==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.17.2.tgz",
"integrity": "sha512-EMMPHkiCRtE8Wdk3Qhtciq6BndLtstqZIroHiiGzB3C5LDJmIZcSzVtLRbwuXuUft1Cnv+9fxuDtDxz3k3EW2A==",
"cpu": [
"arm64"
],
@ -1684,9 +1866,9 @@
]
},
"node_modules/@rollup/rollup-linux-arm64-musl": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.17.1.tgz",
"integrity": "sha512-ekggix/Bc/d/60H1Mi4YeYb/7dbal1kEDZ6sIFVAE8pUSx7PiWeEh+NWbL7bGu0X68BBIkgF3ibRJe1oFTksQQ==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.17.2.tgz",
"integrity": "sha512-NMPylUUZ1i0z/xJUIx6VUhISZDRT+uTWpBcjdv0/zkp7b/bQDF+NfnfdzuTiB1G6HTodgoFa93hp0O1xl+/UbA==",
"cpu": [
"arm64"
],
@ -1696,9 +1878,9 @@
]
},
"node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.17.1.tgz",
"integrity": "sha512-UGV0dUo/xCv4pkr/C8KY7XLFwBNnvladt8q+VmdKrw/3RUd3rD0TptwjisvE2TTnnlENtuY4/PZuoOYRiGp8Gw==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.17.2.tgz",
"integrity": "sha512-T19My13y8uYXPw/L/k0JYaX1fJKFT/PWdXiHr8mTbXWxjVF1t+8Xl31DgBBvEKclw+1b00Chg0hxE2O7bTG7GQ==",
"cpu": [
"ppc64"
],
@ -1708,9 +1890,9 @@
]
},
"node_modules/@rollup/rollup-linux-riscv64-gnu": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.17.1.tgz",
"integrity": "sha512-gEYmYYHaehdvX46mwXrU49vD6Euf1Bxhq9pPb82cbUU9UT2NV+RSckQ5tKWOnNXZixKsy8/cPGtiUWqzPuAcXQ==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.17.2.tgz",
"integrity": "sha512-BOaNfthf3X3fOWAB+IJ9kxTgPmMqPPH5f5k2DcCsRrBIbWnaJCgX2ll77dV1TdSy9SaXTR5iDXRL8n7AnoP5cg==",
"cpu": [
"riscv64"
],
@ -1720,9 +1902,9 @@
]
},
"node_modules/@rollup/rollup-linux-s390x-gnu": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.17.1.tgz",
"integrity": "sha512-xeae5pMAxHFp6yX5vajInG2toST5lsCTrckSRUFwNgzYqnUjNBcQyqk1bXUxX5yhjWFl2Mnz3F8vQjl+2FRIcw==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.17.2.tgz",
"integrity": "sha512-W0UP/x7bnn3xN2eYMql2T/+wpASLE5SjObXILTMPUBDB/Fg/FxC+gX4nvCfPBCbNhz51C+HcqQp2qQ4u25ok6g==",
"cpu": [
"s390x"
],
@ -1732,9 +1914,9 @@
]
},
"node_modules/@rollup/rollup-linux-x64-gnu": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.17.1.tgz",
"integrity": "sha512-AsdnINQoDWfKpBzCPqQWxSPdAWzSgnYbrJYtn6W0H2E9It5bZss99PiLA8CgmDRfvKygt20UpZ3xkhFlIfX9zQ==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.17.2.tgz",
"integrity": "sha512-Hy7pLwByUOuyaFC6mAr7m+oMC+V7qyifzs/nW2OJfC8H4hbCzOX07Ov0VFk/zP3kBsELWNFi7rJtgbKYsav9QQ==",
"cpu": [
"x64"
],
@ -1744,9 +1926,9 @@
]
},
"node_modules/@rollup/rollup-linux-x64-musl": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.17.1.tgz",
"integrity": "sha512-KoB4fyKXTR+wYENkIG3fFF+5G6N4GFvzYx8Jax8BR4vmddtuqSb5oQmYu2Uu067vT/Fod7gxeQYKupm8gAcMSQ==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.17.2.tgz",
"integrity": "sha512-h1+yTWeYbRdAyJ/jMiVw0l6fOOm/0D1vNLui9iPuqgRGnXA0u21gAqOyB5iHjlM9MMfNOm9RHCQ7zLIzT0x11Q==",
"cpu": [
"x64"
],
@ -1756,9 +1938,9 @@
]
},
"node_modules/@rollup/rollup-win32-arm64-msvc": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.17.1.tgz",
"integrity": "sha512-J0d3NVNf7wBL9t4blCNat+d0PYqAx8wOoY+/9Q5cujnafbX7BmtYk3XvzkqLmFECaWvXGLuHmKj/wrILUinmQg==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.17.2.tgz",
"integrity": "sha512-tmdtXMfKAjy5+IQsVtDiCfqbynAQE/TQRpWdVataHmhMb9DCoJxp9vLcCBjEQWMiUYxO1QprH/HbY9ragCEFLA==",
"cpu": [
"arm64"
],
@ -1768,9 +1950,9 @@
]
},
"node_modules/@rollup/rollup-win32-ia32-msvc": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.17.1.tgz",
"integrity": "sha512-xjgkWUwlq7IbgJSIxvl516FJ2iuC/7ttjsAxSPpC9kkI5iQQFHKyEN5BjbhvJ/IXIZ3yIBcW5QDlWAyrA+TFag==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.17.2.tgz",
"integrity": "sha512-7II/QCSTAHuE5vdZaQEwJq2ZACkBpQDOmQsE6D6XUbnBHW8IAhm4eTufL6msLJorzrHDFv3CF8oCA/hSIRuZeQ==",
"cpu": [
"ia32"
],
@ -1780,9 +1962,9 @@
]
},
"node_modules/@rollup/rollup-win32-x64-msvc": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.17.1.tgz",
"integrity": "sha512-0QbCkfk6cnnVKWqqlC0cUrrUMDMfu5ffvYMTUHf+qMN2uAb3MKP31LPcwiMXBNsvoFGs/kYdFOsuLmvppCopXA==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.17.2.tgz",
"integrity": "sha512-TGGO7v7qOq4CYmSBVEYpI1Y5xDuCEnbVC5Vth8mOsW0gDSzxNrVERPc790IGHsrT2dQSimgMr9Ub3Y1Jci5/8w==",
"cpu": [
"x64"
],
@ -2050,6 +2232,14 @@
"undici-types": "~5.26.4"
}
},
"node_modules/@types/postcss-mixins": {
"version": "9.0.5",
"resolved": "https://registry.npmjs.org/@types/postcss-mixins/-/postcss-mixins-9.0.5.tgz",
"integrity": "sha512-xtHiTGjIV6kr/7j+U682Hz8szSjzp0T606k/OMS4/mrjHZvovBs+ceKllzpOzQLAB8mXmgeJI6K5AbcPh16lsA==",
"dependencies": {
"postcss": "^8.2.14"
}
},
"node_modules/@types/semver": {
"version": "7.5.8",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.8.tgz",
@ -2391,6 +2581,7 @@
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
"integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
"dev": true,
"dependencies": {
"normalize-path": "^3.0.0",
"picomatch": "^2.0.4"
@ -2583,17 +2774,6 @@
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
},
"node_modules/binary-extensions": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
"integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
"engines": {
"node": ">=8"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/brace-expansion": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
@ -2688,6 +2868,14 @@
"node": ">=6"
}
},
"node_modules/camelcase-css": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz",
"integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==",
"engines": {
"node": ">= 6"
}
},
"node_modules/caniuse-lite": {
"version": "1.0.30001614",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001614.tgz",
@ -2731,40 +2919,6 @@
"node": ">=10"
}
},
"node_modules/chokidar": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
"integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
"dependencies": {
"anymatch": "~3.1.2",
"braces": "~3.0.2",
"glob-parent": "~5.1.2",
"is-binary-path": "~2.1.0",
"is-glob": "~4.0.1",
"normalize-path": "~3.0.0",
"readdirp": "~3.6.0"
},
"engines": {
"node": ">= 8.10.0"
},
"funding": {
"url": "https://paulmillr.com/funding/"
},
"optionalDependencies": {
"fsevents": "~2.3.2"
}
},
"node_modules/chokidar/node_modules/glob-parent": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
"dependencies": {
"is-glob": "^4.0.1"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/ci-info": {
"version": "3.9.0",
"resolved": "https://registry.npmjs.org/ci-info/-/ci-info-3.9.0.tgz",
@ -2919,6 +3073,17 @@
"integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==",
"dev": true
},
"node_modules/cssesc": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
"integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
"bin": {
"cssesc": "bin/cssesc"
},
"engines": {
"node": ">=4"
}
},
"node_modules/cssom": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz",
@ -3961,11 +4126,6 @@
"node": ">= 4"
}
},
"node_modules/immutable": {
"version": "4.3.5",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.5.tgz",
"integrity": "sha512-8eabxkth9gZatlwl5TBuJnCsoTADlL6ftEr7A4qgdaTsPyreilDSnUk57SO+jfKcNtxPa22U5KK6DSeAYhpBJw=="
},
"node_modules/import-fresh": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@ -4037,17 +4197,6 @@
"integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
"dev": true
},
"node_modules/is-binary-path": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
"integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
"dependencies": {
"binary-extensions": "^2.0.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/is-core-module": {
"version": "2.13.1",
"resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz",
@ -4852,16 +5001,6 @@
"node": "^14.15.0 || ^16.10.0 || >=18.0.0"
}
},
"node_modules/jest-runner/node_modules/source-map-support": {
"version": "0.5.13",
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
"integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
"dev": true,
"dependencies": {
"buffer-from": "^1.0.0",
"source-map": "^0.6.0"
}
},
"node_modules/jest-runtime": {
"version": "29.7.0",
"resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-29.7.0.tgz",
@ -5473,6 +5612,7 @@
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
"integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
"dev": true,
"engines": {
"node": ">=0.10.0"
}
@ -5485,10 +5625,10 @@
"node": ">=0.10.0"
}
},
"node_modules/normalize-scss": {
"version": "8.0.0",
"resolved": "https://registry.npmjs.org/normalize-scss/-/normalize-scss-8.0.0.tgz",
"integrity": "sha512-C6GXIxQ2LOYWrde27xWbONavmybobxp+V6TY8BiBJw5M+yMNEg2R0WjaeDtmP5JsunFYKvFOvgMAIC0/OxZuJQ=="
"node_modules/normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"node_modules/npm-run-path": {
"version": "4.0.1",
@ -5777,6 +5917,96 @@
"node": "^10 || ^12 || >=14"
}
},
"node_modules/postcss-js": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz",
"integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==",
"dependencies": {
"camelcase-css": "^2.0.1"
},
"engines": {
"node": "^12 || ^14 || >= 16"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/postcss/"
},
"peerDependencies": {
"postcss": "^8.4.21"
}
},
"node_modules/postcss-mixins": {
"version": "10.0.1",
"resolved": "https://registry.npmjs.org/postcss-mixins/-/postcss-mixins-10.0.1.tgz",
"integrity": "sha512-5+cI9r8L5ChegVsLM9pXa53Ft03Mt9xAq+kvzqfrUHGPCArVGOfUvmQK2CLP3XWWP2dqxDLQI+lIcXG+GTqOBQ==",
"funding": [
{
"type": "opencollective",
"url": "https://opencollective.com/postcss/"
},
{
"type": "github",
"url": "https://github.com/sponsors/ai"
}
],
"dependencies": {
"fast-glob": "^3.3.2",
"postcss-js": "^4.0.1",
"postcss-simple-vars": "^7.0.1",
"sugarss": "^4.0.1"
},
"engines": {
"node": "^18.0 || >= 20.0"
},
"peerDependencies": {
"postcss": "^8.2.14"
}
},
"node_modules/postcss-nested": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.0.1.tgz",
"integrity": "sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==",
"dependencies": {
"postcss-selector-parser": "^6.0.11"
},
"engines": {
"node": ">=12.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/postcss/"
},
"peerDependencies": {
"postcss": "^8.2.14"
}
},
"node_modules/postcss-selector-parser": {
"version": "6.0.16",
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.16.tgz",
"integrity": "sha512-A0RVJrX+IUkVZbW3ClroRWurercFhieevHB38sr2+l9eUClMqome3LmEmnhlNy+5Mr2EYN6B2Kaw9wYdd+VHiw==",
"dependencies": {
"cssesc": "^3.0.0",
"util-deprecate": "^1.0.2"
},
"engines": {
"node": ">=4"
}
},
"node_modules/postcss-simple-vars": {
"version": "7.0.1",
"resolved": "https://registry.npmjs.org/postcss-simple-vars/-/postcss-simple-vars-7.0.1.tgz",
"integrity": "sha512-5GLLXaS8qmzHMOjVxqkk1TZPf1jMqesiI7qLhnlyERalG0sMbHIbJqrcnrpmZdKCLglHnRHoEBB61RtGTsj++A==",
"engines": {
"node": ">=14.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/postcss/"
},
"peerDependencies": {
"postcss": "^8.2.1"
}
},
"node_modules/postcss-value-parser": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
@ -5894,17 +6124,6 @@
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
"dev": true
},
"node_modules/readdirp": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
"dependencies": {
"picomatch": "^2.2.1"
},
"engines": {
"node": ">=8.10.0"
}
},
"node_modules/redent": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
@ -6026,9 +6245,9 @@
}
},
"node_modules/rollup": {
"version": "4.17.1",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.17.1.tgz",
"integrity": "sha512-0gG94inrUtg25sB2V/pApwiv1lUb0bQ25FPNuzO89Baa+B+c0ccaaBKM5zkZV/12pUUdH+lWCSm9wmHqyocuVQ==",
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.17.2.tgz",
"integrity": "sha512-/9ClTJPByC0U4zNLowV1tMBe8yMEAxewtR3cUNX5BoEpGH3dQEWpJLr6CLp0fPdYRF/fzVOgvDb1zXuakwF5kQ==",
"dependencies": {
"@types/estree": "1.0.5"
},
@ -6040,22 +6259,22 @@
"npm": ">=8.0.0"
},
"optionalDependencies": {
"@rollup/rollup-android-arm-eabi": "4.17.1",
"@rollup/rollup-android-arm64": "4.17.1",
"@rollup/rollup-darwin-arm64": "4.17.1",
"@rollup/rollup-darwin-x64": "4.17.1",
"@rollup/rollup-linux-arm-gnueabihf": "4.17.1",
"@rollup/rollup-linux-arm-musleabihf": "4.17.1",
"@rollup/rollup-linux-arm64-gnu": "4.17.1",
"@rollup/rollup-linux-arm64-musl": "4.17.1",
"@rollup/rollup-linux-powerpc64le-gnu": "4.17.1",
"@rollup/rollup-linux-riscv64-gnu": "4.17.1",
"@rollup/rollup-linux-s390x-gnu": "4.17.1",
"@rollup/rollup-linux-x64-gnu": "4.17.1",
"@rollup/rollup-linux-x64-musl": "4.17.1",
"@rollup/rollup-win32-arm64-msvc": "4.17.1",
"@rollup/rollup-win32-ia32-msvc": "4.17.1",
"@rollup/rollup-win32-x64-msvc": "4.17.1",
"@rollup/rollup-android-arm-eabi": "4.17.2",
"@rollup/rollup-android-arm64": "4.17.2",
"@rollup/rollup-darwin-arm64": "4.17.2",
"@rollup/rollup-darwin-x64": "4.17.2",
"@rollup/rollup-linux-arm-gnueabihf": "4.17.2",
"@rollup/rollup-linux-arm-musleabihf": "4.17.2",
"@rollup/rollup-linux-arm64-gnu": "4.17.2",
"@rollup/rollup-linux-arm64-musl": "4.17.2",
"@rollup/rollup-linux-powerpc64le-gnu": "4.17.2",
"@rollup/rollup-linux-riscv64-gnu": "4.17.2",
"@rollup/rollup-linux-s390x-gnu": "4.17.2",
"@rollup/rollup-linux-x64-gnu": "4.17.2",
"@rollup/rollup-linux-x64-musl": "4.17.2",
"@rollup/rollup-win32-arm64-msvc": "4.17.2",
"@rollup/rollup-win32-ia32-msvc": "4.17.2",
"@rollup/rollup-win32-x64-msvc": "4.17.2",
"fsevents": "~2.3.2"
}
},
@ -6086,22 +6305,6 @@
"resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
},
"node_modules/sass": {
"version": "1.75.0",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.75.0.tgz",
"integrity": "sha512-ShMYi3WkrDWxExyxSZPst4/okE9ts46xZmJDSawJQrnte7M1V9fScVB+uNXOVKRBt0PggHOwoZcn8mYX4trnBw==",
"dependencies": {
"chokidar": ">=3.0.0 <4.0.0",
"immutable": "^4.0.0",
"source-map-js": ">=0.6.2 <2.0.0"
},
"bin": {
"sass": "sass.js"
},
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/saxes": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
@ -6199,6 +6402,16 @@
"node": ">=0.10.0"
}
},
"node_modules/source-map-support": {
"version": "0.5.13",
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
"integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
"dev": true,
"dependencies": {
"buffer-from": "^1.0.0",
"source-map": "^0.6.0"
}
},
"node_modules/sprintf-js": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
@ -6303,6 +6516,21 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/sugarss": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/sugarss/-/sugarss-4.0.1.tgz",
"integrity": "sha512-WCjS5NfuVJjkQzK10s8WOBY+hhDxxNt/N6ZaGwxFZ+wN3/lKKFSaaKUNecULcTTvE4urLcKaZFQD8vO0mOZujw==",
"engines": {
"node": ">=12.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/postcss/"
},
"peerDependencies": {
"postcss": "^8.3.3"
}
},
"node_modules/supports-color": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@ -6578,6 +6806,11 @@
"requires-port": "^1.0.0"
}
},
"node_modules/util-deprecate": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="
},
"node_modules/v8-to-istanbul": {
"version": "9.2.0",
"resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.2.0.tgz",

View file

@ -10,7 +10,9 @@
"preview": "vite preview"
},
"dependencies": {
"@csstools/postcss-relative-color-syntax": "^2.0.14",
"@fortawesome/fontawesome-free": "^6.5.2",
"@types/postcss-mixins": "^9.0.5",
"@types/web": "^0.0.143",
"@typescript-eslint/eslint-plugin": "^7.8.0",
"@typescript-eslint/parser": "^7.8.0",
@ -18,8 +20,10 @@
"cross-env": "^7.0.3",
"eslint": "^8.34.0",
"jest-environment-jsdom": "^29.7.0",
"normalize-scss": "^8.0.0",
"sass": "^1.75.0",
"normalize.css": "^8.0.1",
"postcss-mixins": "^10.0.1",
"postcss-nested": "^6.0.1",
"postcss-simple-vars": "^7.0.1",
"typescript": "^5.4",
"vite": "^5.2"
},

View file

@ -1,6 +1,10 @@
import fs from 'fs';
import path from 'path';
import autoprefixer from 'autoprefixer';
import postcssMixins from 'postcss-mixins';
import postcssNested from 'postcss-nested';
import postcssSimpleVars from 'postcss-simple-vars';
import postcssRelativeColor from '@csstools/postcss-relative-color-syntax';
import { defineConfig, UserConfig, ConfigEnv } from 'vite';
export default defineConfig(({ command }: ConfigEnv): UserConfig => {
@ -17,7 +21,7 @@ export default defineConfig(({ command }: ConfigEnv): UserConfig => {
const themeNames =
fs.readdirSync(path.resolve(__dirname, 'css/themes/')).map(name => {
const m = name.match(/([-a-z]+).scss/);
const m = name.match(/([-a-z]+).css/);
if (m) { return m[1]; }
return null;
@ -26,7 +30,7 @@ export default defineConfig(({ command }: ConfigEnv): UserConfig => {
const themes = new Map();
for (const name of themeNames) {
themes.set(`css/${name}`, `./css/themes/${name}.scss`);
themes.set(`css/${name}`, `./css/themes/${name}.css`);
}
return {
@ -50,7 +54,7 @@ export default defineConfig(({ command }: ConfigEnv): UserConfig => {
rollupOptions: {
input: {
'js/app': './js/app.js',
'css/application': './css/application.scss',
'css/application': './css/application.css',
...Object.fromEntries(themes)
},
output: {
@ -62,7 +66,7 @@ export default defineConfig(({ command }: ConfigEnv): UserConfig => {
},
css: {
postcss: {
plugins: [autoprefixer]
plugins: [postcssMixins(), postcssNested(), postcssSimpleVars, postcssRelativeColor(), autoprefixer]
}
}
};