TheArchive/zitadel
1
0
Fork 0
mirror of https://github.com/zitadel/zitadel.git synced 2025-12-14 12:13:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

scss each loop, common tailwind config

Browse Source
This commit is contained in:
Max Peintner
2023-04-24 17:31:59 +02:00
parent 186fa17fe2
commit d1d54d2180
16 changed files with 242 additions and 1961 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
apps/login/styles/globals.scss
View File

@@ -20,46 +20,23 @@ html {
--dark-background-color: #000000;
}
.bg-background-light-300 {
background-color: var(--theme-light-background-300);
}
$types: "background", "primary", "warn", "text";
$shades: 50, 100, 200, 300, 400, 500, 600, 700, 800, 900;
.bg-background-light-400 {
background-color: var(--theme-light-background-400);
}
@each $type in $types {
@each $shade in $shades {
.bg-#{$type}-light-#{$shade} {
background-color: var(--theme-light-#{$type}-#{$shade}) !important;
}
.dark .dark\:bg-#{$type}-dark-#{$shade} {
background-color: var(--theme-dark-#{$type}-#{$shade}) !important;
}
.bg-background-light-500 {
background-color: var(--theme-light-background-500);
}
.bg-background-light-600 {
background-color: var(--theme-light-background-600);
}
.bg-background-light-700 {
background-color: var(--theme-light-background-700);
}
.bg-background-light-800 {
background-color: var(--theme-light-background-600);
}
.dark .dark\:bg-background-dark-400 {
background-color: var(--theme-dark-background-400) !important;
}
.dark .dark\:bg-background-dark-500 {
background-color: var(--theme-dark-background-500) !important;
}
.dark .dark\:bg-background-dark-600 {
background-color: var(--theme-dark-background-600) !important;
}
.dark .dark\:bg-background-dark-700 {
background-color: var(--theme-dark-background-700) !important;
}
.dark .dark\:bg-background-dark-800 {
background-color: var(--theme-dark-background-800) !important;
.text-#{$type}-light-#{$shade} {
color: var(--theme-light-#{$type}-#{$shade}) !important;
}
.dark .dark\:text-#{$type}-dark-#{$shade} {
color: var(--theme-dark-#{$type}-#{$shade}) !important;
}
}
}