💄 feat: I am so fucking smart (rainbowify-text with --rainbow-text & fallback)

This commit is contained in:
marleyrae 2023-06-06 21:27:03 -07:00
parent a90fd9b2f0
commit 3160b243b1
4 changed files with 16 additions and 3 deletions

File diff suppressed because one or more lines are too long

View file

@ -1,5 +1,6 @@
@use 'sass:list';
@use 'sass:math';
@use 'sass:selector';
@use 'theme';
@mixin flow($space: 1em) {
@ -12,9 +13,13 @@
$colors-length: list.length(theme.$text-colors);
@for $i from 1 through $colors-length {
:nth-child(#{$colors-length}n + #{$i} of #{$elem}) {
:nth-child(#{$colors-length}n + #{$i} of #{selector.parse($elem)}) {
@each $prop in $props {
#{$prop}: list.nth(theme.$text-colors, $i);
@if $prop == --rainbow-text {
--rainbow-text: #{list.nth(theme.$text-colors, $i)};
} @else {
#{$prop}: var(--rainbow-text, #{list.nth(theme.$text-colors, $i)});
}
}
}
}

View file

@ -8,6 +8,7 @@
/* base elements */
@forward 'base/Title';
@forward 'base/Link';
@forward 'base/List';
/* page-specific components */
@forward 'index/UpdateBox';

View file

@ -0,0 +1,7 @@
@use '../../mixins';
.List {
}
@include mixins.rainbowify-text('.List-item', --rainbow-text);