diff --git a/src/components/cardbuilder/card.css b/src/components/cardbuilder/card.css index e63b9a4bb1..5520ce2c7e 100644 --- a/src/components/cardbuilder/card.css +++ b/src/components/cardbuilder/card.css @@ -18,7 +18,6 @@ button { padding: 0; display: block; color: inherit !important; - -webkit-tap-highlight-color: rgba(0,0,0,0); outline: none !important; cursor: pointer; contain: layout style; @@ -80,10 +79,9 @@ button { margin: 0.6em; transition: none; border: 0 solid transparent; - /* These both are needed in case cardBox is a button */ - -webkit-tap-highlight-color: rgba(0,0,0,0); outline: none !important; - contain: layout style; + contain: layout; + contain: style; } .card.show-focus:not(.show-animation) .cardBox { @@ -148,7 +146,6 @@ button { background-size: cover; background-repeat: no-repeat; background-position: center center; - display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -182,7 +179,6 @@ button { margin: 0 !important; /* Needed in safari */ height: 100%; - -webkit-tap-highlight-color: rgba(0,0,0,0); outline: none !important; contain: strict; } @@ -346,7 +342,6 @@ button { border: 0 !important; padding: 0 !important; cursor: pointer; - -webkit-tap-highlight-color: rgba(0,0,0,0); outline: none !important; color: inherit; vertical-align: middle; diff --git a/src/components/dialogHelper/dialoghelper.css b/src/components/dialogHelper/dialoghelper.css index 2cc20b5ff2..aa4145e016 100644 --- a/src/components/dialogHelper/dialoghelper.css +++ b/src/components/dialogHelper/dialoghelper.css @@ -16,7 +16,6 @@ .dialog { margin: 0; border-radius: .2em; - -webkit-font-smoothing: antialiased; border: 0; padding: 0; will-change: transform, opacity; diff --git a/src/components/emby-button/emby-button.css b/src/components/emby-button/emby-button.css index 0273de9d7d..38d62b1299 100644 --- a/src/components/emby-button/emby-button.css +++ b/src/components/emby-button/emby-button.css @@ -9,9 +9,6 @@ font-family: inherit; color: inherit; outline-width: 0; - -moz-user-select: none; - -ms-user-select: none; - -webkit-user-select: none; user-select: none; cursor: pointer; z-index: 0; @@ -24,8 +21,6 @@ outline: none !important; position: relative; font-weight: 600; - /* Disable webkit tap highlighting */ - -webkit-tap-highlight-color: rgba(0,0,0,0); text-decoration: none; /* Not crazy about this but it normalizes heights between anchors and buttons */ line-height: 1.35; @@ -99,9 +94,6 @@ font-size: inherit; font-family: inherit; color: inherit; - -moz-user-select: none; - -ms-user-select: none; - -webkit-user-select: none; user-select: none; cursor: pointer; z-index: 0; @@ -118,8 +110,6 @@ position: relative; overflow: hidden; border-radius: 50%; - /* Disable webkit tap highlighting */ - -webkit-tap-highlight-color: rgba(0,0,0,0); justify-content: center; transform-origin: center; transition: 0.2s; diff --git a/src/components/emby-checkbox/emby-checkbox.css b/src/components/emby-checkbox/emby-checkbox.css index 5641893f63..4e27928e2a 100644 --- a/src/components/emby-checkbox/emby-checkbox.css +++ b/src/components/emby-checkbox/emby-checkbox.css @@ -38,9 +38,6 @@ margin: 0; padding: 0; opacity: 0; - -ms-appearance: none; - -moz-appearance: none; - -webkit-appearance: none; appearance: none; border: none; } @@ -115,7 +112,7 @@ margin-bottom: .25em; } -@-webkit-keyframes repaintChrome { +@keyframes repaintChrome { from { padding: 0; } diff --git a/src/components/emby-input/emby-input.css b/src/components/emby-input/emby-input.css index d888eb570d..57a46ec7b6 100644 --- a/src/components/emby-input/emby-input.css +++ b/src/components/emby-input/emby-input.css @@ -10,10 +10,8 @@ font-weight: inherit; padding: .4em .25em; /* Prevent padding from causing width overflow */ - -webkit-box-sizing: border-box; box-sizing: border-box; outline: none !important; - -webkit-tap-highlight-color: rgba(0,0,0,0); width: 100%; } @@ -35,6 +33,5 @@ } .emby-input-iconbutton { - -webkit-align-self: flex-end; align-self: flex-end; } diff --git a/src/components/emby-radio/emby-radio.css b/src/components/emby-radio/emby-radio.css index 25fdc5b933..6b8575bc86 100644 --- a/src/components/emby-radio/emby-radio.css +++ b/src/components/emby-radio/emby-radio.css @@ -27,9 +27,6 @@ margin: 0; padding: 0; opacity: 0; - -ms-appearance: none; - -moz-appearance: none; - -webkit-appearance: none; appearance: none; border: none; } @@ -70,17 +67,13 @@ cursor: pointer; transition-duration: 0.28s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-property: -webkit-transform; transition-property: transform; - transition-property: transform, -webkit-transform; - -webkit-transform: scale3d(0, 0, 0); transform: scale3d(0, 0, 0); border-radius: 50%; background: #00a4dc; } .mdl-radio__button:checked + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle { - -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } diff --git a/src/components/emby-select/emby-select.css b/src/components/emby-select/emby-select.css index 76b28c4208..4aff8cab92 100644 --- a/src/components/emby-select/emby-select.css +++ b/src/components/emby-select/emby-select.css @@ -12,7 +12,6 @@ /* Prevent padding from causing width overflow */ box-sizing: border-box; outline: none !important; - -webkit-tap-highlight-color: rgba(0,0,0,0); width: 100%; } @@ -20,8 +19,6 @@ background: none !important; border-color: transparent !important; color: inherit !important; - -webkit-appearance: none; - -moz-appearance: none; appearance: none; } @@ -41,7 +38,6 @@ .emby-select-focusscale { transition: transform 180ms ease-out !important; - -webkit-transform-origin: center center; transform-origin: center center; } @@ -77,7 +73,6 @@ } .emby-select-withcolor { - -webkit-appearance: none; appearance: none; border-radius: .2em; } diff --git a/src/components/emby-slider/emby-slider.css b/src/components/emby-slider/emby-slider.css index b173f5c511..50021fdb51 100644 --- a/src/components/emby-slider/emby-slider.css +++ b/src/components/emby-slider/emby-slider.css @@ -1,31 +1,21 @@ _:-ms-input-placeholder { - -ms-appearance: none; + appearance: none; height: 2.223em; margin: 0; } .mdl-slider { width: 100%; - -webkit-appearance: none; - -moz-appearance: none; - -ms-appearance: none; appearance: none; height: 150%;/*150% is needed, else ie and edge won't display the thumb properly*/ background: transparent; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; outline: 0; color: #00a4dc; - -webkit-align-self: center; - -ms-flex-item-align: center; align-self: center; z-index: 1; cursor: pointer; margin: 0; - /* Disable webkit tap highlighting */ - -webkit-tap-highlight-color: rgba(0,0,0,0); display: block; } @@ -69,7 +59,7 @@ _:-ms-input-placeholder { } .mdl-slider::-webkit-slider-thumb { - -webkit-appearance: none; + appearance: none; width: 1.2em; height: 1.2em; box-sizing: border-box; @@ -108,7 +98,7 @@ _:-ms-input-placeholder { } .mdl-slider::-ms-thumb { - -webkit-appearance: none; + appearance: none; width: 1.8em; height: 1.8em; box-sizing: border-box; diff --git a/src/components/emby-textarea/emby-textarea.css b/src/components/emby-textarea/emby-textarea.css index 6ac8262236..0dab1b1ece 100644 --- a/src/components/emby-textarea/emby-textarea.css +++ b/src/components/emby-textarea/emby-textarea.css @@ -13,7 +13,6 @@ /* Prevent padding from causing width overflow */ box-sizing: border-box; outline: none !important; - -webkit-tap-highlight-color: rgba(0,0,0,0); width: 100%; } diff --git a/src/components/emby-toggle/emby-toggle.css b/src/components/emby-toggle/emby-toggle.css index fb91419cbc..3b14b8cf09 100644 --- a/src/components/emby-toggle/emby-toggle.css +++ b/src/components/emby-toggle/emby-toggle.css @@ -9,10 +9,6 @@ margin: 0; padding: 0; overflow: visible; - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; flex-direction: row-reverse; justify-content: flex-end; @@ -28,9 +24,6 @@ margin: 0; padding: 0; opacity: 0; - -ms-appearance: none; - -moz-appearance: none; - -webkit-appearance: none; appearance: none; border: none; } @@ -89,7 +82,6 @@ position: absolute; top: 50%; left: 50%; - -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: inline-block; box-sizing: border-box; diff --git a/src/components/filterdialog/style.css b/src/components/filterdialog/style.css index 5daf6eb38c..69a82d2408 100644 --- a/src/components/filterdialog/style.css +++ b/src/components/filterdialog/style.css @@ -5,7 +5,6 @@ margin-top: 0 !important; margin-bottom: 0 !important; margin-right: 0 !important; - -webkit-border-radius: 0 !important; border-radius: 0 !important; max-height: none !important; max-width: none !important diff --git a/src/components/homesections/homesections.css b/src/components/homesections/homesections.css index 45df67c482..5df2440f82 100644 --- a/src/components/homesections/homesections.css +++ b/src/components/homesections/homesections.css @@ -13,13 +13,11 @@ .homeLibraryIcon { margin-left: .5em; margin-right: .5em; - -webkit-flex-shrink: 0; flex-shrink: 0 } .homeLibraryText { white-space: nowrap; - -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden } diff --git a/src/components/htmlvideoplayer/style.css b/src/components/htmlvideoplayer/style.css index 9550f2c873..ed7b6d126e 100644 --- a/src/components/htmlvideoplayer/style.css +++ b/src/components/htmlvideoplayer/style.css @@ -38,7 +38,6 @@ video::-webkit-media-controls { .htmlvideoplayer::cue { background-color: transparent; text-shadow: 0.14em 0.14em 0.14em rgba(0, 0, 0, 1); - -webkit-font-smoothing: antialiased; font-family: inherit; } diff --git a/src/components/images/style.css b/src/components/images/style.css index 5cf39c1e4b..06fbf1f9cf 100644 --- a/src/components/images/style.css +++ b/src/components/images/style.css @@ -18,21 +18,9 @@ .lazy-image-fadein { opacity: 0; - -webkit-animation-duration: .8s; - -moz-animation-duration: .8s; - -o-animation-duration: .8s; animation-duration: .8s; - -webkit-animation-name: popInAnimation; - -moz-animation-name: popInAnimation; - -o-animation-name: popInAnimation; animation-name: popInAnimation; - -webkit-animation-fill-mode: forwards; - -moz-animation-fill-mode: forwards; - -o-animation-fill-mode: forwards; animation-fill-mode: forwards; - -webkit-animation-timing-function: cubic-bezier(0,0,.5,1); - -moz-animation-timing-function: cubic-bezier(0,0,.5,1); - -o-animation-timing-function: cubic-bezier(0,0,.5,1); animation-timing-function: cubic-bezier(0,0,.5,1); } diff --git a/src/components/indicators/indicators.css b/src/components/indicators/indicators.css index c2d089e1af..b0d0119c05 100644 --- a/src/components/indicators/indicators.css +++ b/src/components/indicators/indicators.css @@ -14,7 +14,6 @@ .indicator { border-radius: 100em; - display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -43,7 +42,6 @@ .countIndicator { border-radius: 100em; - display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -55,7 +53,6 @@ .playedIndicator { border-radius: 100em; - display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -67,7 +64,6 @@ .videoIndicator { background: #444; border-radius: 100em; - display: -webkit-flex; display: flex; align-items: center; justify-content: center; diff --git a/src/components/loading/loading.css b/src/components/loading/loading.css index 6d8472fc15..e3f10c0e2e 100644 --- a/src/components/loading/loading.css +++ b/src/components/loading/loading.css @@ -7,20 +7,11 @@ .mdlSpinnerActive { display: inline-block; - -webkit-animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite; animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite; } -@-webkit-keyframes mdl-spinner__container-rotate { - to { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - @keyframes mdl-spinner__container-rotate { to { - -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @@ -37,7 +28,6 @@ } .mdl-spinner__layer-1-active { - -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } @@ -46,7 +36,6 @@ } .mdl-spinner__layer-2-active { - -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } @@ -55,7 +44,6 @@ } .mdl-spinner__layer-3-active { - -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } @@ -64,90 +52,39 @@ } .mdl-spinner__layer-4-active { - -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } -@-webkit-keyframes mdl-spinner__fill-unfill-rotate { - 12.5% { - -webkit-transform: rotate(135deg); - transform: rotate(135deg); - } - - 25% { - -webkit-transform: rotate(270deg); - transform: rotate(270deg); - } - - 37.5% { - -webkit-transform: rotate(405deg); - transform: rotate(405deg); - } - - 50% { - -webkit-transform: rotate(540deg); - transform: rotate(540deg); - } - - 62.5% { - -webkit-transform: rotate(675deg); - transform: rotate(675deg); - } - - 75% { - -webkit-transform: rotate(810deg); - transform: rotate(810deg); - } - - 87.5% { - -webkit-transform: rotate(945deg); - transform: rotate(945deg); - } - - to { - -webkit-transform: rotate(1080deg); - transform: rotate(1080deg); - } -} - @keyframes mdl-spinner__fill-unfill-rotate { 12.5% { - -webkit-transform: rotate(135deg); transform: rotate(135deg); } 25% { - -webkit-transform: rotate(270deg); transform: rotate(270deg); } 37.5% { - -webkit-transform: rotate(405deg); transform: rotate(405deg); } 50% { - -webkit-transform: rotate(540deg); transform: rotate(540deg); } 62.5% { - -webkit-transform: rotate(675deg); transform: rotate(675deg); } 75% { - -webkit-transform: rotate(810deg); transform: rotate(810deg); } 87.5% { - -webkit-transform: rotate(945deg); transform: rotate(945deg); } to { - -webkit-transform: rotate(1080deg); transform: rotate(1080deg); } } @@ -161,32 +98,6 @@ * - https://github.com/Polymer/paper-spinner/issues/9 * - https://code.google.com/p/chromium/issues/detail?id=436255 */ -@-webkit-keyframes mdl-spinner__layer-1-fade-in-out { - from { - opacity: 0.99; - } - - 25% { - opacity: 0.99; - } - - 26% { - opacity: 0; - } - - 89% { - opacity: 0; - } - - 90% { - opacity: 0.99; - } - - 100% { - opacity: 0.99; - } -} - @keyframes mdl-spinner__layer-1-fade-in-out { from { opacity: 0.99; @@ -213,28 +124,6 @@ } } -@-webkit-keyframes mdl-spinner__layer-2-fade-in-out { - from { - opacity: 0; - } - - 15% { - opacity: 0; - } - - 25% { - opacity: 0.99; - } - - 50% { - opacity: 0.99; - } - - 51% { - opacity: 0; - } -} - @keyframes mdl-spinner__layer-2-fade-in-out { from { opacity: 0; @@ -257,28 +146,6 @@ } } -@-webkit-keyframes mdl-spinner__layer-3-fade-in-out { - from { - opacity: 0; - } - - 40% { - opacity: 0; - } - - 50% { - opacity: 0.99; - } - - 75% { - opacity: 0.99; - } - - 76% { - opacity: 0; - } -} - @keyframes mdl-spinner__layer-3-fade-in-out { from { opacity: 0; @@ -301,28 +168,6 @@ } } -@-webkit-keyframes mdl-spinner__layer-4-fade-in-out { - from { - opacity: 0; - } - - 65% { - opacity: 0; - } - - 75% { - opacity: 0.99; - } - - 90% { - opacity: 0.99; - } - - 100% { - opacity: 0; - } -} - @keyframes mdl-spinner__layer-4-fade-in-out { from { opacity: 0; @@ -366,7 +211,6 @@ border-color: inherit; border-bottom-color: transparent !important; border-radius: 50%; - -webkit-animation: none; animation: none; position: absolute; top: 0; @@ -377,91 +221,47 @@ .mdl-spinner__circleLeft { border-right-color: transparent !important; - -webkit-transform: rotate(129deg); transform: rotate(129deg); } .mdl-spinner__circleLeft-active { - -webkit-animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .mdl-spinner__circleRight { left: -100%; border-left-color: transparent !important; - -webkit-transform: rotate(-129deg); transform: rotate(-129deg); } .mdl-spinner__circleRight-active { - -webkit-animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } -@-webkit-keyframes mdl-spinner__left-spin { - from { - -webkit-transform: rotate(130deg); - transform: rotate(130deg); - } - - 50% { - -webkit-transform: rotate(-5deg); - transform: rotate(-5deg); - } - - to { - -webkit-transform: rotate(130deg); - transform: rotate(130deg); - } -} - @keyframes mdl-spinner__left-spin { from { - -webkit-transform: rotate(130deg); transform: rotate(130deg); } 50% { - -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { - -webkit-transform: rotate(130deg); transform: rotate(130deg); } } -@-webkit-keyframes mdl-spinner__right-spin { - from { - -webkit-transform: rotate(-130deg); - transform: rotate(-130deg); - } - - 50% { - -webkit-transform: rotate(5deg); - transform: rotate(5deg); - } - - to { - -webkit-transform: rotate(-130deg); - transform: rotate(-130deg); - } -} - @keyframes mdl-spinner__right-spin { from { - -webkit-transform: rotate(-130deg); transform: rotate(-130deg); } 50% { - -webkit-transform: rotate(5deg); transform: rotate(5deg); } to { - -webkit-transform: rotate(-130deg); transform: rotate(-130deg); } } diff --git a/src/components/navdrawer/navdrawer.css b/src/components/navdrawer/navdrawer.css index f774c6919f..5d63e150d1 100644 --- a/src/components/navdrawer/navdrawer.css +++ b/src/components/navdrawer/navdrawer.css @@ -9,29 +9,20 @@ .touch-menu-la { background-color: #FFF; will-change: transform; - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-transition: -webkit-transform ease-out 40ms, left ease-out 260ms; - -o-transition: transform ease-out 40ms, left ease-out 260ms; transition: transform ease-out 40ms, left ease-out 260ms; z-index: 1099 } .touch-menu-la.transition { - -webkit-transition: -webkit-transform ease-out 240ms, left ease-out 260ms; - -o-transition: transform ease-out 240ms, left ease-out 260ms; transition: transform ease-out 240ms, left ease-out 260ms } .drawer-open { - -webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, .4); box-shadow: 2px 0 12px rgba(0, 0, 0, .4) } .scrollContainer { - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1 } @@ -41,8 +32,6 @@ background-color: #000; opacity: 0; z-index: 1098; - -webkit-transition: opacity ease-in-out .38s, visibility ease-in-out .38s; - -o-transition: opacity ease-in-out .38s, visibility ease-in-out .38s; transition: opacity ease-in-out .38s, visibility ease-in-out .38s; will-change: opacity; background-color: rgba(0, 0, 0, .3) diff --git a/src/components/remotecontrol/remotecontrol.css b/src/components/remotecontrol/remotecontrol.css index 0b6a2dbbc5..76d4f834e2 100644 --- a/src/components/remotecontrol/remotecontrol.css +++ b/src/components/remotecontrol/remotecontrol.css @@ -1,10 +1,5 @@ .nowPlayingInfoContainer { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -webkit-flex-direction: row; flex-direction: row } @@ -21,27 +16,20 @@ } .nowPlayingInfoButtons { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; - -webkit-flex-wrap: wrap; flex-wrap: wrap } .nowPlayingInfoControls, .nowPlayingTime { - display: -webkit-box; - display: -webkit-flex + display: flex; } .nowPlayingPageImageContainer { width: 20%; margin-right: .25em; position: relative; - -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -52,16 +40,9 @@ } .nowPlayingInfoControls { - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1; display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -webkit-flex-direction: column; flex-direction: column; - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center } @@ -70,25 +51,15 @@ left: 0; right: 0; width: 100%; - -webkit-box-shadow: 0 0 1.9vh #000; box-shadow: 0 0 1.9vh #000; border: .1em solid #222; user-drag: none; user-select: none; - -moz-user-select: none; - -webkit-user-drag: none; - -webkit-user-select: none; - -ms-user-select: none } @media all and (orientation:portrait) and (max-width:50em) { .nowPlayingInfoContainer { - -webkit-box-orient: vertical !important; - -webkit-box-direction: normal !important; - -webkit-flex-direction: column !important; flex-direction: column !important; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center } @@ -102,8 +73,6 @@ } .nowPlayingInfoButtons { - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center } @@ -131,33 +100,20 @@ .nowPlayingTime { display: flex; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; margin: 0 1em } .nowPlayingSecondaryButtons { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; - -webkit-flex-wrap: wrap; flex-wrap: wrap; - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center } @media all and (min-width:50em) { .nowPlayingSecondaryButtons { - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1; - -webkit-box-pack: end; - -webkit-justify-content: flex-end; justify-content: flex-end } } @@ -174,13 +130,11 @@ .smallBackdropPosterItem .cardOverlayInner>div { white-space: nowrap; - -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden } .playlistIndexIndicatorImage { - -webkit-background-size: initial initial !important; background-size: initial !important; background-image: url(../../img/equalizer.gif) !important; } diff --git a/src/components/slideshow/style.css b/src/components/slideshow/style.css index 43211a8fef..1167a972c8 100644 --- a/src/components/slideshow/style.css +++ b/src/components/slideshow/style.css @@ -41,9 +41,6 @@ height: auto; max-width: 100%; max-height: 100%; - -ms-transform: translate(-50%, -50%); - -webkit-transform: translate(-50%, -50%); - -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; left: 50%; diff --git a/src/components/subtitlesync/subtitlesync.css b/src/components/subtitlesync/subtitlesync.css index 112e624722..38a15be901 100644 --- a/src/components/subtitlesync/subtitlesync.css +++ b/src/components/subtitlesync/subtitlesync.css @@ -40,8 +40,6 @@ margin-right: 1%; top: 2.5em; height: 1.4em; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1; border-radius: .3em; z-index: 1; diff --git a/src/components/themes/appletv/theme.css b/src/components/themes/appletv/theme.css index e7529e40ed..c5c4f3ea50 100644 --- a/src/components/themes/appletv/theme.css +++ b/src/components/themes/appletv/theme.css @@ -23,14 +23,20 @@ html { .skinHeader-withBackground { color: rgba(0, 0, 0, .7); background: #303030; - background: -webkit-gradient(linear, left top, right top, from(#BCBCBC), color-stop(#A7B4B7), color-stop(#BEB5A5), color-stop(#ADBEC2), to(#B9C7CB)); - background: -webkit-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); - background: -o-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); background: linear-gradient(to right, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB) } +<<<<<<< HEAD +@supports (backdrop-filter:blur(1.5em)) { + .skinHeader-blurred { + background: linear-gradient(to right, rgba(188, 188, 188, .7), rgba(167, 180, 183, .7), rgba(190, 181, 165, .7), rgba(173, 190, 194, .7), rgba(185, 199, 203, .7)); + backdrop-filter: blur(1.5em) + } +} + +======= +>>>>>>> master .skinHeader.semiTransparent { - -webkit-backdrop-filter: none !important; backdrop-filter: none !important } @@ -45,14 +51,10 @@ html { .backgroundContainer, .dialog { background: #D5E9F2; - -webkit-background-size: 100% 100%; background-size: 100% 100% } .backgroundContainer.withBackdrop { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(192, 212, 222, .94)), color-stop(rgba(235, 250, 254, .94)), color-stop(rgba(227, 220, 212, .94)), color-stop(rgba(206, 214, 216, .94)), to(rgba(192, 211, 218, .94))); - background: -webkit-linear-gradient(top, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94)); - background: -o-linear-gradient(top, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94)); background: linear-gradient(to bottom, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94)) } @@ -189,12 +191,19 @@ html { .formDialogFooter:not(.formDialogFooter-clear) { color: rgba(0, 0, 0, .7); background: #303030; - background: -webkit-gradient(linear, left top, right top, from(#BCBCBC), color-stop(#A7B4B7), color-stop(#BEB5A5), color-stop(#ADBEC2), to(#B9C7CB)); - background: -webkit-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); - background: -o-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); background: linear-gradient(to right, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB) } +<<<<<<< HEAD +@supports (backdrop-filter:blur(10px)) { + .appfooter-blurred { + background: rgba(24, 24, 24, .7); + backdrop-filter: blur(20px) + } +} + +======= +>>>>>>> master .nowPlayingBarSecondaryText { color: #999 } @@ -256,7 +265,6 @@ html { color: inherit; background: rgba(255, 255, 255, .9); border: .07em solid rgba(0, 0, 0, .158); - -webkit-border-radius: .15em; border-radius: .15em } @@ -405,9 +413,6 @@ html { } .itemBackdropFader { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#E4E2DC)); - background: -webkit-linear-gradient(rgba(0, 0, 0, 0), #E4E2DC); - background: -o-linear-gradient(rgba(0, 0, 0, 0), #E4E2DC); background: linear-gradient(rgba(0, 0, 0, 0), #E4E2DC) } @@ -415,7 +420,6 @@ html { color: #000; background: #fff3a5; padding: 1em; - -webkit-border-radius: .25em; border-radius: .25em } diff --git a/src/components/themes/blueradiance/theme.css b/src/components/themes/blueradiance/theme.css index 3c90ab16b9..8204e0c972 100644 --- a/src/components/themes/blueradiance/theme.css +++ b/src/components/themes/blueradiance/theme.css @@ -17,19 +17,12 @@ html { .skinHeader-withBackground { background: #303030; - background: -webkit-gradient(linear, left top, right top, from(#291A31), color-stop(#033664), color-stop(#011432), color-stop(#141A3A), to(#291A31)); - background: -webkit-linear-gradient(left, #291A31, #033664, #011432, #141A3A, #291A31); - background: -o-linear-gradient(left, #291A31, #033664, #011432, #141A3A, #291A31); background: linear-gradient(to right, #291A31, #033664, #011432, #141A3A, #291A31) } .skinHeader.semiTransparent { - -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, .3); - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0))); - background: -webkit-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); - background: -o-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)) } @@ -44,7 +37,6 @@ html { .backgroundContainer { background: url(bg.jpg) center top no-repeat #033361; - -webkit-background-size: cover; background-size: cover } @@ -181,9 +173,13 @@ html { color: rgba(255, 255, 255, .78) } -@supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) { +@supports (backdrop-filter:blur(10px)) { .appfooter-blurred { +<<<<<<< HEAD + background: rgba(24, 24, 24, .7); +======= background: rgba(1, 2, 50, .7); +>>>>>>> master backdrop-filter: blur(20px) } } @@ -253,7 +249,6 @@ html { color: inherit; background: rgba(0, 0, 0, .5); border: .07em solid transparent; - -webkit-border-radius: .15em; border-radius: .15em } @@ -408,9 +403,6 @@ html { } .itemBackdropFader { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#181818)); - background: -webkit-linear-gradient(rgba(0, 0, 0, 0), #181818); - background: -o-linear-gradient(rgba(0, 0, 0, 0), #181818); background: linear-gradient(rgba(0, 0, 0, 0), #181818) } @@ -418,7 +410,6 @@ html { color: #ddd; background: #111; padding: 1em; - -webkit-border-radius: .25em; border-radius: .25em } @@ -450,7 +441,7 @@ html { } ::-webkit-scrollbar-track { - -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -459,7 +450,7 @@ html { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - -webkit-border-radius: 2px; + border-radius: 2px; background: center no-repeat #888 } diff --git a/src/components/themes/dark/theme.css b/src/components/themes/dark/theme.css index a403189bb8..38c1005a6b 100644 --- a/src/components/themes/dark/theme.css +++ b/src/components/themes/dark/theme.css @@ -20,7 +20,6 @@ html { } .skinHeader.semiTransparent { - -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, 0.4); } @@ -162,6 +161,16 @@ html { color: rgba(255, 255, 255, .78) } +<<<<<<< HEAD +@supports (backdrop-filter:blur(10px)) { + .appfooter-blurred { + background: rgba(24, 24, 24, .7); + backdrop-filter: blur(20px) + } +} + +======= +>>>>>>> master .itemSelectionPanel { border: 1px solid #00a4dc } @@ -227,7 +236,6 @@ html { color: inherit; background: #292929; border: .07em solid #292929; - -webkit-border-radius: .15em; border-radius: .15em } @@ -378,9 +386,6 @@ html { } .itemBackdropFader { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#101010)); - background: -webkit-linear-gradient(rgba(0, 0, 0, 0), #101010); - background: -o-linear-gradient(rgba(0, 0, 0, 0), #101010); background: linear-gradient(rgba(0, 0, 0, 0), #101010) } @@ -388,7 +393,6 @@ html { color: #ddd; background: #111; padding: 1em; - -webkit-border-radius: .25em; border-radius: .25em } @@ -420,7 +424,7 @@ html { } ::-webkit-scrollbar-track { - -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -429,7 +433,7 @@ html { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - -webkit-border-radius: 2px; + border-radius: 2px; background: center no-repeat #888 } diff --git a/src/components/themes/emby/theme.css b/src/components/themes/emby/theme.css index a17b2f521f..886505f464 100644 --- a/src/components/themes/emby/theme.css +++ b/src/components/themes/emby/theme.css @@ -20,7 +20,6 @@ html { } .skinHeader.semiTransparent { - -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, 0.4); } @@ -162,6 +161,16 @@ html { color: rgba(255, 255, 255, .78) } +<<<<<<< HEAD +@supports (backdrop-filter:blur(10px)) { + .appfooter-blurred { + background: rgba(24, 24, 24, .7); + backdrop-filter: blur(20px) + } +} + +======= +>>>>>>> master .itemSelectionPanel { border: 1px solid #52b54b } @@ -227,7 +236,6 @@ html { color: inherit; background: #292929; border: .07em solid #292929; - -webkit-border-radius: .15em; border-radius: .15em } @@ -378,9 +386,6 @@ html { } .itemBackdropFader { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#1a1a1a)); - background: -webkit-linear-gradient(rgba(0, 0, 0, 0), #1a1a1a); - background: -o-linear-gradient(rgba(0, 0, 0, 0), #1a1a1a); background: linear-gradient(rgba(0, 0, 0, 0), #1a1a1a) } @@ -388,7 +393,6 @@ html { color: #ddd; background: #111; padding: 1em; - -webkit-border-radius: .25em; border-radius: .25em } @@ -420,7 +424,7 @@ html { } ::-webkit-scrollbar-track { - -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -429,7 +433,7 @@ html { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - -webkit-border-radius: 2px; + border-radius: 2px; background: center no-repeat #888 } diff --git a/src/components/themes/light/theme.css b/src/components/themes/light/theme.css index dfe296ec8a..cae5def58a 100644 --- a/src/components/themes/light/theme.css +++ b/src/components/themes/light/theme.css @@ -23,17 +23,14 @@ html { background-color: #303030; color: #ccc; color: rgba(255, 255, 255, .87); - -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37) } .osdHeader { - -webkit-box-shadow: none !important; box-shadow: none !important } .skinHeader.semiTransparent { - -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, 0.4); } @@ -189,6 +186,16 @@ html { color: rgba(255, 255, 255, .78) } +<<<<<<< HEAD +@supports (backdrop-filter:blur(10px)) { + .appfooter-blurred { + background: rgba(24, 24, 24, .7); + backdrop-filter: blur(20px) + } +} + +======= +>>>>>>> master .nowPlayingBarSecondaryText { color: #999 } @@ -249,7 +256,6 @@ html { color: inherit; background: #fff; border: .07em solid rgba(0, 0, 0, .158); - -webkit-border-radius: .15em; border-radius: .15em } @@ -397,9 +403,6 @@ html { } .itemBackdropFader { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#f2f2f2)); - background: -webkit-linear-gradient(rgba(0, 0, 0, 0), #f2f2f2); - background: -o-linear-gradient(rgba(0, 0, 0, 0), #f2f2f2); background: linear-gradient(rgba(0, 0, 0, 0), #f2f2f2) } @@ -407,7 +410,6 @@ html { color: #000; background: #fff3a5; padding: 1em; - -webkit-border-radius: .25em; border-radius: .25em } diff --git a/src/components/themes/purple-haze/theme.css b/src/components/themes/purple-haze/theme.css index 500b5579f6..d55402731e 100644 --- a/src/components/themes/purple-haze/theme.css +++ b/src/components/themes/purple-haze/theme.css @@ -17,19 +17,12 @@ html { .skinHeader-withBackground { background: #000420; - background: -moz-linear-gradient(left, #000420 0%, #06256f 18%, #2b052b 38%, #2b052b 68%, #06256f 81%, #000420 100%); - background: -webkit-linear-gradient(left, #000420 0%,#06256f 18%,#2b052b 38%,#2b052b 68%,#06256f 81%,#000420 100%); background: linear-gradient(to right, #000420 0%,#06256f 18%,#2b052b 38%,#2b052b 68%,#06256f 81%,#000420 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000420', endColorstr='#000420',GradientType=1 ); } .skinHeader.semiTransparent { - -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, .3); - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0))); - background: -webkit-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); - background: -o-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)) } @@ -44,7 +37,6 @@ html { .backgroundContainer { background: url(bg.jpg) center top no-repeat #030322; - -webkit-background-size: cover; background-size: cover } @@ -269,9 +261,13 @@ a[data-role=button] { color: rgba(255, 255, 255, .78) } -@supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) { +@supports (backdrop-filter:blur(10px)) { .appfooter-blurred { +<<<<<<< HEAD + background: rgba(24, 24, 24, .7); +======= background: rgba(6, 37, 111, .7); +>>>>>>> master backdrop-filter: blur(20px) } } @@ -341,7 +337,6 @@ a[data-role=button] { color: inherit; background: rgba(0, 0, 0, .5); border: .07em solid transparent; - -webkit-border-radius: .15em; border-radius: .15em } @@ -501,9 +496,6 @@ a[data-role=button] { } .itemBackdropFader { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#181818)); - background: -webkit-linear-gradient(rgba(0, 0, 0, 0), #181818); - background: -o-linear-gradient(rgba(0, 0, 0, 0), #181818); background: linear-gradient(rgba(0, 0, 0, 0), #181818) } @@ -511,7 +503,6 @@ a[data-role=button] { color: #0e0f2d; background: #dbe6ff; padding: 1em; - -webkit-border-radius: .25em; border-radius: .25em } @@ -549,7 +540,7 @@ a[data-role=button] { } ::-webkit-scrollbar-track { - -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -558,7 +549,7 @@ a[data-role=button] { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - -webkit-border-radius: 2px; + border-radius: 2px; background: center no-repeat #888 } diff --git a/src/components/themes/wmc/theme.css b/src/components/themes/wmc/theme.css index 31098ee348..792bd0db2f 100644 --- a/src/components/themes/wmc/theme.css +++ b/src/components/themes/wmc/theme.css @@ -23,19 +23,22 @@ html { .formDialogHeader:not(.formDialogHeader-clear), .skinHeader-withBackground { background-color: #0C2450; - background: -webkit-gradient(linear, left top, left bottom, from(#0C2450), to(#081B3B)); - background: -webkit-linear-gradient(top, #0C2450, #081B3B); - background: -o-linear-gradient(top, #0C2450, #081B3B); background: linear-gradient(to bottom, #0C2450, #081B3B) } +<<<<<<< HEAD +@supports (backdrop-filter:blur(1.5em)) { + .skinHeader-blurred { + background: rgba(20, 20, 20, .7); + backdrop-filter: blur(1.5em) + } +} + +======= +>>>>>>> master .skinHeader.semiTransparent { - -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, .3); - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0))); - background: -webkit-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); - background: -o-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)) } @@ -46,9 +49,6 @@ html { .backgroundContainer, .dialog { background-color: #0F3562; - background: -webkit-gradient(linear, left top, left bottom, from(#0F3562), color-stop(#1162A4), to(#03215F)); - background: -webkit-linear-gradient(top, #0F3562, #1162A4, #03215F); - background: -o-linear-gradient(top, #0F3562, #1162A4, #03215F); background: linear-gradient(to bottom, #0F3562, #1162A4, #03215F) } @@ -170,13 +170,20 @@ html { .appfooter, .formDialogFooter:not(.formDialogFooter-clear) { background: #0C2450; - background: -webkit-gradient(linear, left bottom, left top, from(#0C2450), to(#081B3B)); - background: -webkit-linear-gradient(bottom, #0C2450, #081B3B); - background: -o-linear-gradient(bottom, #0C2450, #081B3B); background: linear-gradient(to top, #0C2450, #081B3B); color: rgba(255, 255, 255, .78) } +<<<<<<< HEAD +@supports (backdrop-filter:blur(10px)) { + .appfooter-blurred { + background: rgba(24, 24, 24, .7); + backdrop-filter: blur(20px) + } +} + +======= +>>>>>>> master .itemSelectionPanel { border: 1px solid #00a4dc } @@ -239,7 +246,6 @@ html { color: inherit; background: rgba(255, 255, 255, .2); border: .07em solid rgba(255, 255, 255, .135); - -webkit-border-radius: .15em; border-radius: .15em } @@ -392,9 +398,6 @@ html { } .itemBackdropFader { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#115E9E)); - background: -webkit-linear-gradient(rgba(0, 0, 0, 0), #115E9E); - background: -o-linear-gradient(rgba(0, 0, 0, 0), #115E9E); background: linear-gradient(rgba(0, 0, 0, 0), #115E9E) } @@ -402,7 +405,6 @@ html { color: #000; background: #fff3a5; padding: 1em; - -webkit-border-radius: .25em; border-radius: .25em } @@ -434,7 +436,7 @@ html { } ::-webkit-scrollbar-track { - -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -443,7 +445,7 @@ html { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - -webkit-border-radius: 2px; + border-radius: 2px; background: center no-repeat rgba(255, 255, 255, .7) } diff --git a/src/components/upnextdialog/upnextdialog.css b/src/components/upnextdialog/upnextdialog.css index 336a90d58e..784c79cbb7 100644 --- a/src/components/upnextdialog/upnextdialog.css +++ b/src/components/upnextdialog/upnextdialog.css @@ -11,7 +11,6 @@ background-color: rgba(0, 0, 0, 0.7); color: #fff; user-select: none; - -webkit-touch-callout: none; } .upNextDialog-hidden { @@ -67,8 +66,4 @@ border: 0; user-drag: none; user-select: none; - -moz-user-select: none; - -webkit-user-drag: none; - -webkit-user-select: none; - -ms-user-select: none; } diff --git a/src/css/dashboard.css b/src/css/dashboard.css index 1c69dfccb4..d4928db691 100644 --- a/src/css/dashboard.css +++ b/src/css/dashboard.css @@ -1,7 +1,6 @@ .dashboardColumn, .dashboardSections { - -webkit-box-orient: vertical; - -webkit-box-direction: normal + flex-direction: column; } .dashboardFooter { @@ -15,8 +14,6 @@ progress { appearance: none; - -moz-appearance: none; - -webkit-appearance: none; margin: 0; background: #ccc !important } @@ -76,23 +73,17 @@ progress[aria-valuenow]:before { div[data-role=controlgroup] a[data-role=button] { display: inline-block !important; margin: 0 !important; - -webkit-box-shadow: none !important; box-shadow: none !important; - -webkit-border-radius: 0; border-radius: 0 } div[data-role=controlgroup] a[data-role=button]:first-child { - -webkit-border-bottom-left-radius: .3125em; border-bottom-left-radius: .3125em; - -webkit-border-top-left-radius: .3125em; border-top-left-radius: .3125em } div[data-role=controlgroup] a[data-role=button]:last-child { - -webkit-border-bottom-right-radius: .3125em; border-bottom-right-radius: .3125em; - -webkit-border-top-right-radius: .3125em; border-top-right-radius: .3125em } @@ -146,23 +137,14 @@ div[data-role=controlgroup] a.ui-btn-active { } .dashboardSections { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-flex-direction: column; flex-direction: column } .dashboardColumn { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-flex-direction: column; flex-direction: column; - -webkit-flex-shrink: 0; flex-shrink: 0; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1 } @@ -171,7 +153,6 @@ div[data-role=controlgroup] a.ui-btn-active { } .dashboardSection { - -webkit-flex-shrink: 0; flex-shrink: 0; margin: 0 0 2em } @@ -187,11 +168,7 @@ div[data-role=controlgroup] a.ui-btn-active { @media all and (min-width:70em) { .dashboardSections { - -webkit-flex-wrap: wrap; flex-wrap: wrap; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -webkit-flex-direction: row; flex-direction: row } @@ -296,7 +273,6 @@ div[data-role=controlgroup] a.ui-btn-active { } .sessionNowPlayingContent { - -webkit-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center center; @@ -395,7 +371,6 @@ div[data-role=controlgroup] a.ui-btn-active { } .disabledUser { - -webkit-filter: grayscale(100%); filter: grayscale(100%) } @@ -416,9 +391,7 @@ div[data-role=controlgroup] a.ui-btn-active { } a[data-role=button] { - -webkit-font-smoothing: antialiased; - -webkit-user-select: none; - -webkit-background-clip: padding-box; + background-clip: padding-box; cursor: pointer !important; font-family: inherit !important; font-weight: 500 !important; @@ -430,37 +403,21 @@ a[data-role=button] { background: #292929 !important; } -@-webkit-keyframes rotating { - from { - -webkit-transform: rotate(0); - transform: rotate(0) - } - - to { - -webkit-transform: rotate(360deg); - transform: rotate(360deg) - } -} - @keyframes rotating { from { - -webkit-transform: rotate(0); transform: rotate(0) } to { - -webkit-transform: rotate(360deg); transform: rotate(360deg) } } .rotatingCircle { - -webkit-animation: rotating 2s linear infinite; animation: rotating 2s linear infinite } .pluginPreviewImg { - -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37) } diff --git a/src/css/fonts.css b/src/css/fonts.css index 12f1eaf4b7..da5515fc1e 100644 --- a/src/css/fonts.css +++ b/src/css/fonts.css @@ -4,7 +4,6 @@ html { html { font-size: 93%; - -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } diff --git a/src/css/librarybrowser.css b/src/css/librarybrowser.css index f0d450b486..ef71a4e192 100644 --- a/src/css/librarybrowser.css +++ b/src/css/librarybrowser.css @@ -15,7 +15,6 @@ .headerSelectedPlayer, .itemMiscInfo, .navMenuOptionText { - -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden } @@ -48,8 +47,6 @@ z-index: 1; margin: 0 !important; top: 6.9em !important; - -webkit-transition: -webkit-transform .2s ease-out; - -o-transition: transform .2s ease-out; transition: transform .2s ease-out } @@ -58,17 +55,14 @@ } .headerUserImage { - -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; background-position: center center; - -webkit-border-radius: 100em; border-radius: 100em; display: inline-block } .headerUserButtonRound div { - -webkit-border-radius: 100em; border-radius: 100em; background-size: cover; background-repeat: no-repeat; @@ -76,7 +70,6 @@ } .headerButton { - -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -90,34 +83,25 @@ } .pageTitle { - display: -webkit-inline-box; - display: -webkit-inline-flex; display: inline-flex; margin: .3em 0 0 .5em; height: 1.7em; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; - -webkit-flex-shrink: 1; flex-shrink: 1 } .headerLeft, .skinHeader { - display: -webkit-box; - display: -webkit-flex + display: flex; } .detailButton-mobile, .skinHeader { - -webkit-flex-direction: column; - -webkit-box-orient: vertical; - -webkit-box-direction: normal + flex-direction: column; } .pageTitleWithLogo { background-position: left center; - -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; width: 13.2em @@ -137,7 +121,7 @@ .headerLeft, .headerRight { - -webkit-box-align: center + justify-content: center; } .hiddenViewMenuBar .skinHeader { @@ -150,12 +134,10 @@ .headerLeft { display: flex; - -webkit-align-items: center; align-items: center; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1; - overflow: hidden + overflow: hidden; + justify-content: left; } .sectionTabs { @@ -163,13 +145,8 @@ } .headerRight { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-align-items: center; align-items: center; - -webkit-box-pack: end; - -webkit-justify-content: flex-end; justify-content: flex-end } @@ -178,27 +155,19 @@ } .navMenuOption { - display: -webkit-box !important; - display: -webkit-flex !important; display: flex !important; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; text-decoration: none; color: inherit; padding: .9em 0 .9em 2.4em !important; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1; font-weight: 400 !important; margin: 0 !important; - -webkit-border-radius: 0 !important; border-radius: 0 !important } .navMenuOptionIcon { margin-right: 1.2em; - -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -212,8 +181,6 @@ } .dashboardDocument .skinBody { - -webkit-transition: left ease-in-out .3s, padding ease-in-out .3s; - -o-transition: left ease-in-out .3s, padding ease-in-out .3s; transition: left ease-in-out .3s, padding ease-in-out .3s; position: absolute; top: 0; @@ -242,9 +209,7 @@ z-index: inherit !important; left: 0 !important; top: 0 !important; - -webkit-transform: none !important; transform: none !important; - -webkit-box-shadow: none !important; box-shadow: none !important; width: 20.205em !important; font-size: 94% @@ -281,14 +246,9 @@ } .headerTabs { - -webkit-align-self: center; align-self: center; width: auto; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center; margin-top: -3.34em; position: relative; @@ -346,8 +306,6 @@ } .flexPageTabContent.is-active { - display: -webkit-box !important; - display: -webkit-flex !important; display: flex !important } @@ -363,7 +321,6 @@ margin: 1.5em 0; background: #222; padding: .8em .8em .8em 3em; - -webkit-border-radius: .3em; border-radius: .3em; position: relative } @@ -422,7 +379,6 @@ } .itemBackdrop { - -webkit-background-size: cover; background-size: cover; height: 50vh; position: relative @@ -450,14 +406,15 @@ .detailImageContainer { width: 280px; +<<<<<<< HEAD +======= margin-right: 2em; +>>>>>>> master flex-shrink: 0; } .detailPagePrimaryContent { position: relative; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1 } @@ -467,7 +424,6 @@ position: absolute; top: 13.5%; right: 19.5%; - -webkit-background-size: contain; background-size: contain } @@ -497,7 +453,6 @@ .itemDetailImage { width: 100%; - -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37) } @@ -533,8 +488,6 @@ } .detailPagePrimaryContainer { - display: -webkit-box; - display: -webkit-flex; display: flex; margin-bottom: 3em } @@ -595,8 +548,7 @@ .detailButton-mobile, .mainDetailButtons { - display: -webkit-box; - display: -webkit-flex + display: flex; } .itemName { @@ -617,10 +569,7 @@ .mainDetailButtons { display: flex; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; - -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 1em 0 } @@ -628,7 +577,6 @@ .recordingFields button { margin-left: 0; margin-right: .5em; - -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -639,11 +587,7 @@ .detailButton-mobile { display: flex; flex-direction: column; - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; margin: 0 !important; padding: .5em .7em !important @@ -675,18 +619,9 @@ } .detailButton-mobile-content { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -webkit-flex-direction: column; flex-direction: column; - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center } @@ -743,21 +678,14 @@ } .itemMiscInfo { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-flex-wrap: wrap; flex-wrap: wrap; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center } @media all and (max-width:31.25em) { .mobileDetails .itemMiscInfo { text-align: center; - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center } @@ -849,7 +777,6 @@ } .btnSyncComplete i { - -webkit-border-radius: 100em; border-radius: 100em } @@ -858,14 +785,9 @@ } .mediaInfoIcons { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; margin: 1em 0; - -webkit-flex-wrap: wrap; flex-wrap: wrap } @@ -903,7 +825,6 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards { .sectionTitleButton { margin-left: 1.5em !important; - -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -913,22 +834,17 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards { .sectionTitleIconButton { margin-left: 1.5em !important; - -webkit-flex-shrink: 0; flex-shrink: 0; font-size: 84% !important; padding: .5em !important } .horizontalItemsContainer { - display: -webkit-box; - display: -webkit-flex; display: flex } .sectionTitleTextButton { margin: 0 !important; - display: -webkit-inline-box !important; - display: -webkit-inline-flex !important; display: inline-flex !important; color: inherit !important } @@ -1000,8 +916,6 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards { } .itemsViewSettingsContainer { - -webkit-box-pack: center; - -webkit-justify-content: center; justify-content: center } diff --git a/src/css/metadataeditor.css b/src/css/metadataeditor.css index 542c7c8f2b..c5de6f3efe 100644 --- a/src/css/metadataeditor.css +++ b/src/css/metadataeditor.css @@ -28,17 +28,13 @@ .jstree-wholerow-hovered { background: #38c !important; - -webkit-border-radius: 0 !important; border-radius: 0 !important; - -webkit-box-shadow: none !important; box-shadow: none !important } .jstree-default .jstree-hovered { background: 0 0 !important; - -webkit-border-radius: 0 !important; border-radius: 0 !important; - -webkit-box-shadow: none !important; box-shadow: none !important; color: #fff !important } diff --git a/src/css/scrollstyles.css b/src/css/scrollstyles.css index aa2f7dafad..69039ce341 100644 --- a/src/css/scrollstyles.css +++ b/src/css/scrollstyles.css @@ -1,6 +1,5 @@ .scrollX { overflow-x: auto; - -webkit-overflow-scrolling: touch; overflow-y: hidden; white-space: nowrap; } @@ -10,13 +9,11 @@ } .hiddenScrollX, .layout-tv .scrollX { - -ms-overflow-style: none; - /* Can't do this because it not only hides the scrollbar, but also prevents scrolling */ - /*overflow: -moz-scrollbars-none;*/ + scrollbar-width: none; } .hiddenScrollX-forced { - overflow: -moz-scrollbars-none; + scrollbar-width: none; } .hiddenScrollX::-webkit-scrollbar, .layout-tv .scrollX::-webkit-scrollbar { @@ -26,28 +23,24 @@ .scrollY { overflow-y: auto; - -webkit-overflow-scrolling: touch; overflow-x: hidden; } .smoothScrollY { overflow-y: auto; - -webkit-overflow-scrolling: touch; overflow-x: hidden; scroll-behavior: smooth; } .hiddenScrollY, .layout-tv .smoothScrollY { - -ms-overflow-style: none; - /* Can't do this because it not only hides the scrollbar, but also prevents scrolling */ - /*overflow: -moz-scrollbars-none;*/ + scrollbar-width: none; } .hiddenScrollY-forced { - overflow: -moz-scrollbars-none; + scrollbar-width: none; } .hiddenScrollY::-webkit-scrollbar, .layout-tv .smoothScrollY::-webkit-scrollbar, .layout-tv .scrollY::-webkit-scrollbar { width: 0 !important; display: none; -} \ No newline at end of file +} diff --git a/src/css/site.css b/src/css/site.css index 292fc67454..6491799117 100644 --- a/src/css/site.css +++ b/src/css/site.css @@ -20,18 +20,12 @@ html { .layout-mobile, .layout-tv { - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none } body { overflow-x: hidden; background-color: transparent !important; - -webkit-font-smoothing: antialiased } .mainAnimatedPage { diff --git a/src/css/videoosd.css b/src/css/videoosd.css index f9c4798e97..f20abf9d07 100644 --- a/src/css/videoosd.css +++ b/src/css/videoosd.css @@ -1,8 +1,6 @@ .chapterThumbTextContainer, .videoOsdBottom { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none + user-select: none; } .osdPoster img, @@ -14,13 +12,10 @@ } .osdHeader { - -webkit-transition: opacity .3s ease-out; - -o-transition: opacity .3s ease-out; transition: opacity .3s ease-out; position: relative; z-index: 1; background: rgba(0, 0, 0, 0.7) !important; - -webkit-backdrop-filter: none !important; backdrop-filter: none !important; color: #eee !important; } @@ -34,17 +29,13 @@ } .chapterThumbContainer { - -webkit-box-shadow: 0 0 1.9vh #000; box-shadow: 0 0 1.9vh #000; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1; position: relative } .chapterThumb { background-position: center center; - -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; border: 0; @@ -90,20 +81,12 @@ position: fixed; background-color: rgba(0, 0, 0, 0.7); padding: 1%; - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -webkit-flex-direction: row; flex-direction: row; will-change: opacity; - -webkit-transition: opacity 0.3s ease-out; - -o-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; color: #fff; - user-select: none; - -webkit-touch-callout: none + user-select: none } .videoOsdBottom-hidden { @@ -111,49 +94,35 @@ } .osdControls { - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1 } .videoOsdBottom .buttons { padding: .25em 0 0; - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-flex-wrap: wrap; flex-wrap: wrap; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center } .osdVolumeSliderContainer { width: 9em; - -webkit-box-flex: 1; - -webkit-flex-grow: 1; flex-grow: 1 } .osdMediaInfo, .volumeButtons { - display: -webkit-box; - display: -webkit-flex; - -webkit-box-align: center + display: flex; + align-items: center; } .volumeButtons { margin: 0 .5em 0 auto; display: flex; - -webkit-align-items: center; align-items: center } .osdTimeText { margin-left: 1em; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none } @@ -167,15 +136,10 @@ position: absolute; height: auto; width: 100%; - -webkit-box-shadow: 0 0 1.9vh #000; box-shadow: 0 0 1.9vh #000; border: .08em solid #222; user-drag: none; - user-select: none; - -moz-user-select: none; - -webkit-user-drag: none; - -webkit-user-select: none; - -ms-user-select: none + user-select: none } .osdTitle, @@ -185,7 +149,6 @@ .osdMediaInfo { display: flex; - -webkit-align-items: center; align-items: center } @@ -194,23 +157,14 @@ } .osdTextContainer { - display: -webkit-box; - display: -webkit-flex; display: flex; - -webkit-box-align: center; - -webkit-align-items: center; align-items: center; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; margin-bottom: .7em; padding-left: .5em } .osdMainTextContainer { - -webkit-box-align: baseline; - -webkit-align-items: baseline; align-items: baseline } @@ -218,12 +172,13 @@ margin-left: auto; } -@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } } -@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } } -@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } } +@keyframes spin { + 100% { + transform:rotate(360deg); + } +} + .osdMediaStatus .animate { - -webkit-animation:spin 4s linear infinite; - -moz-animation:spin 4s linear infinite; animation:spin 4s linear infinite; }