Update style.css

style.css

@@ -1,3 +1,5 @@
+/* --- Variables --- */
+
 :root {
     --default-blue-1: #dc007d;
     --default-blue-2: #ef0d98;
@@ -10,8 +12,11 @@
     --card-background-3: #db0070;
     --card-background-4: #5c1c3a;
     --card-background-5: #a80051;
+    --rounding: 12px;
 }
 
+/* --- Colors --- */
+
 @media (hover: hover) and (pointer: fine) {
     .paper-icon-button-light:hover:not(:disabled) {
         color: var(--default-blue-1) !important;
@@ -279,4 +284,132 @@ div[data-role=controlgroup] a.ui-btn-active {
 
 .Mui-selected:hover {
     background-color: var(--translucent-hover-3) !important;
+}
+
+/* --- Rounded Corners --- */
+
+.detailButton {
+    border-radius: 50%;
+}
+
+progress {
+    border-radius: var(--rounding);
+}
+
+progress::-webkit-progress-bar {
+    border-radius: var(--rounding);
+}
+
+progress::-moz-progress-bar {
+    border-radius: var(--rounding);
+}
+
+progress::-webkit-progress-value {
+    border-radius: var(--rounding);
+}
+
+.taskProgressOuter,
+.taskProgressInner {
+    border-radius: var(--rounding) !important;
+}
+
+.formDialogHeader {
+    border-top-left-radius: var(--rounding);
+    border-top-right-radius: var(--rounding);
+}
+
+.formDialogFooter {
+    border-bottom-left-radius: var(--rounding);
+    border-bottom-right-radius: var(--rounding);
+}
+
+.cardOverlayContainer {
+    border-radius: var(--rounding) !important;
+}
+
+.missingIndicator,
+.unairedIndicator,
+.detailTable,
+.primaryImageWrapper>img,
+.toast,
+.paperList,
+.cardContent,
+.sessionNowPlayingInnerContent,
+.listItem:hover,
+.cardImage,
+.fab,
+.raised,
+.multiSelectCheckboxOutline,
+.itemSelectionPanel,
+.cardContent-button,
+.cardContent-shadow,
+.itemDetailImage,
+.cardImageContainer,
+.cardPadder,
+.listItemImage,
+.listItemImageButton,
+.listItemButton,
+.innerCardFooter,
+.blurhash-canvas,
+.dialog,
+.countIndicator,
+.playedIndicator,
+.listItemIcon,
+.listItem-border,
+.visualCardBox,
+.checkboxOutline,
+.emby-select-withcolor,
+.chapterThumbTextContainer,
+.chapterThumbContainer,
+.chapterThumb,
+.emby-input,
+.emby-textarea,
+.emby-select-withcolor,
+.nowPlayingPageImage,
+.upNextDialog-poster-img,
+.upNextContainer,
+.cardOverlayButtonIcon {
+    border-radius: var(--rounding) !important;
+}
+
+.osdPoster img {
+    border-radius: var(--rounding);
+    border: none;
+}
+
+.mdl-slider::-moz-range-thumb {
+    border-radius: var(--rounding);
+}
+
+.mdl-slider::-ms-thumb {
+    border-radius: var(--rounding);
+}
+
+.mdl-slider::-webkit-slider-thumb {
+    border-radius: var(--rounding);
+}
+
+div[data-role="controlgroup"] a[data-role="button"]:first-child {
+    border-bottom-left-radius: var(--rounding);
+    border-top-left-radius: var(--rounding);
+}
+
+div[data-role="controlgroup"] a[data-role="button"]:last-child {
+    border-bottom-right-radius: var(--rounding);
+    border-top-right-radius: var(--rounding);
+}
+
+#dashboardPage .cardContent,
+#dashboardPage .sessionNowPlayingInnerContent {
+    border-radius: var(--rounding) var(--rounding) 0 0 !important;
+}
+
+#divVirtualFolders .cardImageContainer,
+#divVirtualFolders .cardContent {
+    border-radius: var(--rounding) var(--rounding) 0 0 !important;
+}
+
+#userProfilesPage .cardImage,
+#userProfilesPage .cardContent {
+    border-radius: var(--rounding) var(--rounding) 0 0 !important;
 }