1
0
mirror of https://github.com/Sonarr/Sonarr.git synced 2026-04-25 22:46:31 -04:00

New: Native Theme Engine

Co-Authored-By: Zak Saunders <thezak48@users.noreply.github.com>
This commit is contained in:
Qstick
2021-11-20 17:15:30 -06:00
committed by Mark McDowall
parent e1de523c89
commit 2291f3e00e
139 changed files with 849 additions and 456 deletions
@@ -17,10 +17,10 @@ $hoverScale: 1.05;
composes: link from '~Components/Link/Link.css';
display: block;
color: $defaultColor;
color: var(--defaultColor);
&:hover {
color: $defaultColor;
color: var(--defaultColor);
text-decoration: none;
}
}
@@ -34,8 +34,8 @@ $hoverScale: 1.05;
height: 0;
border-width: 0 25px 25px 0;
border-style: solid;
border-color: transparent $dangerColor transparent transparent;
color: $white;
border-color: transparent var(--dangerColor) transparent transparent;
color: var(--white);
}
.info {
@@ -5,7 +5,7 @@
.container {
&:hover {
.content {
background-color: $tableRowHoverBackgroundColor;
background-color: var(--tableRowHoverBackgroundColor);
}
}
}
@@ -5,7 +5,7 @@ $hoverScale: 1.05;
&:hover {
z-index: 2;
box-shadow: 0 0 12px $black;
box-shadow: 0 0 12px var(--black);
transition: all 200ms ease-in;
.controls {
@@ -25,7 +25,7 @@ $hoverScale: 1.05;
position: relative;
display: block;
height: 70px;
background-color: $defaultColor;
background-color: var(--defaultColor);
}
.overlayTitle {
@@ -38,13 +38,13 @@ $hoverScale: 1.05;
padding: 5px;
width: 100%;
height: 100%;
color: $offWhite;
color: var(--offWhite);
text-align: center;
font-size: 20px;
}
.nextAiring {
background-color: #fafbfc;
background-color: var(--seriesBackgroundColor);
text-align: center;
font-size: $smallFontSize;
}
@@ -52,7 +52,7 @@ $hoverScale: 1.05;
.title {
@add-mixin truncate;
background-color: #fafbfc;
background-color: var(--seriesBackgroundColor);
text-align: center;
font-size: $smallFontSize;
}
@@ -66,8 +66,8 @@ $hoverScale: 1.05;
height: 0;
border-width: 0 25px 25px 0;
border-style: solid;
border-color: transparent $dangerColor transparent transparent;
color: $white;
border-color: transparent var(--dangerColor) transparent transparent;
color: var(--white);
}
.controls {
@@ -77,7 +77,7 @@ $hoverScale: 1.05;
z-index: 3;
border-radius: 4px;
background-color: #4f566f;
color: $white;
color: var(--white);
font-size: $smallFontSize;
opacity: 0;
transition: opacity 0;
@@ -1,5 +1,5 @@
.info {
background-color: #fafbfc;
background-color: var(--seriesBackgroundColor);
text-align: center;
font-size: $smallFontSize;
}
@@ -3,7 +3,7 @@
border-radius: 0;
background-color: #5b5b5b;
color: $white;
color: var(--white);
transition: width 200ms ease;
}
@@ -21,32 +21,32 @@
.continuing {
composes: legendItemColor;
background-color: $primaryColor;
background-color: var(--primaryColor);
}
.ended {
composes: legendItemColor;
background-color: $successColor;
background-color: var(--successColor);
}
.missingMonitored {
composes: legendItemColor;
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(#f05050 shade(5%)), color(#f05050 shade(5%)) 5px, color(#f05050 shade(15%)) 5px, color(#f05050 shade(15%)) 10px);
}
}
.missingUnmonitored {
composes: legendItemColor;
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, #ffa500, #ffa500 5px, color(#ffa500 tint(15%)) 5px, color(#ffa500 tint(15%)) 10px);
}
}
@@ -37,7 +37,7 @@
position: relative;
display: block;
height: 70px;
background-color: $defaultColor;
background-color: var(--defaultColor);
}
.bannerImage {
@@ -55,7 +55,7 @@
padding: 5px;
width: 100%;
height: 100%;
color: $offWhite;
color: var(--offWhite);
text-align: center;
font-size: 20px;
}
@@ -125,7 +125,7 @@
}
.ratings {
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 0 0 80px;
}