From 50d6864a681327b56f6397f7b2cbbf441daa31cf Mon Sep 17 00:00:00 2001 From: MrTimscampi Date: Thu, 9 Jan 2020 19:35:19 +0100 Subject: [PATCH 1/4] Revert vendor prefix removal --- src/assets/css/dashboard.css | 49 ++++- src/assets/css/fonts.css | 1 + src/assets/css/librarybrowser.css | 129 +++++++++-- src/assets/css/metadataeditor.css | 4 + src/assets/css/scrollstyles.css | 17 +- src/assets/css/site.css | 6 + src/assets/css/videoosd.css | 67 +++++- src/components/cardbuilder/card.css | 9 +- src/components/dialogHelper/dialoghelper.css | 1 + src/components/filterdialog/style.css | 1 + src/components/homesections/homesections.css | 2 + src/components/htmlvideoplayer/style.css | 1 + src/components/images/style.css | 12 ++ src/components/indicators/indicators.css | 4 + src/components/loading/loading.css | 204 +++++++++++++++++- src/components/navdrawer/navdrawer.css | 11 + .../remotecontrol/remotecontrol.css | 48 ++++- src/components/slideshow/style.css | 3 + src/components/subtitlesync/subtitlesync.css | 2 + src/components/upnextdialog/upnextdialog.css | 5 + src/elements/emby-button/emby-button.css | 10 + src/elements/emby-checkbox/emby-checkbox.css | 5 +- src/elements/emby-input/emby-input.css | 3 + src/elements/emby-radio/emby-radio.css | 7 + src/elements/emby-select/emby-select.css | 5 + src/elements/emby-slider/emby-slider.css | 16 +- src/elements/emby-textarea/emby-textarea.css | 1 + src/elements/emby-toggle/emby-toggle.css | 8 + src/themes/appletv/theme.css | 20 ++ src/themes/blueradiance/theme.css | 23 +- src/themes/dark/theme.css | 14 +- src/themes/light/theme.css | 12 ++ src/themes/purplehaze/theme.css | 23 +- src/themes/wmc/theme.css | 26 ++- 34 files changed, 698 insertions(+), 51 deletions(-) diff --git a/src/assets/css/dashboard.css b/src/assets/css/dashboard.css index d4928db691..1c69dfccb4 100644 --- a/src/assets/css/dashboard.css +++ b/src/assets/css/dashboard.css @@ -1,6 +1,7 @@ .dashboardColumn, .dashboardSections { - flex-direction: column; + -webkit-box-orient: vertical; + -webkit-box-direction: normal } .dashboardFooter { @@ -14,6 +15,8 @@ progress { appearance: none; + -moz-appearance: none; + -webkit-appearance: none; margin: 0; background: #ccc !important } @@ -73,17 +76,23 @@ 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 } @@ -137,14 +146,23 @@ 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 } @@ -153,6 +171,7 @@ div[data-role=controlgroup] a.ui-btn-active { } .dashboardSection { + -webkit-flex-shrink: 0; flex-shrink: 0; margin: 0 0 2em } @@ -168,7 +187,11 @@ 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 } @@ -273,6 +296,7 @@ div[data-role=controlgroup] a.ui-btn-active { } .sessionNowPlayingContent { + -webkit-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center center; @@ -371,6 +395,7 @@ div[data-role=controlgroup] a.ui-btn-active { } .disabledUser { + -webkit-filter: grayscale(100%); filter: grayscale(100%) } @@ -391,7 +416,9 @@ div[data-role=controlgroup] a.ui-btn-active { } a[data-role=button] { - background-clip: padding-box; + -webkit-font-smoothing: antialiased; + -webkit-user-select: none; + -webkit-background-clip: padding-box; cursor: pointer !important; font-family: inherit !important; font-weight: 500 !important; @@ -403,21 +430,37 @@ a[data-role=button] { background: #292929 !important; } -@keyframes rotating { +@-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/assets/css/fonts.css b/src/assets/css/fonts.css index da5515fc1e..12f1eaf4b7 100644 --- a/src/assets/css/fonts.css +++ b/src/assets/css/fonts.css @@ -4,6 +4,7 @@ html { html { font-size: 93%; + -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } diff --git a/src/assets/css/librarybrowser.css b/src/assets/css/librarybrowser.css index b9f406bc0d..c03cc2691f 100644 --- a/src/assets/css/librarybrowser.css +++ b/src/assets/css/librarybrowser.css @@ -15,6 +15,7 @@ .headerSelectedPlayer, .itemMiscInfo, .navMenuOptionText { + -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden } @@ -47,6 +48,8 @@ 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 } @@ -55,14 +58,17 @@ } .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; @@ -70,6 +76,7 @@ } .headerButton { + -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -83,25 +90,34 @@ } .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: flex; + display: -webkit-box; + display: -webkit-flex } .detailButton-mobile, .skinHeader { - flex-direction: column; + -webkit-flex-direction: column; + -webkit-box-orient: vertical; + -webkit-box-direction: normal } .pageTitleWithLogo { background-position: left center; + -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; width: 13.2em @@ -121,7 +137,7 @@ .headerLeft, .headerRight { - justify-content: center; + -webkit-box-align: center } .hiddenViewMenuBar .skinHeader { @@ -134,7 +150,10 @@ .headerLeft { display: flex; + -webkit-align-items: center; align-items: center; + -webkit-box-flex: 1; + -webkit-flex-grow: 1; flex-grow: 1; overflow: hidden; justify-content: flex-start; @@ -145,8 +164,13 @@ } .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 } @@ -155,19 +179,27 @@ } .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 } @@ -181,6 +213,8 @@ } .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; @@ -210,7 +244,9 @@ 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% @@ -247,9 +283,14 @@ } .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; @@ -307,6 +348,8 @@ } .flexPageTabContent.is-active { + display: -webkit-box !important; + display: -webkit-flex !important; display: flex !important } @@ -322,6 +365,7 @@ margin: 1.5em 0; background: #222; padding: .8em .8em .8em 3em; + -webkit-border-radius: .3em; border-radius: .3em; position: relative } @@ -380,6 +424,7 @@ } .itemBackdrop { + -webkit-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center; @@ -443,15 +488,15 @@ } .detailImageContainer { - margin: 1.25em 0; - position: sticky; - top: 15%; - float: left; - width: 22.786458333333332vw; + width: 280px; + margin-right: 2em; + flex-shrink: 0; } .detailPagePrimaryContent { position: relative; + -webkit-box-flex: 1; + -webkit-flex-grow: 1; flex-grow: 1 } @@ -459,8 +504,9 @@ width: 25em; height: 9.375em; position: absolute; - top: 14.5%; - right: 10.5%; + top: 13.5%; + right: 19.5%; + -webkit-background-size: contain; background-size: contain } @@ -489,8 +535,13 @@ } .itemDetailImage { - width: 100% !important; - box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); + 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) +} + +.thumbDetailImageContainer { + width: 400px } @media all and (max-width:62.5em) { @@ -503,6 +554,19 @@ } } +@media all and (min-width:62.5em) { + .itemBackdrop { + display: none + } + + .detailPagePrimaryContainer { + display: -webkit-box; + display: -webkit-flex; + display: flex; + margin-bottom: 3em + } +} + @media all and (max-width:75em) { .lnkSibling { display: none !important @@ -557,7 +621,8 @@ .detailButton-mobile, .mainDetailButtons { - display: flex; + display: -webkit-box; + display: -webkit-flex } .itemName { @@ -578,7 +643,10 @@ .mainDetailButtons { display: flex; + -webkit-box-align: center; + -webkit-align-items: center; align-items: center; + -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 1em 0; } @@ -586,6 +654,7 @@ .recordingFields button { margin-left: 0; margin-right: .5em; + -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -596,7 +665,11 @@ .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 @@ -628,9 +701,18 @@ } .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 } @@ -684,14 +766,21 @@ } .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 } @@ -781,6 +870,7 @@ } .btnSyncComplete i { + -webkit-border-radius: 100em; border-radius: 100em } @@ -789,9 +879,14 @@ } .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 } @@ -829,6 +924,7 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards { .sectionTitleButton { margin-left: 1.5em !important; + -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -838,17 +934,22 @@ 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 } @@ -920,6 +1021,8 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards { } .itemsViewSettingsContainer { + -webkit-box-pack: center; + -webkit-justify-content: center; justify-content: center } diff --git a/src/assets/css/metadataeditor.css b/src/assets/css/metadataeditor.css index c5de6f3efe..542c7c8f2b 100644 --- a/src/assets/css/metadataeditor.css +++ b/src/assets/css/metadataeditor.css @@ -28,13 +28,17 @@ .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/assets/css/scrollstyles.css b/src/assets/css/scrollstyles.css index 69039ce341..aa2f7dafad 100644 --- a/src/assets/css/scrollstyles.css +++ b/src/assets/css/scrollstyles.css @@ -1,5 +1,6 @@ .scrollX { overflow-x: auto; + -webkit-overflow-scrolling: touch; overflow-y: hidden; white-space: nowrap; } @@ -9,11 +10,13 @@ } .hiddenScrollX, .layout-tv .scrollX { - scrollbar-width: none; + -ms-overflow-style: none; + /* Can't do this because it not only hides the scrollbar, but also prevents scrolling */ + /*overflow: -moz-scrollbars-none;*/ } .hiddenScrollX-forced { - scrollbar-width: none; + overflow: -moz-scrollbars-none; } .hiddenScrollX::-webkit-scrollbar, .layout-tv .scrollX::-webkit-scrollbar { @@ -23,24 +26,28 @@ .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 { - scrollbar-width: none; + -ms-overflow-style: none; + /* Can't do this because it not only hides the scrollbar, but also prevents scrolling */ + /*overflow: -moz-scrollbars-none;*/ } .hiddenScrollY-forced { - scrollbar-width: none; + overflow: -moz-scrollbars-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/assets/css/site.css b/src/assets/css/site.css index 6491799117..292fc67454 100644 --- a/src/assets/css/site.css +++ b/src/assets/css/site.css @@ -20,12 +20,18 @@ 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/assets/css/videoosd.css b/src/assets/css/videoosd.css index f20abf9d07..f9c4798e97 100644 --- a/src/assets/css/videoosd.css +++ b/src/assets/css/videoosd.css @@ -1,6 +1,8 @@ .chapterThumbTextContainer, .videoOsdBottom { - user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none } .osdPoster img, @@ -12,10 +14,13 @@ } .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; } @@ -29,13 +34,17 @@ } .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; @@ -81,12 +90,20 @@ 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 + user-select: none; + -webkit-touch-callout: none } .videoOsdBottom-hidden { @@ -94,35 +111,49 @@ } .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: flex; - align-items: center; + display: -webkit-box; + display: -webkit-flex; + -webkit-box-align: 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 } @@ -136,10 +167,15 @@ 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 + user-select: none; + -moz-user-select: none; + -webkit-user-drag: none; + -webkit-user-select: none; + -ms-user-select: none } .osdTitle, @@ -149,6 +185,7 @@ .osdMediaInfo { display: flex; + -webkit-align-items: center; align-items: center } @@ -157,14 +194,23 @@ } .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 } @@ -172,13 +218,12 @@ margin-left: auto; } -@keyframes spin { - 100% { - transform:rotate(360deg); - } -} - +@-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); } } .osdMediaStatus .animate { + -webkit-animation:spin 4s linear infinite; + -moz-animation:spin 4s linear infinite; animation:spin 4s linear infinite; } diff --git a/src/components/cardbuilder/card.css b/src/components/cardbuilder/card.css index 5520ce2c7e..e63b9a4bb1 100644 --- a/src/components/cardbuilder/card.css +++ b/src/components/cardbuilder/card.css @@ -18,6 +18,7 @@ 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; @@ -79,9 +80,10 @@ 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; - contain: style; + contain: layout style; } .card.show-focus:not(.show-animation) .cardBox { @@ -146,6 +148,7 @@ button { background-size: cover; background-repeat: no-repeat; background-position: center center; + display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -179,6 +182,7 @@ button { margin: 0 !important; /* Needed in safari */ height: 100%; + -webkit-tap-highlight-color: rgba(0,0,0,0); outline: none !important; contain: strict; } @@ -342,6 +346,7 @@ 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 aa4145e016..2cc20b5ff2 100644 --- a/src/components/dialogHelper/dialoghelper.css +++ b/src/components/dialogHelper/dialoghelper.css @@ -16,6 +16,7 @@ .dialog { margin: 0; border-radius: .2em; + -webkit-font-smoothing: antialiased; border: 0; padding: 0; will-change: transform, opacity; diff --git a/src/components/filterdialog/style.css b/src/components/filterdialog/style.css index 989b7c1245..9851c2d7b9 100644 --- a/src/components/filterdialog/style.css +++ b/src/components/filterdialog/style.css @@ -5,6 +5,7 @@ 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 5df2440f82..45df67c482 100644 --- a/src/components/homesections/homesections.css +++ b/src/components/homesections/homesections.css @@ -13,11 +13,13 @@ .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 e1875ff332..32c090eeae 100644 --- a/src/components/htmlvideoplayer/style.css +++ b/src/components/htmlvideoplayer/style.css @@ -42,6 +42,7 @@ 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 06fbf1f9cf..5cf39c1e4b 100644 --- a/src/components/images/style.css +++ b/src/components/images/style.css @@ -18,9 +18,21 @@ .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 b0d0119c05..c2d089e1af 100644 --- a/src/components/indicators/indicators.css +++ b/src/components/indicators/indicators.css @@ -14,6 +14,7 @@ .indicator { border-radius: 100em; + display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -42,6 +43,7 @@ .countIndicator { border-radius: 100em; + display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -53,6 +55,7 @@ .playedIndicator { border-radius: 100em; + display: -webkit-flex; display: flex; align-items: center; justify-content: center; @@ -64,6 +67,7 @@ .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 e3f10c0e2e..6d8472fc15 100644 --- a/src/components/loading/loading.css +++ b/src/components/loading/loading.css @@ -7,11 +7,20 @@ .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); } } @@ -28,6 +37,7 @@ } .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; } @@ -36,6 +46,7 @@ } .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; } @@ -44,6 +55,7 @@ } .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; } @@ -52,39 +64,90 @@ } .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; } -@keyframes mdl-spinner__fill-unfill-rotate { +@-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); } } @@ -98,6 +161,32 @@ * - 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; @@ -124,6 +213,28 @@ } } +@-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; @@ -146,6 +257,28 @@ } } +@-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; @@ -168,6 +301,28 @@ } } +@-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; @@ -211,6 +366,7 @@ border-color: inherit; border-bottom-color: transparent !important; border-radius: 50%; + -webkit-animation: none; animation: none; position: absolute; top: 0; @@ -221,47 +377,91 @@ .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; } -@keyframes mdl-spinner__left-spin { +@-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 5d63e150d1..f774c6919f 100644 --- a/src/components/navdrawer/navdrawer.css +++ b/src/components/navdrawer/navdrawer.css @@ -9,20 +9,29 @@ .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 } @@ -32,6 +41,8 @@ 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 349416a979..9bd91731a7 100644 --- a/src/components/remotecontrol/remotecontrol.css +++ b/src/components/remotecontrol/remotecontrol.css @@ -1,5 +1,10 @@ .nowPlayingInfoContainer { + display: -webkit-box; + display: -webkit-flex; display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -webkit-flex-direction: row; flex-direction: row } @@ -36,20 +41,27 @@ } .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: flex; + display: -webkit-box; + display: -webkit-flex } .nowPlayingPageImageContainer { width: 20%; margin-right: .25em; position: relative; + -webkit-flex-shrink: 0; flex-shrink: 0 } @@ -60,9 +72,16 @@ } .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 } @@ -71,15 +90,25 @@ 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 } @@ -93,6 +122,8 @@ } .nowPlayingInfoButtons { + -webkit-box-pack: center; + -webkit-justify-content: center; justify-content: center } @@ -120,20 +151,33 @@ .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 } } @@ -150,11 +194,13 @@ .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(assets/img/equalizer.gif) !important; } diff --git a/src/components/slideshow/style.css b/src/components/slideshow/style.css index 1167a972c8..43211a8fef 100644 --- a/src/components/slideshow/style.css +++ b/src/components/slideshow/style.css @@ -41,6 +41,9 @@ 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 38a15be901..112e624722 100644 --- a/src/components/subtitlesync/subtitlesync.css +++ b/src/components/subtitlesync/subtitlesync.css @@ -40,6 +40,8 @@ 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/upnextdialog/upnextdialog.css b/src/components/upnextdialog/upnextdialog.css index 784c79cbb7..336a90d58e 100644 --- a/src/components/upnextdialog/upnextdialog.css +++ b/src/components/upnextdialog/upnextdialog.css @@ -11,6 +11,7 @@ background-color: rgba(0, 0, 0, 0.7); color: #fff; user-select: none; + -webkit-touch-callout: none; } .upNextDialog-hidden { @@ -66,4 +67,8 @@ 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/elements/emby-button/emby-button.css b/src/elements/emby-button/emby-button.css index ee15e2e125..2201b2cd77 100644 --- a/src/elements/emby-button/emby-button.css +++ b/src/elements/emby-button/emby-button.css @@ -9,6 +9,9 @@ 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; @@ -21,6 +24,8 @@ 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; @@ -94,6 +99,9 @@ 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; @@ -110,6 +118,8 @@ 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/elements/emby-checkbox/emby-checkbox.css b/src/elements/emby-checkbox/emby-checkbox.css index 4e27928e2a..5641893f63 100644 --- a/src/elements/emby-checkbox/emby-checkbox.css +++ b/src/elements/emby-checkbox/emby-checkbox.css @@ -38,6 +38,9 @@ margin: 0; padding: 0; opacity: 0; + -ms-appearance: none; + -moz-appearance: none; + -webkit-appearance: none; appearance: none; border: none; } @@ -112,7 +115,7 @@ margin-bottom: .25em; } -@keyframes repaintChrome { +@-webkit-keyframes repaintChrome { from { padding: 0; } diff --git a/src/elements/emby-input/emby-input.css b/src/elements/emby-input/emby-input.css index 57a46ec7b6..d888eb570d 100644 --- a/src/elements/emby-input/emby-input.css +++ b/src/elements/emby-input/emby-input.css @@ -10,8 +10,10 @@ 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%; } @@ -33,5 +35,6 @@ } .emby-input-iconbutton { + -webkit-align-self: flex-end; align-self: flex-end; } diff --git a/src/elements/emby-radio/emby-radio.css b/src/elements/emby-radio/emby-radio.css index 6b8575bc86..25fdc5b933 100644 --- a/src/elements/emby-radio/emby-radio.css +++ b/src/elements/emby-radio/emby-radio.css @@ -27,6 +27,9 @@ margin: 0; padding: 0; opacity: 0; + -ms-appearance: none; + -moz-appearance: none; + -webkit-appearance: none; appearance: none; border: none; } @@ -67,13 +70,17 @@ 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/elements/emby-select/emby-select.css b/src/elements/emby-select/emby-select.css index 4aff8cab92..76b28c4208 100644 --- a/src/elements/emby-select/emby-select.css +++ b/src/elements/emby-select/emby-select.css @@ -12,6 +12,7 @@ /* Prevent padding from causing width overflow */ box-sizing: border-box; outline: none !important; + -webkit-tap-highlight-color: rgba(0,0,0,0); width: 100%; } @@ -19,6 +20,8 @@ background: none !important; border-color: transparent !important; color: inherit !important; + -webkit-appearance: none; + -moz-appearance: none; appearance: none; } @@ -38,6 +41,7 @@ .emby-select-focusscale { transition: transform 180ms ease-out !important; + -webkit-transform-origin: center center; transform-origin: center center; } @@ -73,6 +77,7 @@ } .emby-select-withcolor { + -webkit-appearance: none; appearance: none; border-radius: .2em; } diff --git a/src/elements/emby-slider/emby-slider.css b/src/elements/emby-slider/emby-slider.css index 6fc861deb0..945cdd5214 100644 --- a/src/elements/emby-slider/emby-slider.css +++ b/src/elements/emby-slider/emby-slider.css @@ -1,21 +1,31 @@ _:-ms-input-placeholder { - appearance: none; + -ms-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; } @@ -59,7 +69,7 @@ _:-ms-input-placeholder { } .mdl-slider::-webkit-slider-thumb { - appearance: none; + -webkit-appearance: none; width: 1.2em; height: 1.2em; box-sizing: border-box; @@ -98,7 +108,7 @@ _:-ms-input-placeholder { } .mdl-slider::-ms-thumb { - appearance: none; + -webkit-appearance: none; width: 1.8em; height: 1.8em; box-sizing: border-box; diff --git a/src/elements/emby-textarea/emby-textarea.css b/src/elements/emby-textarea/emby-textarea.css index 0dab1b1ece..6ac8262236 100644 --- a/src/elements/emby-textarea/emby-textarea.css +++ b/src/elements/emby-textarea/emby-textarea.css @@ -13,6 +13,7 @@ /* 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/elements/emby-toggle/emby-toggle.css b/src/elements/emby-toggle/emby-toggle.css index 3b14b8cf09..fb91419cbc 100644 --- a/src/elements/emby-toggle/emby-toggle.css +++ b/src/elements/emby-toggle/emby-toggle.css @@ -9,6 +9,10 @@ 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; @@ -24,6 +28,9 @@ margin: 0; padding: 0; opacity: 0; + -ms-appearance: none; + -moz-appearance: none; + -webkit-appearance: none; appearance: none; border: none; } @@ -82,6 +89,7 @@ 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/themes/appletv/theme.css b/src/themes/appletv/theme.css index 4b694d6ece..d194dc2034 100644 --- a/src/themes/appletv/theme.css +++ b/src/themes/appletv/theme.css @@ -23,10 +23,14 @@ 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) } .skinHeader.semiTransparent { + -webkit-backdrop-filter: none !important; backdrop-filter: none !important } @@ -41,10 +45,14 @@ 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)) } @@ -181,6 +189,9 @@ 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) } @@ -245,6 +256,7 @@ html { color: inherit; background: rgba(255, 255, 255, .9); border: .07em solid rgba(0, 0, 0, .158); + -webkit-border-radius: .15em; border-radius: .15em } @@ -392,10 +404,18 @@ html { color: #fff } +.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) +} + .infoBanner { color: #000; background: #fff3a5; padding: 1em; + -webkit-border-radius: .25em; border-radius: .25em } diff --git a/src/themes/blueradiance/theme.css b/src/themes/blueradiance/theme.css index 5ab67ca317..02e8e46ea2 100644 --- a/src/themes/blueradiance/theme.css +++ b/src/themes/blueradiance/theme.css @@ -17,12 +17,19 @@ 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)) } @@ -37,6 +44,7 @@ html { .backgroundContainer { background: url(bg.jpg) center top no-repeat #033361; + -webkit-background-size: cover; background-size: cover } @@ -173,7 +181,7 @@ html { color: rgba(255, 255, 255, .78) } -@supports (backdrop-filter:blur(10px)) { +@supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) { .appfooter-blurred { background: rgba(1, 2, 50, .7); backdrop-filter: blur(20px) @@ -245,6 +253,7 @@ html { color: inherit; background: rgba(0, 0, 0, .5); border: .07em solid transparent; + -webkit-border-radius: .15em; border-radius: .15em } @@ -398,10 +407,18 @@ html { color: #fff } +.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) +} + .infoBanner { color: #ddd; background: #111; padding: 1em; + -webkit-border-radius: .25em; border-radius: .25em } @@ -433,7 +450,7 @@ html { } ::-webkit-scrollbar-track { - box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -442,7 +459,7 @@ html { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - border-radius: 2px; + -webkit-border-radius: 2px; background: center no-repeat #888 } diff --git a/src/themes/dark/theme.css b/src/themes/dark/theme.css index bff054169d..5758f5d097 100644 --- a/src/themes/dark/theme.css +++ b/src/themes/dark/theme.css @@ -20,6 +20,7 @@ html { } .skinHeader.semiTransparent { + -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, 0.4); } @@ -226,6 +227,7 @@ html { color: inherit; background: #292929; border: .07em solid #292929; + -webkit-border-radius: .15em; border-radius: .15em } @@ -375,10 +377,18 @@ html { color: #fff } +.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) +} + .infoBanner { color: #ddd; background: #111; padding: 1em; + -webkit-border-radius: .25em; border-radius: .25em } @@ -410,7 +420,7 @@ html { } ::-webkit-scrollbar-track { - box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -419,7 +429,7 @@ html { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - border-radius: 2px; + -webkit-border-radius: 2px; background: center no-repeat #888 } diff --git a/src/themes/light/theme.css b/src/themes/light/theme.css index 719678d0a6..65a9d5cf9f 100644 --- a/src/themes/light/theme.css +++ b/src/themes/light/theme.css @@ -23,14 +23,17 @@ 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); } @@ -246,6 +249,7 @@ html { color: inherit; background: #fff; border: .07em solid rgba(0, 0, 0, .158); + -webkit-border-radius: .15em; border-radius: .15em } @@ -392,10 +396,18 @@ html { color: #fff } +.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) +} + .infoBanner { color: #000; background: #fff3a5; padding: 1em; + -webkit-border-radius: .25em; border-radius: .25em } diff --git a/src/themes/purplehaze/theme.css b/src/themes/purplehaze/theme.css index c53e80e80a..1892423aeb 100644 --- a/src/themes/purplehaze/theme.css +++ b/src/themes/purplehaze/theme.css @@ -17,12 +17,19 @@ 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)) } @@ -37,6 +44,7 @@ html { .backgroundContainer { background: url(bg.jpg) center top no-repeat #030322; + -webkit-background-size: cover; background-size: cover } @@ -261,7 +269,7 @@ a[data-role=button] { color: rgba(255, 255, 255, .78) } -@supports (backdrop-filter:blur(10px)) { +@supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) { .appfooter-blurred { background: rgba(6, 37, 111, .7); backdrop-filter: blur(20px) @@ -333,6 +341,7 @@ a[data-role=button] { color: inherit; background: rgba(0, 0, 0, .5); border: .07em solid transparent; + -webkit-border-radius: .15em; border-radius: .15em } @@ -491,10 +500,18 @@ a[data-role=button] { color: #fff } +.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) +} + .infoBanner { color: #0e0f2d; background: #dbe6ff; padding: 1em; + -webkit-border-radius: .25em; border-radius: .25em } @@ -532,7 +549,7 @@ a[data-role=button] { } ::-webkit-scrollbar-track { - box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -541,7 +558,7 @@ a[data-role=button] { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - border-radius: 2px; + -webkit-border-radius: 2px; background: center no-repeat #888 } diff --git a/src/themes/wmc/theme.css b/src/themes/wmc/theme.css index e51f4311ef..0367f080dc 100644 --- a/src/themes/wmc/theme.css +++ b/src/themes/wmc/theme.css @@ -23,12 +23,19 @@ 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) } .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)) } @@ -39,6 +46,9 @@ 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) } @@ -160,6 +170,9 @@ 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) } @@ -226,6 +239,7 @@ html { color: inherit; background: rgba(255, 255, 255, .2); border: .07em solid rgba(255, 255, 255, .135); + -webkit-border-radius: .15em; border-radius: .15em } @@ -377,10 +391,18 @@ html { color: #fff } +.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) +} + .infoBanner { color: #000; background: #fff3a5; padding: 1em; + -webkit-border-radius: .25em; border-radius: .25em } @@ -412,7 +434,7 @@ html { } ::-webkit-scrollbar-track { - box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) + -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) } ::-webkit-scrollbar-track-piece { @@ -421,7 +443,7 @@ html { ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:vertical { - border-radius: 2px; + -webkit-border-radius: 2px; background: center no-repeat rgba(255, 255, 255, .7) } From b9b3cc7c2e565f50d0d1aab31539983ca7dc8cc9 Mon Sep 17 00:00:00 2001 From: MrTimscampi Date: Thu, 9 Jan 2020 19:40:23 +0100 Subject: [PATCH 2/4] Revert "Add autoprefix to postcss" This reverts commit 509af1a0c304ed41582f8dc966cbefc7fd3c827b. --- package.json | 4 +- postcss.config.js | 5 -- webpack.dev.js | 2 +- webpack.prod.js | 4 +- yarn.lock | 212 +++++----------------------------------------- 5 files changed, 25 insertions(+), 202 deletions(-) delete mode 100644 postcss.config.js diff --git a/package.json b/package.json index 76d01b1841..c5f0e75c8c 100644 --- a/package.json +++ b/package.json @@ -5,14 +5,12 @@ "repository": "https://github.com/jellyfin/jellyfin-web", "license": "GPL-2.0-or-later", "devDependencies": { - "autoprefixer": "^9.7.3", "clean-webpack-plugin": "^3.0.0", - "copy-webpack-plugin": "^5.1.1", + "copy-webpack-plugin": "^5.0.3", "css-loader": "^2.1.0", "eslint": "^5.16.0", "file-loader": "^3.0.1", "html-webpack-plugin": "^3.2.0", - "postcss-loader": "^3.0.0", "style-loader": "^0.23.1", "webpack": "^4.41.0", "webpack-cli": "^3.3.9", diff --git a/postcss.config.js b/postcss.config.js deleted file mode 100644 index a26de7e9f1..0000000000 --- a/postcss.config.js +++ /dev/null @@ -1,5 +0,0 @@ -module.exports = { - plugins: [ - require('autoprefixer') - ] -} diff --git a/webpack.dev.js b/webpack.dev.js index d3791e679f..3aecac1a53 100644 --- a/webpack.dev.js +++ b/webpack.dev.js @@ -15,7 +15,7 @@ module.exports = merge(common, { rules: [ { test: /\.css$/i, - use: ["style-loader", "css-loader", "postcss-loader"] + use: ["style-loader", "css-loader"] }, { test: /\.(png|jpg|gif)$/i, diff --git a/webpack.prod.js b/webpack.prod.js index 319d8f14fc..8880a2168c 100644 --- a/webpack.prod.js +++ b/webpack.prod.js @@ -13,12 +13,12 @@ module.exports = merge(common, { rules: [ { test: /\.css$/i, - use: ["style-loader", "css-loader", "postcss-loader"] + use: ["style-loader", "css-loader"] }, { test: /\.(png|jpg|gif)$/i, use: ["file-loader"] } ] - } + }, }); diff --git a/yarn.lock b/yarn.lock index 705eac6a19..6a7d56f9df 100644 --- a/yarn.lock +++ b/yarn.lock @@ -461,19 +461,6 @@ atob@^2.1.1: resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9" integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg== -autoprefixer@^9.7.3: - version "9.7.3" - resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.7.3.tgz#fd42ed03f53de9beb4ca0d61fb4f7268a9bb50b4" - integrity sha512-8T5Y1C5Iyj6PgkPSFd0ODvK9DIleuPKUPYniNxybS47g2k2wFgLZ46lGQHlBuGKIAEV8fbCDfKCCRS1tvOgc3Q== - dependencies: - browserslist "^4.8.0" - caniuse-lite "^1.0.30001012" - chalk "^2.4.2" - normalize-range "^0.1.2" - num2fraction "^1.2.2" - postcss "^7.0.23" - postcss-value-parser "^4.0.2" - balanced-match@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767" @@ -648,15 +635,6 @@ browserify-zlib@^0.2.0: dependencies: pako "~1.0.5" -browserslist@^4.8.0: - version "4.8.2" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.8.2.tgz#b45720ad5fbc8713b7253c20766f701c9a694289" - integrity sha512-+M4oeaTplPm/f1pXDw84YohEv7B1i/2Aisei8s4s6k3QsoSHa7i5sz8u/cGQkkatCPxMASKxPualR4wwYgVboA== - dependencies: - caniuse-lite "^1.0.30001015" - electron-to-chromium "^1.3.322" - node-releases "^1.1.42" - buffer-from@^1.0.0: version "1.1.1" resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef" @@ -696,17 +674,16 @@ bytes@3.1.0: resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.0.tgz#f6cf7933a360e0588fa9fde85651cdc7f805d1f6" integrity sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg== -cacache@^12.0.2: - version "12.0.2" - resolved "https://registry.yarnpkg.com/cacache/-/cacache-12.0.2.tgz#8db03205e36089a3df6954c66ce92541441ac46c" - integrity sha512-ifKgxH2CKhJEg6tNdAwziu6Q33EvuG26tYcda6PT3WKisZcYDXsnEdnRv67Po3yCzFfaSoMjGZzJyD2c3DT1dg== +cacache@^11.3.3: + version "11.3.3" + resolved "https://registry.yarnpkg.com/cacache/-/cacache-11.3.3.tgz#8bd29df8c6a718a6ebd2d010da4d7972ae3bbadc" + integrity sha512-p8WcneCytvzPxhDvYp31PD039vi77I12W+/KfR9S8AZbaiARFBCpsPJS+9uhWfeBfeAtW7o/4vt3MUqLkbY6nA== dependencies: bluebird "^3.5.5" chownr "^1.1.1" figgy-pudding "^3.5.1" glob "^7.1.4" graceful-fs "^4.1.15" - infer-owner "^1.0.3" lru-cache "^5.1.1" mississippi "^3.0.0" mkdirp "^0.5.1" @@ -717,10 +694,10 @@ cacache@^12.0.2: unique-filename "^1.1.1" y18n "^4.0.0" -cacache@^12.0.3: - version "12.0.3" - resolved "https://registry.yarnpkg.com/cacache/-/cacache-12.0.3.tgz#be99abba4e1bf5df461cd5a2c1071fc432573390" - integrity sha512-kqdmfXEGFepesTuROHMs3MpFLWrPkSSpRqOw80RCflZXy/khxaArvFrQ7uJxSUduzAufc6G0g1VUCOZXxWavPw== +cacache@^12.0.2: + version "12.0.2" + resolved "https://registry.yarnpkg.com/cacache/-/cacache-12.0.2.tgz#8db03205e36089a3df6954c66ce92541441ac46c" + integrity sha512-ifKgxH2CKhJEg6tNdAwziu6Q33EvuG26tYcda6PT3WKisZcYDXsnEdnRv67Po3yCzFfaSoMjGZzJyD2c3DT1dg== dependencies: bluebird "^3.5.5" chownr "^1.1.1" @@ -758,25 +735,6 @@ call-me-maybe@^1.0.1: resolved "https://registry.yarnpkg.com/call-me-maybe/-/call-me-maybe-1.0.1.tgz#26d208ea89e37b5cbde60250a15f031c16a4d66b" integrity sha1-JtII6onje1y95gJQoV8DHBak1ms= -caller-callsite@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/caller-callsite/-/caller-callsite-2.0.0.tgz#847e0fce0a223750a9a027c54b33731ad3154134" - integrity sha1-hH4PzgoiN1CpoCfFSzNzGtMVQTQ= - dependencies: - callsites "^2.0.0" - -caller-path@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/caller-path/-/caller-path-2.0.0.tgz#468f83044e369ab2010fac5f06ceee15bb2cb1f4" - integrity sha1-Ro+DBE42mrIBD6xfBs7uFbsssfQ= - dependencies: - caller-callsite "^2.0.0" - -callsites@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/callsites/-/callsites-2.0.0.tgz#06eb84f00eea413da86affefacbffb36093b3c50" - integrity sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA= - callsites@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73" @@ -795,11 +753,6 @@ camelcase@^5.0.0, camelcase@^5.2.0: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320" integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg== -caniuse-lite@^1.0.30001012, caniuse-lite@^1.0.30001015: - version "1.0.30001017" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001017.tgz#d3ad6ec18148b9bd991829958d9d7e562bb78cd6" - integrity sha512-EDnZyOJ6eYh6lHmCvCdHAFbfV4KJ9lSdfv4h/ppEhrU/Yudkl7jujwMZ1we6RX7DXqBfT04pVMQ4J+1wcTlsKA== - chalk@2.4.2, chalk@^2.0.0, chalk@^2.1.0, chalk@^2.4.2: version "2.4.2" resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424" @@ -1085,12 +1038,12 @@ copy-descriptor@^0.1.0: resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d" integrity sha1-Z29us8OZl8LuGsOpJP1hJHSPV40= -copy-webpack-plugin@^5.1.1: - version "5.1.1" - resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-5.1.1.tgz#5481a03dea1123d88a988c6ff8b78247214f0b88" - integrity sha512-P15M5ZC8dyCjQHWwd4Ia/dm0SgVvZJMYeykVIVYXbGyqO4dWB5oyPHp9i7wjwo5LhtlhKbiBCdS2NvM07Wlybg== +copy-webpack-plugin@^5.0.3: + version "5.0.4" + resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-5.0.4.tgz#c78126f604e24f194c6ec2f43a64e232b5d43655" + integrity sha512-YBuYGpSzoCHSSDGyHy6VJ7SHojKp6WHT4D7ItcQFNAYx2hrwkMe56e97xfVR0/ovDuMTrMffXUiltvQljtAGeg== dependencies: - cacache "^12.0.3" + cacache "^11.3.3" find-cache-dir "^2.1.0" glob-parent "^3.1.0" globby "^7.1.1" @@ -1098,9 +1051,9 @@ copy-webpack-plugin@^5.1.1: loader-utils "^1.2.3" minimatch "^3.0.4" normalize-path "^3.0.0" - p-limit "^2.2.1" + p-limit "^2.2.0" schema-utils "^1.0.0" - serialize-javascript "^2.1.2" + serialize-javascript "^1.7.0" webpack-log "^2.0.0" core-util-is@~1.0.0: @@ -1108,16 +1061,6 @@ core-util-is@~1.0.0: resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7" integrity sha1-tf1UIgqivFq1eqtxQMlAdUUDwac= -cosmiconfig@^5.0.0: - version "5.2.1" - resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-5.2.1.tgz#040f726809c591e77a17c0a3626ca45b4f168b1a" - integrity sha512-H65gsXo1SKjf8zmrJ67eJk8aIRKV5ff2D4uKZIBZShbhGSpEmsQOPW/SKMKYhSTrqR7ufy6RP69rPogdaPh/kA== - dependencies: - import-fresh "^2.0.0" - is-directory "^0.3.1" - js-yaml "^3.13.1" - parse-json "^4.0.0" - create-ecdh@^4.0.0: version "4.0.3" resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.3.tgz#c9111b6f33045c4697f144787f9254cdc77c45ff" @@ -1489,11 +1432,6 @@ ee-first@1.1.1: resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d" integrity sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0= -electron-to-chromium@^1.3.322: - version "1.3.322" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.322.tgz#a6f7e1c79025c2b05838e8e344f6e89eb83213a8" - integrity sha512-Tc8JQEfGQ1MzfSzI/bTlSr7btJv/FFO7Yh6tanqVmIWOuNCu6/D1MilIEgLtmWqIrsv+o4IjpLAhgMBr/ncNAA== - elliptic@^6.0.0: version "6.5.0" resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.0.tgz#2b8ed4c891b7de3200e14412a5b8248c7af505ca" @@ -1555,13 +1493,6 @@ errno@^0.1.3, errno@~0.1.7: dependencies: prr "~1.0.1" -error-ex@^1.3.1: - version "1.3.2" - resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz#b4ac40648107fdcdcfae242f428bea8a14d4f1bf" - integrity sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g== - dependencies: - is-arrayish "^0.2.1" - es-abstract@^1.5.1: version "1.16.2" resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.16.2.tgz#4e874331645e9925edef141e74fc4bd144669d34" @@ -2484,21 +2415,6 @@ ignore@^4.0.6: resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc" integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg== -import-cwd@^2.0.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/import-cwd/-/import-cwd-2.1.0.tgz#aa6cf36e722761285cb371ec6519f53e2435b0a9" - integrity sha1-qmzzbnInYShcs3HsZRn1PiQ1sKk= - dependencies: - import-from "^2.1.0" - -import-fresh@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-2.0.0.tgz#d81355c15612d386c61f9ddd3922d4304822a546" - integrity sha1-2BNVwVYS04bGH53dOSLUMEgipUY= - dependencies: - caller-path "^2.0.0" - resolve-from "^3.0.0" - import-fresh@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.1.0.tgz#6d33fa1dcef6df930fae003446f33415af905118" @@ -2507,13 +2423,6 @@ import-fresh@^3.0.0: parent-module "^1.0.0" resolve-from "^4.0.0" -import-from@^2.1.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/import-from/-/import-from-2.1.0.tgz#335db7f2a7affd53aaa471d4b8021dee36b7f3b1" - integrity sha1-M1238qev/VOqpHHUuAId7ja387E= - dependencies: - resolve-from "^3.0.0" - import-local@2.0.0, import-local@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/import-local/-/import-local-2.0.0.tgz#55070be38a5993cf18ef6db7e961f5bee5c5a09d" @@ -2646,11 +2555,6 @@ is-arguments@^1.0.4: resolved "https://registry.yarnpkg.com/is-arguments/-/is-arguments-1.0.4.tgz#3faf966c7cba0ff437fb31f6250082fcf0448cf3" integrity sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA== -is-arrayish@^0.2.1: - version "0.2.1" - resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d" - integrity sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0= - is-binary-path@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-1.0.1.tgz#75f16642b480f187a711c814161fd3a4a7655898" @@ -2705,11 +2609,6 @@ is-descriptor@^1.0.0, is-descriptor@^1.0.2: is-data-descriptor "^1.0.0" kind-of "^6.0.2" -is-directory@^0.3.1: - version "0.3.1" - resolved "https://registry.yarnpkg.com/is-directory/-/is-directory-0.3.1.tgz#61339b6f2475fc772fd9c9d83f5c8575dc154ae1" - integrity sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE= - is-extendable@^0.1.0, is-extendable@^0.1.1: version "0.1.1" resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89" @@ -2852,7 +2751,7 @@ js-tokens@^4.0.0: resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ== -js-yaml@^3.13.0, js-yaml@^3.13.1: +js-yaml@^3.13.0: version "3.13.1" resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847" integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw== @@ -2860,7 +2759,7 @@ js-yaml@^3.13.0, js-yaml@^3.13.1: argparse "^1.0.7" esprima "^4.0.0" -json-parse-better-errors@^1.0.1, json-parse-better-errors@^1.0.2: +json-parse-better-errors@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw== @@ -3380,13 +3279,6 @@ node-pre-gyp@^0.12.0: semver "^5.3.0" tar "^4" -node-releases@^1.1.42: - version "1.1.44" - resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.44.tgz#cd66438a6eb875e3eb012b6a12e48d9f4326ffd7" - integrity sha512-NwbdvJyR7nrcGrXvKAvzc5raj/NkoJudkarh2yIpJ4t0NH4aqjUDz/486P+ynIW5eokKOfzGNRdYoLfBlomruw== - dependencies: - semver "^6.3.0" - nopt@^4.0.1: version "4.0.1" resolved "https://registry.yarnpkg.com/nopt/-/nopt-4.0.1.tgz#d0d4685afd5415193c8c7505602d0d17cd64474d" @@ -3407,11 +3299,6 @@ normalize-path@^3.0.0: resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65" integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA== -normalize-range@^0.1.2: - version "0.1.2" - resolved "https://registry.yarnpkg.com/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942" - integrity sha1-LRDAa9/TEuqXd2laTShDlFa3WUI= - npm-bundled@^1.0.1: version "1.0.6" resolved "https://registry.yarnpkg.com/npm-bundled/-/npm-bundled-1.0.6.tgz#e7ba9aadcef962bb61248f91721cd932b3fe6bdd" @@ -3449,11 +3336,6 @@ nth-check@~1.0.1: dependencies: boolbase "~1.0.0" -num2fraction@^1.2.2: - version "1.2.2" - resolved "https://registry.yarnpkg.com/num2fraction/-/num2fraction-1.2.2.tgz#6f682b6a027a4e9ddfa4564cd2589d1d4e669ede" - integrity sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4= - number-is-nan@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d" @@ -3614,20 +3496,13 @@ p-is-promise@^2.0.0: resolved "https://registry.yarnpkg.com/p-is-promise/-/p-is-promise-2.1.0.tgz#918cebaea248a62cf7ffab8e3bca8c5f882fc42e" integrity sha512-Y3W0wlRPK8ZMRbNq97l4M5otioeA5lm1z7bkNkxCka8HSPjR0xRWmpCmc9utiaLP9Jb1eD8BgeIxTW4AIF45Pg== -p-limit@^2.0.0: +p-limit@^2.0.0, p-limit@^2.2.0: version "2.2.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.2.0.tgz#417c9941e6027a9abcba5092dd2904e255b5fbc2" integrity sha512-pZbTJpoUsCzV48Mc9Nh51VbwO0X9cuPFE8gYwx9BTCt9SF8/b7Zljd2fVgOxhIF/HDTKgpVzs+GPhyKfjLLFRQ== dependencies: p-try "^2.0.0" -p-limit@^2.2.1: - version "2.2.1" - resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.2.1.tgz#aa07a788cc3151c939b5131f63570f0dd2009537" - integrity sha512-85Tk+90UCVWvbDavCLKPOLC9vvY8OwEX/RtKF+/1OADJMVlFfEHOiMTPVyxg7mk/dKa+ipdHm0OUkTvCpMTuwg== - dependencies: - p-try "^2.0.0" - p-locate@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-3.0.0.tgz#322d69a05c0264b25997d9f40cd8a891ab0064a4" @@ -3692,14 +3567,6 @@ parse-asn1@^5.0.0: pbkdf2 "^3.0.3" safe-buffer "^5.1.1" -parse-json@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-4.0.0.tgz#be35f5425be1f7f6c747184f98a788cb99477ee0" - integrity sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA= - dependencies: - error-ex "^1.3.1" - json-parse-better-errors "^1.0.1" - parse-passwd@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6" @@ -3816,24 +3683,6 @@ posix-character-classes@^0.1.0: resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab" integrity sha1-AerA/jta9xoqbAL+q7jB/vfgDqs= -postcss-load-config@^2.0.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-2.1.0.tgz#c84d692b7bb7b41ddced94ee62e8ab31b417b003" - integrity sha512-4pV3JJVPLd5+RueiVVB+gFOAa7GWc25XQcMp86Zexzke69mKf6Nx9LRcQywdz7yZI9n1udOxmLuAwTBypypF8Q== - dependencies: - cosmiconfig "^5.0.0" - import-cwd "^2.0.0" - -postcss-loader@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/postcss-loader/-/postcss-loader-3.0.0.tgz#6b97943e47c72d845fa9e03f273773d4e8dd6c2d" - integrity sha512-cLWoDEY5OwHcAjDnkyRQzAXfs2jrKjXpO/HQFcc5b5u/r7aa471wdmChmwfnv7x2u840iat/wi0lQ5nbRgSkUA== - dependencies: - loader-utils "^1.1.0" - postcss "^7.0.0" - postcss-load-config "^2.0.0" - schema-utils "^1.0.0" - postcss-modules-extract-imports@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-2.0.0.tgz#818719a1ae1da325f9832446b01136eeb493cd7e" @@ -3880,20 +3729,6 @@ postcss-value-parser@^3.3.0, postcss-value-parser@^3.3.1: resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz#9ff822547e2893213cf1c30efa51ac5fd1ba8281" integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ== -postcss-value-parser@^4.0.2: - version "4.0.2" - resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.0.2.tgz#482282c09a42706d1fc9a069b73f44ec08391dc9" - integrity sha512-LmeoohTpp/K4UiyQCwuGWlONxXamGzCMtFxLq4W1nZVGIQLYvMCJx3yAF9qyyuFpflABI9yVdtJAqbihOsCsJQ== - -postcss@^7.0.0, postcss@^7.0.23: - version "7.0.25" - resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.25.tgz#dd2a2a753d50b13bed7a2009b4a18ac14d9db21e" - integrity sha512-NXXVvWq9icrm/TgQC0O6YVFi4StfJz46M1iNd/h6B26Nvh/HKI+q4YZtFN/EjcInZliEscO/WL10BXnc1E5nwg== - dependencies: - chalk "^2.4.2" - source-map "^0.6.1" - supports-color "^6.1.0" - postcss@^7.0.14, postcss@^7.0.5, postcss@^7.0.6: version "7.0.17" resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.17.tgz#4da1bdff5322d4a0acaab4d87f3e782436bad31f" @@ -4347,11 +4182,6 @@ serialize-javascript@^1.7.0: resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-1.7.0.tgz#d6e0dfb2a3832a8c94468e6eb1db97e55a192a65" integrity sha512-ke8UG8ulpFOxO8f8gRYabHQe/ZntKlcig2Mp+8+URDP1D8vJZ0KUt7LYo07q25Z/+JVSgpr/cui9PIp5H6/+nA== -serialize-javascript@^2.1.2: - version "2.1.2" - resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-2.1.2.tgz#ecec53b0e0317bdc95ef76ab7074b7384785fa61" - integrity sha512-rs9OggEUF0V4jUSecXazOYsLfu7OGK2qIn3c7IPBiffz32XniEp/TX9Xmc9LQfK2nQ2QKHvZ2oygKUGU0lG4jQ== - serve-index@^1.9.1: version "1.9.1" resolved "https://registry.yarnpkg.com/serve-index/-/serve-index-1.9.1.tgz#d3768d69b1e7d82e5ce050fff5b453bea12a9239" @@ -5099,10 +4929,10 @@ wbuf@^1.1.0, wbuf@^1.7.3: dependencies: minimalistic-assert "^1.0.0" -webcomponents.js@^0.7.24: +webcomponents.js-2@^0.7.24: version "0.7.24" - resolved "https://registry.yarnpkg.com/webcomponents.js/-/webcomponents.js-0.7.24.tgz#2116fbfa1468ec416a7befdaa333e1d118f69c04" - integrity sha1-IRb7+hRo7EFqe+/aozPh0Rj2nAQ= + resolved "https://registry.yarnpkg.com/webcomponents.js-2/-/webcomponents.js-2-0.7.24.tgz#c0ffef99749c3970aa3ae71363ea6f0a40bcada6" + integrity sha1-wP/vmXScOXCqOucTY+pvCkC8raY= webpack-cli@^3.3.9: version "3.3.9" From 5fb98e950bea3f59608ec373d96603e44ce1ce73 Mon Sep 17 00:00:00 2001 From: MrTimscampi Date: Sun, 19 Jan 2020 11:52:19 +0100 Subject: [PATCH 3/4] Correct the reverted changes that should be kept --- package.json | 2 +- src/assets/css/dashboard.css | 2 ++ src/assets/css/librarybrowser.css | 34 ++++++------------- src/assets/css/scrollstyles.css | 4 +-- src/assets/css/videoosd.css | 25 ++++++++++++-- src/components/cardbuilder/card.css | 3 +- .../remotecontrol/remotecontrol.css | 1 + src/themes/appletv/theme.css | 7 ---- src/themes/blueradiance/theme.css | 7 ---- src/themes/dark/theme.css | 7 ---- src/themes/light/theme.css | 7 ---- src/themes/purplehaze/theme.css | 7 ---- src/themes/wmc/theme.css | 7 ---- webpack.prod.js | 2 +- yarn.lock | 32 ++++++++--------- 15 files changed, 56 insertions(+), 91 deletions(-) diff --git a/package.json b/package.json index c5f0e75c8c..09b793cd3a 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "license": "GPL-2.0-or-later", "devDependencies": { "clean-webpack-plugin": "^3.0.0", - "copy-webpack-plugin": "^5.0.3", + "copy-webpack-plugin": "^5.1.1", "css-loader": "^2.1.0", "eslint": "^5.16.0", "file-loader": "^3.0.1", diff --git a/src/assets/css/dashboard.css b/src/assets/css/dashboard.css index 1c69dfccb4..d1f0b540aa 100644 --- a/src/assets/css/dashboard.css +++ b/src/assets/css/dashboard.css @@ -1,5 +1,6 @@ .dashboardColumn, .dashboardSections { + flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal } @@ -416,6 +417,7 @@ div[data-role=controlgroup] a.ui-btn-active { } a[data-role=button] { + background-clip: padding-box; -webkit-font-smoothing: antialiased; -webkit-user-select: none; -webkit-background-clip: padding-box; diff --git a/src/assets/css/librarybrowser.css b/src/assets/css/librarybrowser.css index c03cc2691f..8b312eed4b 100644 --- a/src/assets/css/librarybrowser.css +++ b/src/assets/css/librarybrowser.css @@ -488,9 +488,11 @@ } .detailImageContainer { - width: 280px; - margin-right: 2em; - flex-shrink: 0; + margin: 1.25em 0; + position: sticky; + top: 15%; + float: left; + width: 22.786458333333332vw; } .detailPagePrimaryContent { @@ -504,8 +506,8 @@ width: 25em; height: 9.375em; position: absolute; - top: 13.5%; - right: 19.5%; + top: 14.5%; + right: 10.5%; -webkit-background-size: contain; background-size: contain } @@ -535,13 +537,9 @@ } .itemDetailImage { - width: 100%; + width: 100% !important; + box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); - box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37) -} - -.thumbDetailImageContainer { - width: 400px } @media all and (max-width:62.5em) { @@ -554,19 +552,6 @@ } } -@media all and (min-width:62.5em) { - .itemBackdrop { - display: none - } - - .detailPagePrimaryContainer { - display: -webkit-box; - display: -webkit-flex; - display: flex; - margin-bottom: 3em - } -} - @media all and (max-width:75em) { .lnkSibling { display: none !important @@ -621,6 +606,7 @@ .detailButton-mobile, .mainDetailButtons { + display: flex; display: -webkit-box; display: -webkit-flex } diff --git a/src/assets/css/scrollstyles.css b/src/assets/css/scrollstyles.css index aa2f7dafad..431cd2ba1f 100644 --- a/src/assets/css/scrollstyles.css +++ b/src/assets/css/scrollstyles.css @@ -11,8 +11,6 @@ .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;*/ } .hiddenScrollX-forced { @@ -50,4 +48,4 @@ .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/assets/css/videoosd.css b/src/assets/css/videoosd.css index f9c4798e97..c43696dd45 100644 --- a/src/assets/css/videoosd.css +++ b/src/assets/css/videoosd.css @@ -1,5 +1,6 @@ .chapterThumbTextContainer, .videoOsdBottom { + user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none @@ -137,8 +138,10 @@ .osdMediaInfo, .volumeButtons { + display: flex; display: -webkit-box; display: -webkit-flex; + align-items: center; -webkit-box-align: center } @@ -218,9 +221,25 @@ 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); } } +@-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); + } +} + .osdMediaStatus .animate { -webkit-animation:spin 4s linear infinite; -moz-animation:spin 4s linear infinite; diff --git a/src/components/cardbuilder/card.css b/src/components/cardbuilder/card.css index e63b9a4bb1..96d0698f4b 100644 --- a/src/components/cardbuilder/card.css +++ b/src/components/cardbuilder/card.css @@ -83,7 +83,8 @@ button { /* 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 { diff --git a/src/components/remotecontrol/remotecontrol.css b/src/components/remotecontrol/remotecontrol.css index 9bd91731a7..cbd2f1fa06 100644 --- a/src/components/remotecontrol/remotecontrol.css +++ b/src/components/remotecontrol/remotecontrol.css @@ -53,6 +53,7 @@ .nowPlayingInfoControls, .nowPlayingTime { + display: flex; display: -webkit-box; display: -webkit-flex } diff --git a/src/themes/appletv/theme.css b/src/themes/appletv/theme.css index d194dc2034..6e580ebea1 100644 --- a/src/themes/appletv/theme.css +++ b/src/themes/appletv/theme.css @@ -404,13 +404,6 @@ html { color: #fff } -.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) -} - .infoBanner { color: #000; background: #fff3a5; diff --git a/src/themes/blueradiance/theme.css b/src/themes/blueradiance/theme.css index 02e8e46ea2..0c13a696b4 100644 --- a/src/themes/blueradiance/theme.css +++ b/src/themes/blueradiance/theme.css @@ -407,13 +407,6 @@ html { color: #fff } -.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) -} - .infoBanner { color: #ddd; background: #111; diff --git a/src/themes/dark/theme.css b/src/themes/dark/theme.css index 5758f5d097..fee28f50f0 100644 --- a/src/themes/dark/theme.css +++ b/src/themes/dark/theme.css @@ -377,13 +377,6 @@ html { color: #fff } -.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) -} - .infoBanner { color: #ddd; background: #111; diff --git a/src/themes/light/theme.css b/src/themes/light/theme.css index 65a9d5cf9f..0d96abc531 100644 --- a/src/themes/light/theme.css +++ b/src/themes/light/theme.css @@ -396,13 +396,6 @@ html { color: #fff } -.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) -} - .infoBanner { color: #000; background: #fff3a5; diff --git a/src/themes/purplehaze/theme.css b/src/themes/purplehaze/theme.css index 1892423aeb..c8d7aa465c 100644 --- a/src/themes/purplehaze/theme.css +++ b/src/themes/purplehaze/theme.css @@ -500,13 +500,6 @@ a[data-role=button] { color: #fff } -.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) -} - .infoBanner { color: #0e0f2d; background: #dbe6ff; diff --git a/src/themes/wmc/theme.css b/src/themes/wmc/theme.css index 0367f080dc..2901640809 100644 --- a/src/themes/wmc/theme.css +++ b/src/themes/wmc/theme.css @@ -391,13 +391,6 @@ html { color: #fff } -.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) -} - .infoBanner { color: #000; background: #fff3a5; diff --git a/webpack.prod.js b/webpack.prod.js index 8880a2168c..2055051dac 100644 --- a/webpack.prod.js +++ b/webpack.prod.js @@ -20,5 +20,5 @@ module.exports = merge(common, { use: ["file-loader"] } ] - }, + } }); diff --git a/yarn.lock b/yarn.lock index 6a7d56f9df..1526957e42 100644 --- a/yarn.lock +++ b/yarn.lock @@ -694,10 +694,10 @@ cacache@^11.3.3: unique-filename "^1.1.1" y18n "^4.0.0" -cacache@^12.0.2: - version "12.0.2" - resolved "https://registry.yarnpkg.com/cacache/-/cacache-12.0.2.tgz#8db03205e36089a3df6954c66ce92541441ac46c" - integrity sha512-ifKgxH2CKhJEg6tNdAwziu6Q33EvuG26tYcda6PT3WKisZcYDXsnEdnRv67Po3yCzFfaSoMjGZzJyD2c3DT1dg== +cacache@^12.0.3: + version "12.0.3" + resolved "https://registry.yarnpkg.com/cacache/-/cacache-12.0.3.tgz#be99abba4e1bf5df461cd5a2c1071fc432573390" + integrity sha512-kqdmfXEGFepesTuROHMs3MpFLWrPkSSpRqOw80RCflZXy/khxaArvFrQ7uJxSUduzAufc6G0g1VUCOZXxWavPw== dependencies: bluebird "^3.5.5" chownr "^1.1.1" @@ -1038,12 +1038,12 @@ copy-descriptor@^0.1.0: resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d" integrity sha1-Z29us8OZl8LuGsOpJP1hJHSPV40= -copy-webpack-plugin@^5.0.3: - version "5.0.4" - resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-5.0.4.tgz#c78126f604e24f194c6ec2f43a64e232b5d43655" - integrity sha512-YBuYGpSzoCHSSDGyHy6VJ7SHojKp6WHT4D7ItcQFNAYx2hrwkMe56e97xfVR0/ovDuMTrMffXUiltvQljtAGeg== +copy-webpack-plugin@^5.1.1: + version "5.1.1" + resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-5.1.1.tgz#5481a03dea1123d88a988c6ff8b78247214f0b88" + integrity sha512-P15M5ZC8dyCjQHWwd4Ia/dm0SgVvZJMYeykVIVYXbGyqO4dWB5oyPHp9i7wjwo5LhtlhKbiBCdS2NvM07Wlybg== dependencies: - cacache "^11.3.3" + cacache "^12.0.3" find-cache-dir "^2.1.0" glob-parent "^3.1.0" globby "^7.1.1" @@ -1051,9 +1051,9 @@ copy-webpack-plugin@^5.0.3: loader-utils "^1.2.3" minimatch "^3.0.4" normalize-path "^3.0.0" - p-limit "^2.2.0" + p-limit "^2.2.1" schema-utils "^1.0.0" - serialize-javascript "^1.7.0" + serialize-javascript "^2.1.2" webpack-log "^2.0.0" core-util-is@~1.0.0: @@ -2751,7 +2751,7 @@ js-tokens@^4.0.0: resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ== -js-yaml@^3.13.0: +js-yaml@^3.13.0, js-yaml@^3.13.1: version "3.13.1" resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847" integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw== @@ -2759,7 +2759,7 @@ js-yaml@^3.13.0: argparse "^1.0.7" esprima "^4.0.0" -json-parse-better-errors@^1.0.2: +json-parse-better-errors@^1.0.1, json-parse-better-errors@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw== @@ -4929,10 +4929,10 @@ wbuf@^1.1.0, wbuf@^1.7.3: dependencies: minimalistic-assert "^1.0.0" -webcomponents.js-2@^0.7.24: +webcomponents.js@^0.7.24: version "0.7.24" - resolved "https://registry.yarnpkg.com/webcomponents.js-2/-/webcomponents.js-2-0.7.24.tgz#c0ffef99749c3970aa3ae71363ea6f0a40bcada6" - integrity sha1-wP/vmXScOXCqOucTY+pvCkC8raY= + resolved "https://registry.yarnpkg.com/webcomponents.js/-/webcomponents.js-0.7.24.tgz#2116fbfa1468ec416a7befdaa333e1d118f69c04" + integrity sha1-IRb7+hRo7EFqe+/aozPh0Rj2nAQ= webpack-cli@^3.3.9: version "3.3.9" From 91f5866d354a3dc1ae1db0910e49f4e87dde3c8e Mon Sep 17 00:00:00 2001 From: MrTimscampi Date: Tue, 21 Jan 2020 20:13:19 +0100 Subject: [PATCH 4/4] Keep standard properties in CSS along with vendored --- src/assets/css/librarybrowser.css | 1 + src/elements/emby-checkbox/emby-checkbox.css | 10 ++++++++++ src/elements/emby-slider/emby-slider.css | 1 + 3 files changed, 12 insertions(+) diff --git a/src/assets/css/librarybrowser.css b/src/assets/css/librarybrowser.css index 8b312eed4b..6ca85ae941 100644 --- a/src/assets/css/librarybrowser.css +++ b/src/assets/css/librarybrowser.css @@ -110,6 +110,7 @@ .detailButton-mobile, .skinHeader { + flex-direction: column; -webkit-flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal diff --git a/src/elements/emby-checkbox/emby-checkbox.css b/src/elements/emby-checkbox/emby-checkbox.css index 5641893f63..a31691f9d3 100644 --- a/src/elements/emby-checkbox/emby-checkbox.css +++ b/src/elements/emby-checkbox/emby-checkbox.css @@ -115,6 +115,16 @@ margin-bottom: .25em; } +@keyframes repaintChrome { + from { + padding: 0; + } + + to { + padding: 0; + } +} + @-webkit-keyframes repaintChrome { from { padding: 0; diff --git a/src/elements/emby-slider/emby-slider.css b/src/elements/emby-slider/emby-slider.css index 945cdd5214..71f260772f 100644 --- a/src/elements/emby-slider/emby-slider.css +++ b/src/elements/emby-slider/emby-slider.css @@ -1,4 +1,5 @@ _:-ms-input-placeholder { + appearance: none; -ms-appearance: none; height: 2.223em; margin: 0;