Recount-Server/web/sass/variables.scss
2024-01-15 19:26:51 -08:00

41 lines
1.4 KiB
SCSS

@use 'catppuccin';
@each $flavor, $color in catppuccin.$palette {
body.#{$flavor} {
--#{$prefix}-bg: #{map-get($color, 'base')};
--#{$prefix}-crust: #{map-get($color, 'crust')};
--#{$prefix}-mantle: #{map-get($color, 'mantle')};
--#{$prefix}-surface0: #{map-get($color, 'surface0')};
--#{$prefix}-surface1: #{map-get($color, 'surface1')};
--#{$prefix}-surface2: #{map-get($color, 'surface2')};
--#{$prefix}-overlay0: #{map-get($color, 'overlay0')};
--#{$prefix}-overlay1: #{map-get($color, 'overlay1')};
--#{$prefix}-overlay2: #{map-get($color, 'overlay2')};
--#{$prefix}-text: #{map-get($color, 'text')};
--#{$prefix}-green: #{map-get($color, 'green')};
--#{$prefix}-red: #{map-get($color, 'red')};
--#{$prefix}-nav-bg: #{map-get($color, 'crust')};
--#{$prefix}-nav-color: #{map-get($color, 'text')};
--#{$prefix}-nav-logo-bg: #{map-get($color, 'rosewater')};
--#{$prefix}-nav-hover: #{map-get($color, 'surface2')};
--#{$prefix}-nav-active-bg: #{map-get($color, 'mauve')};
--#{$prefix}-nav-active-color: #{map-get($color, 'base')};
}
}
.c-text {
color: var(--#{$prefix}-text);
}
.c-s0 {
background-color: var(--#{$prefix}-surface0);
}
.c-s1 {
background-color: var(--#{$prefix}-surface1);
}
.c-crust {
background-color: var(--#{$prefix}-crust);
}
.c-mantle {
background-color: var(--#{$prefix}-mantle);
}