Remove fallback colours

lucienimmink · Oct 31, 2023 · 6566612 · 6566612
1 parent de4eacf
commit 6566612
Show file tree

Hide file tree

Showing 18 changed files with 44 additions and 44 deletions.
diff --git a/index.html b/index.html
@@ -62,8 +62,8 @@
       body {
         margin: 0;
         padding: 0;
-        background: var(--background, #f8f9fa);
-        color: var(--text-color, #212529);
+        background: var(--background);
+        color: var(--text-color);
         font-family: firasans, system-ui, 'Segoe UI', Roboto, Helvetica, Arial,
           sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
         font-variant-ligatures: no-common-ligatures;
@@ -88,11 +88,11 @@
       }
 
       ::-webkit-scrollbar-track {
-        background-color: var(--progress-background, #f3f4f5);
+        background-color: var(--progress-background);
       }
 
       ::-webkit-scrollbar-thumb {
-        background-color: var(--progress, #00417A);
+        background-color: var(--progress);
       }
 
       ::-moz-selection {
@@ -134,7 +134,7 @@
         height: 4px;
         border-radius: 50%;
         animation: progress-bar-animation 3s infinite;
-        background-color: var(--primary, #00417A);
+        background-color: var(--primary);
       }
 
       .progress-circle:nth-child(2) {

diff --git a/src/styles/album-details.ts b/src/styles/album-details.ts
@@ -7,7 +7,7 @@ export default css`
   }
   .jumbotron {
     color: var(--text-color);
-    background: var(--background2, #f2f4f7);
+    background: var(--background2);
     padding: 1rem;
     overflow: hidden;
     transition: all 0.1s ease-in-out;
@@ -20,8 +20,8 @@ export default css`
     height: 125px;
     max-height: 125px;
     margin-right: 1rem;
-    border: 1px solid var(--background, #f3f4f5);
-    box-shadow: 0px 0px 1px var(--primary, #00417a);
+    border: 1px solid var(--background);
+    box-shadow: 0px 0px 1px var(--primary);
     transition: all 0.1s ease-in-out;
     view-transition-name: album-art;
   }

diff --git a/src/styles/controls.ts b/src/styles/controls.ts
@@ -22,13 +22,13 @@ export default css`
   }
   .controls .btn:hover,
   .controls .btn:focus {
-    color: var(--primary, #00417a);
+    color: var(--primary);
     outline: none;
   }
   .controls .btn:active,
   .controls .btn.active {
     border: 0;
-    background: var(--primary, #00417a);
+    background: var(--primary);
     color: var(--letter-color);
   }
   .controls .btn svg {

diff --git a/src/styles/header.ts b/src/styles/header.ts
@@ -44,7 +44,7 @@ export default css`
     padding-top: 8px;
   }
   app-link {
-    color: var(--primary, #00417a);
+    color: var(--primary);
     transition: color 0.2s ease-in-out;
     -webkit-app-region: no-drag;
     app-region: no-drag;

diff --git a/src/styles/headers.ts b/src/styles/headers.ts
@@ -3,11 +3,11 @@ import { css } from 'lit';
 export default css`
   .header {
     backdrop-filter: blur(2px);
-    background: var(--background-seethrough, rgba(248, 249, 250, 0.85));
+    background: var(--background-seethrough);
     box-sizing: border-box;
     height: 60px;
     border-top: 0;
-    border-bottom: 1px solid var(--primary, #00417a);
+    border-bottom: 1px solid var(--primary);
     transition: all 0.5s ease-in-out;
     padding: 1.85rem 1rem 0;
     position: sticky;
@@ -19,7 +19,7 @@ export default css`
   }
   .virtual-scroll .header {
     top: 0;
-    color: var(--primary, #00417a);
+    color: var(--primary);
     transition: none;
     cursor: pointer;
   }

diff --git a/src/styles/home.ts b/src/styles/home.ts
@@ -33,7 +33,7 @@ export default css`
     aspect-ratio: 1 / 1;
     height: 70px;
     border: 1px solid var(--background2);
-    box-shadow: 0px 0px 1px var(--primary, #00417a);
+    box-shadow: 0px 0px 1px var(--primary);
     background: rgba(255, 255, 255, 0.85);
   }
   ol .details {
@@ -55,7 +55,7 @@ export default css`
     font-family: system-ui;
   }
   ol .playing {
-    color: var(--primary, #00417a);
+    color: var(--primary);
     transition: color 0.2s ease-in-out;
   }
   li > div,
@@ -72,7 +72,7 @@ export default css`
     height: 17px;
     padding: 5px;
     color: var(--letter-color, #fff);
-    background: var(--primary, #00417a);
+    background: var(--primary);
     position: absolute;
     top: -8px;
     right: -1px;

diff --git a/src/styles/jumplist.ts b/src/styles/jumplist.ts
@@ -3,7 +3,7 @@ import { css } from 'lit';
 export default css`
   .jumplist {
     backdrop-filter: blur(2px);
-    background: var(--background-seethrough, #f8f9fa);
+    background: var(--background-seethrough);
     list-style: none;
     margin: 0;
     padding: 0;
@@ -33,7 +33,7 @@ export default css`
     padding: 4vh;
     font-size: 1.5rem;
     font-weight: 400;
-    color: var(--primary, #00417a);
+    color: var(--primary);
     transition: all 0.2s ease-in-out;
     text-decoration: none;
     display: block;

diff --git a/src/styles/loading-indicator.ts b/src/styles/loading-indicator.ts
@@ -20,7 +20,7 @@ export const loadingIndicator = css`
     height: 4px;
     border-radius: 50%;
     animation: progress-bar-animation 3s infinite;
-    background-color: var(--primary, #00417a);
+    background-color: var(--primary);
   }
   .progress-circle:nth-child(2) {
     animation-delay: 200ms;

diff --git a/src/styles/login.ts b/src/styles/login.ts
@@ -8,7 +8,7 @@ export default css`
     top: 50px;
   }
   .login {
-    background: var(--background, #f8f9fa);
+    background: var(--background);
     position: fixed;
     top: 0;
     left: 0;

diff --git a/src/styles/now-playing.ts b/src/styles/now-playing.ts
@@ -3,7 +3,7 @@ import { css } from 'lit';
 export default css`
   .wrapper {
     color: var(--text-color);
-    background: var(--background, #f8f9fa);
+    background: var(--background);
     position: fixed;
     top: 50px;
     left: 0;
@@ -29,7 +29,7 @@ export default css`
   }
   .top {
     backdrop-filter: blur(5px);
-    background: var(--background-seethrough, #f8f9fa);
+    background: var(--background-seethrough);
     z-index: 2;
     display: flex;
     flex-direction: column;
@@ -42,7 +42,7 @@ export default css`
   }
   .bottom {
     backdrop-filter: blur(5px);
-    background: var(--background-seethrough, #f8f9fa);
+    background: var(--background-seethrough);
     z-index: 1;
     display: block;
     position: absolute;
@@ -298,7 +298,7 @@ export default css`
       padding: 0;
       border: 1px solid var(--background2);
       background: rgba(255, 255, 255, 0.85);
-      box-shadow: 0px 0px 1px var(--primary, #00417a);
+      box-shadow: 0px 0px 1px var(--primary);
     }
     .smallArt canvas {
       height: calc(100vh - 50px);
@@ -321,7 +321,7 @@ export default css`
     font-weight: 400;
   }
   app-link {
-    color: var(--primary, #00417a);
+    color: var(--primary);
     transition: color 0.2s ease-in-out;
   }
   app-link .icon {
@@ -336,10 +336,10 @@ export default css`
     height: 6px;
   }
   ::-webkit-scrollbar-track {
-    background-color: var(--progress-background, #f3f4f5);
+    background-color: var(--progress-background);
   }
   ::-webkit-scrollbar-thumb {
-    background-color: var(--progress, #00417a);
+    background-color: var(--progress);
   }
   @media (min-width: 576px) {
     h3 {

diff --git a/src/styles/panel.ts b/src/styles/panel.ts
@@ -7,8 +7,8 @@ export default css`
     cursor: pointer;
     background-size: contain;
     position: relative;
-    border: 1px solid var(--background2, #f3f4f5);
-    box-shadow: 0px 0px 1px var(--primary, #00417a);
+    border: 1px solid var(--background2);
+    box-shadow: 0px 0px 1px var(--primary);
     box-sizing: border-box;
     transition: transform 0.15s ease-in-out;
   }

diff --git a/src/styles/player.ts b/src/styles/player.ts
@@ -34,7 +34,7 @@ export default css`
     transition: color 0.5s ease-in-out;
   }
   .details app-link {
-    color: var(--primary, #00417a);
+    color: var(--primary);
     transition: color 0.2s ease-in-out;
   }
   .art {

diff --git a/src/styles/playlists.ts b/src/styles/playlists.ts
@@ -35,7 +35,7 @@ export default css`
   }
   .playlists li app-link {
     display: flex;
-    color: var(--primary, #00417a);
+    color: var(--primary);
     transition: all 0.2s ease-in-out;
     text-decoration: none;
     align-items: center;
@@ -96,7 +96,7 @@ export default css`
   .playlist li.header:hover,
   .playlist li.no-hover:hover {
     backdrop-filter: blur(2px);
-    background: var(--background-seethrough, rgba(248, 249, 250, 0.85));
+    background: var(--background-seethrough);
   }
   .playlist .artist-selector {
     display: flex;

diff --git a/src/styles/progress-bar.ts b/src/styles/progress-bar.ts
@@ -5,11 +5,11 @@ export default css`
     height: 6px;
     cursor: pointer;
     position: relative;
-    background: var(--progress-background, #4dbbff);
+    background: var(--progress-background);
     overflow: hidden;
   }
   .progress-bar {
-    background: var(--primary, #00417a);
+    background: var(--primary);
     height: 6px;
     position: absolute;
     pointer-events: none;

diff --git a/src/styles/scrollbar.ts b/src/styles/scrollbar.ts
@@ -6,9 +6,9 @@ export default css`
     height: 6px;
   }
   ::-webkit-scrollbar-track {
-    background-color: var(--progress-background, #f3f4f5);
+    background-color: var(--progress-background);
   }
   ::-webkit-scrollbar-thumb {
-    background-color: var(--progress, #00417a);
+    background-color: var(--progress);
   }
 `;
diff --git a/src/styles/search.ts b/src/styles/search.ts
@@ -33,9 +33,9 @@ export default css`
     height: 50px;
     margin-right: 10px;
     flex-grow: 0;
-    border: 1px solid var(--background2, #f3f4f5);
+    border: 1px solid var(--background2);
     background: rgba(255, 255, 255, 0.85);
-    box-shadow: 0px 0px 1px var(--primary, #00417a);
+    box-shadow: 0px 0px 1px var(--primary);
   }
   .details {
     flex-grow: 1;

diff --git a/src/styles/side-nav.ts b/src/styles/side-nav.ts
@@ -6,10 +6,10 @@ export default css`
     height: 6px;
   }
   ::-webkit-scrollbar-track {
-    background-color: var(--progress-background, #f3f4f5);
+    background-color: var(--progress-background);
   }
   ::-webkit-scrollbar-thumb {
-    background-color: var(--progress, #00417a);
+    background-color: var(--progress);
   }
   ul {
     list-style: none;
@@ -127,15 +127,15 @@ export default css`
     width: 25px;
   }
   input {
-    border: 1px solid var(--primary, #00417a);
+    border: 1px solid var(--primary);
     padding: 8px 10px;
     display: block;
     width: 90%;
     margin: 8px 13px;
   }
   input:focus {
     border-radius: 0;
-    border: 1px solid var(--primary, #00417a);
+    border: 1px solid var(--primary);
   }
   @media (min-width: 576px) {
     input {

diff --git a/src/styles/virtual-scroll.ts b/src/styles/virtual-scroll.ts
@@ -35,7 +35,7 @@ export default css`
     flex-grow: 0;
     border: 1px solid var(--background2);
     background: rgba(255, 255, 255, 0.85);
-    box-shadow: 0px 0px 1px var(--primary, #00417a);
+    box-shadow: 0px 0px 1px var(--primary);
   }
   .details {
     flex-grow: 1;