mirror of
https://github.com/Prowlarr/Prowlarr.git
synced 2026-04-22 22:34:53 -04:00
New: Move to CSS Variables for Colorings
This commit is contained in:
@@ -14,13 +14,13 @@
|
||||
width: 0;
|
||||
height: 100%;
|
||||
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
|
||||
color: $white;
|
||||
color: var(--white);
|
||||
transition: width 0.6s ease;
|
||||
}
|
||||
|
||||
.frontTextContainer {
|
||||
z-index: 1;
|
||||
color: $white;
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
.backTextContainer,
|
||||
@@ -42,39 +42,35 @@
|
||||
}
|
||||
|
||||
.primary {
|
||||
background-color: $primaryColor;
|
||||
background-color: var(--primaryColor);
|
||||
}
|
||||
|
||||
.danger {
|
||||
background-color: $dangerColor;
|
||||
background-color: var(--dangerColor);
|
||||
|
||||
&:global(.colorImpaired) {
|
||||
background: repeating-linear-gradient(90deg, color($dangerColor shade(5%)), color($dangerColor shade(5%)) 5px, color($dangerColor shade(15%)) 5px, color($dangerColor shade(15%)) 10px);
|
||||
background: repeating-linear-gradient(90deg, color(var(--dangerColor) shade(5%)), color(var(--dangerColor) shade(5%)) 5px, color(var(--dangerColor) shade(15%)) 5px, color(var(--dangerColor) shade(15%)) 10px);
|
||||
}
|
||||
}
|
||||
|
||||
.success {
|
||||
background-color: $successColor;
|
||||
background-color: var(--successColor);
|
||||
}
|
||||
|
||||
.purple {
|
||||
background-color: $purple;
|
||||
background-color: var(--purple);
|
||||
}
|
||||
|
||||
.warning {
|
||||
background-color: $warningColor;
|
||||
background-color: var(--warningColor);
|
||||
|
||||
&:global(.colorImpaired) {
|
||||
background: repeating-linear-gradient(45deg, $warningColor, $warningColor 5px, color($warningColor tint(15%)) 5px, color($warningColor tint(15%)) 10px);
|
||||
background: repeating-linear-gradient(45deg, var(--warningColor), var(--warningColor) 5px, color(var(--warningColor) tint(15%)) 5px, color(var(--warningColor) tint(15%)) 10px);
|
||||
}
|
||||
}
|
||||
|
||||
.info {
|
||||
background-color: $infoColor;
|
||||
}
|
||||
|
||||
.queue {
|
||||
background-color: $queueColor;
|
||||
background-color: var(--infoColor);
|
||||
}
|
||||
|
||||
.small {
|
||||
|
||||
Reference in New Issue
Block a user