New floating progress bar, glassy improvements

bottombarprogress.css

@@ -1,13 +1,11 @@
-.itemProgressBar {
-  height: 5px;
-  background: rgba(0,0,0,.5);
+#itemDetailPage .itemProgressBar,
+#indexPage .itemProgressBar{
+    height: 5px;
+    background: rgba(0, 0, 0, 0.45);
 }
-
-.playbackProgress>div, .itemProgressBarForeground {
-    background-color: rgba(var(--accent), 0.75) !important;
+.itemProgressBarForeground {
+    background-color: rgba(var(--accent),0.75);
 }
-
-.transcodingProgress>div {
-    background-color: rgba(var(--accent), 0.35) !important;
+.transcodingProgress > div {
+    background-color: rgba(var(--accent), 0.35);
 }
-

effects/glassy.css

@@ -1,6 +1,22 @@
 @supports (backdrop-filter: blur(15px)) {
-  .dialog, .mainDrawer, .toast, .appfooter {
+  .dialog,
+  .mainDrawer,
+  .toast,
+  .appfooter {
     backdrop-filter: blur(15px);
     background-color: rgba(0, 0, 0, 0.35);
   }
+  .paper-icon-button-light:hover,
+  #itemDetailPage .innerCardFooter,
+  #dashboardPage .backgroundProgress > div,
+  .cardOverlayButtonIcon {
+    backdrop-filter: blur(4px);
+  }
+  @media all and (max-width: 70em){
+    .cardOverlayButtonIcon {
+      background-color: rgba(0, 0, 0, 0.35) !important;
+    }
+  .indicator {
+    backdrop-filter: blur(2px);
+  }
 }

overlayprogress.css

@@ -1,9 +1,12 @@
-.itemProgressBar {
+#itemDetailPage .itemProgressBar,
+#indexPage .itemProgressBar {
     height: 2000em;
     background: #0000;
 }
-
 .innerCardFooter.fullInnerCardFooter.innerCardFooterClear {
-    background: rgba(0,0,0,0);
+  background: rgba(0,0,0,0);
 	margin: 0;
-}
+}
+.itemProgressBarForeground {
+    background-color: rgba(var(--accent), 0.35);
+}

progress/floating.css

@@ -0,0 +1,37 @@
+
+/*New progress bar*/
+#indexPage .innerCardFooterClear,
+#itemDetailPage .innerCardFooterClear {
+    background-color: transparent !important;
+    box-shadow: none;
+}
+#indexPage .itemProgressBarForeground,
+#itemDetailPage .itemProgressBarForeground,
+#indexPage .itemProgressBar,
+#itemDetailPage .itemProgressBar {
+    border-radius: var(--rounding);
+}
+#indexPage .itemProgressBarForeground,
+#itemDetailPage .itemProgressBarForeground  {
+    background-color: rgba(var(--accent), 0.95) !important;
+}
+#indexPage .itemProgressBar,
+#itemDetailPage .itemProgressBar {
+    height: 6px;
+    background: rgba(0,0,0,0.4);
+    margin: .5em .8em;
+}
+/*Accommodate play button on mobile*/
+@media all and (max-width: 100em){
+  #indexPage .itemProgressBar,
+  #itemDetailPage .itemProgressBar {
+    margin-right: 3.2em;
+  }
+}
+@supports (backdrop-filter: blur(15px)) {
+  #indexPage .itemProgressBar,
+  #itemDetailPage .itemProgressBar{
+    backdrop-filter: blur(4px);
+    background: rgba(0, 0, 0, 0.35) !important;
+  }
+}