From 5436473989f41bdfe3def97db296d944287c6a09 Mon Sep 17 00:00:00 2001
From: Casper Talvio <ctalvio@gmail.com>
Date: Sun, 30 May 2021 01:33:35 +0300
Subject: [PATCH] rounding fixes

---
 WIP.css                           | 307 ++++++++++++++++++++++++++++++
 presets/kaleidochromic_preset.css |  86 +--------
 presets/monochromic_preset.css    | 134 +------------
 presets/novachromic_preset.css    |  97 +---------
 rounding-circlehover.css          |   1 -
 5 files changed, 310 insertions(+), 315 deletions(-)
 create mode 100644 WIP.css

diff --git a/WIP.css b/WIP.css
new file mode 100644
index 0000000..9d35205
--- /dev/null
+++ b/WIP.css
@@ -0,0 +1,307 @@
+/*From Mono*/
+/*Modified item status progress bar, play and item menu buttons*/
+.innerCardFooter.fullInnerCardFooter.innerCardFooterClear {
+  border-radius: 0px !important; 
+  background: rgba(0,0,0,0.7);
+}
+
+.itemProgressBar {
+  height: 2000em;
+  background: #0000;
+}
+.playbackProgress>div {
+  background-color: rgba(255,255,255,0.75);
+}
+.transcodingProgress>div, .itemProgressBarForeground {
+  background-color: rgba(255,255,255,0.3);
+}
+
+.innerCardFooter.fullInnerCardFooter.innerCardFooterClear {
+  border-radius: 0px !important; 
+  background: rgba(0,0,0,0);
+}
+
+/*Some themeing for the dashboard*/
+
+#user_usage_report_table,
+.detailTable {
+    background: rgba(0,0,0,.5);
+}
+.detailTableBodyRow-shaded {
+    background: #0000 !important;
+}
+
+.infoBanner {
+    background: #101010;
+}
+.navMenuOptionText {
+    margin-top: 0;
+}
+.backgroundProgress > div {
+    background-color: #0000;
+}
+
+.visualCardBox, .cardImageContainer {
+  box-shadow: none;
+}
+
+.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__track {
+    background: rgba(120, 120, 120, 0.6);
+}
+.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__thumb {
+    background: white;
+}
+
+.dashboardSection h3 {
+  margin-left: 0.5em;
+}
+.sessionCardFooter {
+  border: none;
+}
+.paperList, 
+.visualCardBox {
+  background-color: rgba(0, 0, 0, 0.5);
+}
+.listItem-border {
+  border-color: rgba(255, 255, 255, 0) !important; 
+}
+fieldset {
+  border: 1px solid rgba(40, 40, 40, 0.8); 
+  border-radius: 0.4em;
+}
+
+/*Color theming*/
+
+/*Theme process progress ring*/
+.progressring-spiner {
+  border-color: rgba(var(--accent));
+  border-width: .35em;
+}
+.progressring {
+    margin: .4em;
+}
+.progressring-bg {
+   display: none;
+}
+
+
+/*Theme user setting tab buttons*/
+div[data-role="controlgroup"] a.ui-btn-active {
+	background: rgba(0, 0, 0, 0.5) !important;
+	color: white !important;
+}
+a[data-role="button"]:hover {
+    background: rgba(80, 80, 80, 0.8) !important;
+}
+
+div[data-role=controlgroup] a[data-role=button]+a[data-role=button] {
+	margin: 0 !important;
+}
+
+/*Theme media player*/
+
+.mdl-slider-background-lower {
+  background-color: rgb(255, 255, 255);
+}
+.mdl-slider::-moz-range-thumb {
+  background: rgb(255, 255, 255);
+}
+.mdl-slider::-ms-thumb {
+  background: rgb(255, 255, 255);
+}
+.mdl-slider::-webkit-slider-thumb {
+  background: rgb(255, 255, 255);
+}
+.iconOsdProgressInner {
+  background: rgb(255, 255, 255);
+}
+
+.videoOsdBottom {
+    background: rgba(0,0,0,.7);
+}
+.skinHeader-withBackground.osdHeader {
+    background: rgba(0,0,0,.7) !important;
+}
+
+/*Theme buttons and cards*/
+
+#itemDetailPage .button-link {color: inherit !important;}
+
+/*From Kaleido*/
+/*Cosmetic fixes for quirks (drop down padding and dialogue hover rounding)*/
+.detailTrackSelect {
+    padding-left: .2em !important;
+}
+@media all and (max-width: 100em){
+   .detailTrackSelect {
+     padding-left: .5em !important;
+  }
+}
+
+.actionSheetMenuItem:hover {
+  border-radius: 0 !important;
+}
+
+.itemsContainer>.card>.cardBox {
+   margin-left: 0.6em !important;
+}
+
+@media all and (min-width: 131.25em){
+  #castContent .cardScalable {
+    width: calc(6.3vw - 1.2em) !important; 
+    height: calc(6.3vw - 1.2em) !important;
+  }
+}
+@media all and (min-width: 120em) and (max-width: 131.25em){
+  #castContent .cardScalable {
+    width:  calc(6.4vw - 1.2em) !important; 
+    height: calc(6.4vw - 1.2em) !important;
+  }
+}
+@media all and (min-width: 100em) and (max-width: 120em){
+  #castContent .cardScalable {
+    width:  calc(7.6vw - 1.2em) !important; 
+    height: calc(7.6vw - 1.2em) !important;
+  }
+}
+@media all and (min-width: 87.5em) and (max-width: 100em){
+  #castContent .cardScalable {
+    width:  calc(9.3vw - 1.2em) !important; 
+    height: calc(9.3vw - 1.2em) !important;
+  }
+}
+@media all and (min-width: 75em) and (max-width: 87.5em){
+  #castContent .cardScalable {
+    width:  calc(10.5vw - 1.2em) !important; 
+    height: calc(10.5vw - 1.2em) !important;
+  }
+}
+@media all and (min-width: 50em) and (max-width: 75em){
+  #castContent .cardScalable {
+    width:  calc(15vw - 1.2em) !important; 
+    height: calc(15vw - 1.2em) !important;
+  }
+}
+@media all and (min-width: 43.75em) and (max-width: 50em){
+  #castContent .cardScalable {
+    width:  calc(20.1vw - 1.2em) !important; 
+    height: calc(20.1vw - 1.2em) !important;
+  }
+}
+@media all and (min-width: 25em) and (max-width: 43.75em){
+  #castContent .cardScalable {
+    width:  calc(31.2vw - 1.2em) !important; 
+    height: calc(31.2vw - 1.2em) !important;
+  }
+}
+@media all and (max-width: 25em){
+  #castContent .cardScalable {
+    width:  calc(40vw - 1.2em) !important;
+    height: calc(40vw - 1.2em) !important;
+  }
+}
+
+/*Style backdrop*/
+.backdropImage {
+  filter: blur(18px) saturate(120%) contrast(120%) brightness(40%);
+}
+@media all and (max-width: 32em) {
+  .itemBackdrop {
+    filter: blur(18px) saturate(120%) contrast(120%) brightness(40%);
+  }
+}
+
+/*From Nova*/
+/*Various themeing*/
+#itemDetailPage .emby-select-withcolor {
+  background-color: rgba(255, 255, 255, 0.2);
+}
+
+.pageTitleWithDefaultLogo {
+    background-image: url(../../jellyfin/web/assets/img/banner-dark.png);
+}
+
+.backdropImage {
+  filter: blur(22px) saturate(95%) contrast(15%) brightness(155%);
+}
+.infoBanner {
+    color: #000;
+    background: #eaeaea;
+}
+#indexPage .transcodingProgress > div, #indexPage .itemProgressBarForeground {
+    background-color: rgba(var(--accent),0.35);
+}
+
+/*Accenting*/
+
+.ratingbutton-icon-withrating,
+.playstatebutton-icon-played {
+	color: rgba(var(--accent)) !important;
+}
+
+.countIndicator {
+  background: rgba(var(--accent),0.8);
+}
+
+.button-flat:hover {
+	background: rgba(var(--accent),0.55);
+}
+.paper-icon-button-light:hover {
+  background-color: rgba(var(--accent),0.55) !important;
+}
+
+.raised,
+.fab,
+a[data-role="button"] {
+  background: rgba(var(--accent), 0.8) !important;
+	transition: all 0.2s !important;
+}
+
+.raised.homeLibraryButton {
+    box-shadow: none !important;
+    border: solid 1px rgba(var(--accent),0) !important;
+}
+.cardOverlayContainer:hover,
+.dialog,
+.toast,
+.raised.homeLibraryButton:hover {
+  box-shadow: none !important;
+  border: solid 1px rgba(var(--accent),0.6) !important;
+}
+.cardOverlayContainer {
+  border: solid 1px rgba(var(--accent),0.0) !important;
+}
+
+.emby-checkbox:checked + span + .checkboxOutline,
+.emby-input:focus,
+.emby-textarea:focus,
+.emby-select-withcolor:focus,
+.itemSelectionPanel {
+  background: rgba(var(--accent), 0.25) !important;
+}
+.checkboxIcon {
+    color: rgba(var(--accent));
+}
+
+/*Colors for loading spinner and other stuff*/
+.mdl-spinner__layer-1 {border-color: rgba(var(--accent), 1);}
+.mdl-spinner__layer-2 {border-color: rgba(var(--accent), .8);}
+.mdl-spinner__layer-3 {border-color: rgba(var(--accent), .6);}
+.mdl-spinner__layer-4 {border-color: rgba(var(--accent), .5);}
+
+
+.defaultCardBackground1 {
+	background-color: rgba(var(--accent), .5);
+}
+.defaultCardBackground2 {
+	background-color: rgba(var(--accent), .4);
+}
+.defaultCardBackground3 {
+	background-color: rgba(var(--accent), .8);
+}
+.defaultCardBackground4 {
+	background-color: rgba(var(--accent), .7);
+}
+.defaultCardBackground5 {
+	background-color: rgba(var(--accent), .6);
+}
\ No newline at end of file
diff --git a/presets/kaleidochromic_preset.css b/presets/kaleidochromic_preset.css
index 0e5b9e4..3de7246 100644
--- a/presets/kaleidochromic_preset.css
+++ b/presets/kaleidochromic_preset.css
@@ -10,88 +10,4 @@
 @import url('https://ctalvio.github.io/Ultrachromic/dialogues.css');
 
 :root {--accent: 98, 121, 205;}
-:root {--rounding: 12px;}
-
-
-/*Cosmetic fixes for quirks (drop down padding and dialogue hover rounding)*/
-.detailTrackSelect {
-    padding-left: .2em !important;
-}
-@media all and (max-width: 100em){
-   .detailTrackSelect {
-     padding-left: .5em !important;
-  }
-}
-
-.actionSheetMenuItem:hover {
-  border-radius: 0 !important;
-}
-
-.itemsContainer>.card>.cardBox {
-   margin-left: 0.6em !important;
-}
-
-@media all and (min-width: 131.25em){
-  #castContent .cardScalable {
-    width: calc(6.3vw - 1.2em) !important; 
-    height: calc(6.3vw - 1.2em) !important;
-  }
-}
-@media all and (min-width: 120em) and (max-width: 131.25em){
-  #castContent .cardScalable {
-    width:  calc(6.4vw - 1.2em) !important; 
-    height: calc(6.4vw - 1.2em) !important;
-  }
-}
-@media all and (min-width: 100em) and (max-width: 120em){
-  #castContent .cardScalable {
-    width:  calc(7.6vw - 1.2em) !important; 
-    height: calc(7.6vw - 1.2em) !important;
-  }
-}
-@media all and (min-width: 87.5em) and (max-width: 100em){
-  #castContent .cardScalable {
-    width:  calc(9.3vw - 1.2em) !important; 
-    height: calc(9.3vw - 1.2em) !important;
-  }
-}
-@media all and (min-width: 75em) and (max-width: 87.5em){
-  #castContent .cardScalable {
-    width:  calc(10.5vw - 1.2em) !important; 
-    height: calc(10.5vw - 1.2em) !important;
-  }
-}
-@media all and (min-width: 50em) and (max-width: 75em){
-  #castContent .cardScalable {
-    width:  calc(15vw - 1.2em) !important; 
-    height: calc(15vw - 1.2em) !important;
-  }
-}
-@media all and (min-width: 43.75em) and (max-width: 50em){
-  #castContent .cardScalable {
-    width:  calc(20.1vw - 1.2em) !important; 
-    height: calc(20.1vw - 1.2em) !important;
-  }
-}
-@media all and (min-width: 25em) and (max-width: 43.75em){
-  #castContent .cardScalable {
-    width:  calc(31.2vw - 1.2em) !important; 
-    height: calc(31.2vw - 1.2em) !important;
-  }
-}
-@media all and (max-width: 25em){
-  #castContent .cardScalable {
-    width:  calc(40vw - 1.2em) !important;
-    height: calc(40vw - 1.2em) !important;
-  }
-}
-
-/*Style backdrop*/
-.backdropImage {
-  filter: blur(18px) saturate(120%) contrast(120%) brightness(40%);
-}
-@media all and (max-width: 32em) {
-  .itemBackdrop {
-    filter: blur(18px) saturate(120%) contrast(120%) brightness(40%);
-  }
-}
\ No newline at end of file
+:root {--rounding: 12px;}
\ No newline at end of file
diff --git a/presets/monochromic_preset.css b/presets/monochromic_preset.css
index 90b9948..f1c215a 100644
--- a/presets/monochromic_preset.css
+++ b/presets/monochromic_preset.css
@@ -9,136 +9,4 @@
 @import url('https://ctalvio.github.io/Ultrachromic/fields.css');
 @import url('https://ctalvio.github.io/Ultrachromic/dialogues.css');
 
-:root {--rounding: 5px;}
-
-/*Modified item status progress bar, play and item menu buttons*/
-.innerCardFooter.fullInnerCardFooter.innerCardFooterClear {
-  border-radius: 0px !important; 
-  background: rgba(0,0,0,0.7);
-}
-
-.itemProgressBar {
-  height: 2000em;
-  background: #0000;
-}
-.playbackProgress>div {
-  background-color: rgba(255,255,255,0.75);
-}
-.transcodingProgress>div, .itemProgressBarForeground {
-  background-color: rgba(255,255,255,0.3);
-}
-
-.innerCardFooter.fullInnerCardFooter.innerCardFooterClear {
-  border-radius: 0px !important; 
-  background: rgba(0,0,0,0);
-}
-
-/*Some themeing for the dashboard*/
-
-#user_usage_report_table,
-.detailTable {
-    background: rgba(0,0,0,.5);
-}
-.detailTableBodyRow-shaded {
-    background: #0000 !important;
-}
-
-.infoBanner {
-    background: #101010;
-}
-.navMenuOptionText {
-    margin-top: 0;
-}
-.backgroundProgress > div {
-    background-color: #0000;
-}
-
-.visualCardBox, .cardImageContainer {
-  box-shadow: none;
-}
-
-.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__track {
-    background: rgba(120, 120, 120, 0.6);
-}
-.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__thumb {
-    background: white;
-}
-
-.dashboardSection h3 {
-  margin-left: 0.5em;
-}
-.sessionCardFooter {
-  border: none;
-}
-.paperList, 
-.visualCardBox {
-  background-color: rgba(0, 0, 0, 0.5);
-}
-.listItem-border {
-  border-color: rgba(255, 255, 255, 0) !important; 
-}
-fieldset {
-  border: 1px solid rgba(40, 40, 40, 0.8); 
-  border-radius: 0.4em;
-}
-
-/*Color theming*/
-
-/*Theme process progress ring*/
-.progressring-spiner {
-  border-color: rgba(var(--accent));
-  border-width: .35em;
-}
-.progressring {
-    margin: .4em;
-}
-.progressring-bg {
-   display: none;
-}
-
-
-/*Theme user setting tab buttons*/
-div[data-role="controlgroup"] a.ui-btn-active {
-	background: rgba(0, 0, 0, 0.5) !important;
-	color: white !important;
-}
-a[data-role="button"]:hover {
-    background: rgba(80, 80, 80, 0.8) !important;
-}
-
-div[data-role=controlgroup] a[data-role=button]+a[data-role=button] {
-	margin: 0 !important;
-}
-
-/*Theme media player*/
-
-.mdl-slider-background-lower {
-  background-color: rgb(255, 255, 255);
-}
-.mdl-slider::-moz-range-thumb {
-  background: rgb(255, 255, 255);
-}
-.mdl-slider::-ms-thumb {
-  background: rgb(255, 255, 255);
-}
-.mdl-slider::-webkit-slider-thumb {
-  background: rgb(255, 255, 255);
-}
-.iconOsdProgressInner {
-  background: rgb(255, 255, 255);
-}
-
-.videoOsdBottom {
-    background: rgba(0,0,0,.7);
-}
-.skinHeader-withBackground.osdHeader {
-    background: rgba(0,0,0,.7) !important;
-}
-
-/*Theme buttons and cards*/
-
-#itemDetailPage .button-link {color: inherit !important;}
-
-
-
-
+:root {--rounding: 5px;}
\ No newline at end of file
diff --git a/presets/novachromic_preset.css b/presets/novachromic_preset.css
index a26aa7e..22e7ecb 100644
--- a/presets/novachromic_preset.css
+++ b/presets/novachromic_preset.css
@@ -3,99 +3,4 @@
 @import url('https://ctalvio.github.io/Monochromic/improve-performance_style.css');
 
 :root {--accent: 255, 255, 255;}
-:root {--rounding: 0px;}
-
-	
-/*Various themeing*/
-#itemDetailPage .emby-select-withcolor {
-  background-color: rgba(255, 255, 255, 0.2);
-}
-
-.pageTitleWithDefaultLogo {
-    background-image: url(../../jellyfin/web/assets/img/banner-dark.png);
-}
-
-.backdropImage {
-  filter: blur(22px) saturate(95%) contrast(15%) brightness(155%);
-}
-.infoBanner {
-    color: #000;
-    background: #eaeaea;
-}
-#indexPage .transcodingProgress > div, #indexPage .itemProgressBarForeground {
-    background-color: rgba(var(--accent),0.35);
-}
-
-/*Accenting*/
-
-.ratingbutton-icon-withrating,
-.playstatebutton-icon-played {
-	color: rgba(var(--accent)) !important;
-}
-
-.countIndicator {
-  background: rgba(var(--accent),0.8);
-}
-
-.button-flat:hover {
-	background: rgba(var(--accent),0.55);
-}
-.paper-icon-button-light:hover {
-  background-color: rgba(var(--accent),0.55) !important;
-}
-
-.raised,
-.fab,
-a[data-role="button"] {
-  background: rgba(var(--accent), 0.8) !important;
-	transition: all 0.2s !important;
-}
-
-.raised.homeLibraryButton {
-    box-shadow: none !important;
-    border: solid 1px rgba(var(--accent),0) !important;
-}
-.cardOverlayContainer:hover,
-.dialog,
-.toast,
-.raised.homeLibraryButton:hover {
-  box-shadow: none !important;
-  border: solid 1px rgba(var(--accent),0.6) !important;
-}
-.cardOverlayContainer {
-  border: solid 1px rgba(var(--accent),0.0) !important;
-}
-
-.emby-checkbox:checked + span + .checkboxOutline,
-.emby-input:focus,
-.emby-textarea:focus,
-.emby-select-withcolor:focus,
-.itemSelectionPanel {
-  background: rgba(var(--accent), 0.25) !important;
-}
-.checkboxIcon {
-    color: rgba(var(--accent));
-}
-
-/*Colors for loading spinner and other stuff*/
-.mdl-spinner__layer-1 {border-color: rgba(var(--accent), 1);}
-.mdl-spinner__layer-2 {border-color: rgba(var(--accent), .8);}
-.mdl-spinner__layer-3 {border-color: rgba(var(--accent), .6);}
-.mdl-spinner__layer-4 {border-color: rgba(var(--accent), .5);}
-
-
-.defaultCardBackground1 {
-	background-color: rgba(var(--accent), .5);
-}
-.defaultCardBackground2 {
-	background-color: rgba(var(--accent), .4);
-}
-.defaultCardBackground3 {
-	background-color: rgba(var(--accent), .8);
-}
-.defaultCardBackground4 {
-	background-color: rgba(var(--accent), .7);
-}
-.defaultCardBackground5 {
-	background-color: rgba(var(--accent), .6);
-}
\ No newline at end of file
+:root {--rounding: 0px;}
\ No newline at end of file
diff --git a/rounding-circlehover.css b/rounding-circlehover.css
index 492eb4a..77b6db5 100644
--- a/rounding-circlehover.css
+++ b/rounding-circlehover.css
@@ -57,7 +57,6 @@ progress::-webkit-progress-value {
 .playedIndicator,
 .listItemIcon,
 .listItem-border,
-.button-flat,
 .visualCardBox,
 .checkboxOutline,
 .emby-select-withcolor,