Fix rebasing issues

src/components/cardbuilder/card.css

@@ -18,7 +18,7 @@ button::-moz-focus-inner {
     padding: 0;
     display: block;
     color: inherit !important;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     outline: none !important;
     cursor: pointer;
     contain: layout style;
@@ -55,17 +55,27 @@ button::-moz-focus-inner {
     contain: layout style;
 }
 
-.cardPadder-backdrop, .cardPadder-mixedBackdrop, .cardPadder-smallBackdrop, .cardPadder-overflowBackdrop, .cardPadder-overflowSmallBackdrop {
+.cardPadder-backdrop,
+ .cardPadder-mixedBackdrop,
+ .cardPadder-smallBackdrop,
+ .cardPadder-overflowBackdrop,
+ .cardPadder-overflowSmallBackdrop {
     padding-bottom: 56.25%;
     contain: strict;
 }
 
-.cardPadder-square, .cardPadder-mixedSquare, .cardPadder-overflowSquare, .overflowSquareCard-textCardPadder {
+.cardPadder-square,
+ .cardPadder-mixedSquare,
+ .cardPadder-overflowSquare,
+ .overflowSquareCard-textCardPadder {
     padding-bottom: 100%;
     contain: strict;
 }
 
-.cardPadder-portrait, .cardPadder-mixedPortrait, .cardPadder-overflowPortrait, .overflowPortraitCard-textCardPadder {
+.cardPadder-portrait,
+ .cardPadder-mixedPortrait,
+ .cardPadder-overflowPortrait,
+ .overflowPortraitCard-textCardPadder {
     padding-bottom: 150%;
     contain: strict;
 }
@@ -80,8 +90,9 @@ button::-moz-focus-inner {
     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);
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     outline: none !important;
     contain: layout;
     contain: style;
@@ -156,6 +167,7 @@ button::-moz-focus-inner {
     position: relative;
     background-clip: content-box !important;
     color: inherit;
+
     /* This is only needed for scalable cards */
     height: 100%;
     contain: strict;
@@ -177,13 +189,16 @@ button::-moz-focus-inner {
     left: 0;
     right: 0;
     bottom: 0;
+
     /* Needed in case this is a button */
     display: block;
+
     /* Needed in case this is a button */
     margin: 0 !important;
+
     /* Needed in safari */
     height: 100%;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     outline: none !important;
     contain: strict;
 }
@@ -227,6 +242,7 @@ button::-moz-focus-inner {
 .cardImage-img {
     max-height: 100%;
     max-width: 100%;
+
     /* This is simply for lazy image purposes, to ensure the image is visible sooner when scrolling */
     min-height: 70%;
     min-width: 70%;
@@ -303,7 +319,7 @@ button::-moz-focus-inner {
     background: transparent;
     padding: 0 !important;
     cursor: pointer;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     outline: none !important;
     color: inherit;
     vertical-align: middle;
@@ -475,13 +491,15 @@ button::-moz-focus-inner {
         width: 33.333333333333333333333333333333%;
     }
 
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 33.333333333333333333333333333333%;
     }
 }
 
 @media (min-width: 43.75em) {
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 25%;
     }
 }
@@ -497,7 +515,8 @@ button::-moz-focus-inner {
         width: 50%;
     }
 
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 20%;
     }
 
@@ -517,7 +536,8 @@ button::-moz-focus-inner {
         width: 25%;
     }
 
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 16.666666666666666666666666666667%;
     }
 
@@ -531,7 +551,8 @@ button::-moz-focus-inner {
 }
 
 @media (min-width: 87.5em) {
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 14.285714285714285714285714285714%;
     }
 
@@ -549,13 +570,15 @@ button::-moz-focus-inner {
         width: 20%;
     }
 
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 12.5%;
     }
 }
 
 @media (min-width: 120em) {
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 11.111111111111111111111111111111%;
     }
 }
@@ -565,7 +588,8 @@ button::-moz-focus-inner {
         width: 25%;
     }
 
-    .squareCard, .portraitCard {
+    .squareCard,
+ .portraitCard {
         width: 10%;
     }
 }
@@ -596,7 +620,8 @@ button::-moz-focus-inner {
     width: 72vw;
 }
 
-.overflowSquareCard, .overflowPortraitCard {
+.overflowSquareCard,
+ .overflowPortraitCard {
     width: 40vw;
 }
 
@@ -621,29 +646,34 @@ button::-moz-focus-inner {
 }
 
 @media (min-width: 43.75em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 23.1vw;
     }
 }
 
 @media (min-width: 48.125em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+ .overflowSmallBackdropCard {
         width: 30vw;
     }
 }
 
 @media (orientation: landscape) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+ .overflowSmallBackdropCard {
         width: 30vw;
     }
 
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 23.1vw;
     }
 }
 
 @media (orientation: landscape) and (min-width: 48.125em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+ .overflowSmallBackdropCard {
         width: 23.1vw;
     }
 }
@@ -655,51 +685,60 @@ button::-moz-focus-inner {
 }
 
 @media (min-width: 50em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 18.5vw;
     }
 }
 
 @media (min-width: 75em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+ .overflowSmallBackdropCard {
         width: 23.1vw;
     }
 
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 15.5vw;
     }
 }
 
 @media (min-width: 87.5em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 13.3vw;
     }
 }
 
 @media (min-width: 100em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+ .overflowSmallBackdropCard {
         width: 18.7vw;
     }
 
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 11.6vw;
     }
 }
 
 @media (min-width: 120em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 10.3vw;
     }
 }
 
 @media (min-width: 131.25em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+ .overflowPortraitCard {
         width: 9.3vw;
     }
 }
 
 @media (min-width: 156.25em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+ .overflowSmallBackdropCard {
         width: 15.6vw;
     }
 }
@@ -716,7 +755,8 @@ button::-moz-focus-inner {
     padding-bottom: 87.75%;
 }
 
-.itemsContainer-tv > .overflowSquareCard, .itemsContainer-tv > .overflowPortraitCard {
+.itemsContainer-tv > .overflowSquareCard,
+ .itemsContainer-tv > .overflowPortraitCard {
     width: 15.6vw;
 }
 

src/components/dialogHelper/dialoghelper.css

@@ -15,11 +15,12 @@
 
 .dialog {
     margin: 0;
-    border-radius: .2em;
+    border-radius: 0.2em;
     -webkit-font-smoothing: antialiased;
     border: 0;
     padding: 0;
     will-change: transform, opacity;
+
     /* Strict does not work well with actionsheet */
     contain: style paint;
     box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.4);
@@ -112,7 +113,8 @@
 }
 
 @media all and (max-width: 80em), all and (max-height: 45em) {
-    .dialog-fixedSize, .dialog-fullscreen-lowres {
+    .dialog-fixedSize,
+ .dialog-fullscreen-lowres {
         position: fixed !important;
         top: 0 !important;
         bottom: 0 !important;

src/components/formdialog.css

@@ -12,7 +12,8 @@
 }
 
 .formDialogHeaderTitle {
-    margin-left: .25em;
+    margin-left: 0.25em;
+
     /* In case of h1, h2, h3 */
     margin-top: 0;
     margin-bottom: 0;
@@ -46,6 +47,7 @@
     display: flex;
     position: absolute;
     padding: 1.25em 1em;
+
     /* Without this emby-checkbox is able to appear on top */
     z-index: 1;
     align-items: center;

src/components/guide/guide.css

@@ -91,24 +91,28 @@
     flex-shrink: 0;
 }
 
-.channelPrograms, .timeslotHeadersInner {
+.channelPrograms,
+ .timeslotHeadersInner {
     width: 1800vw;
 }
 
 @media all and (min-width: 37.5em) {
-    .channelPrograms, .timeslotHeadersInner {
+    .channelPrograms,
+ .timeslotHeadersInner {
         width: 1400vw;
     }
 }
 
 @media all and (min-width: 50em) {
-    .channelPrograms, .timeslotHeadersInner {
+    .channelPrograms,
+ .timeslotHeadersInner {
         width: 1200vw;
     }
 }
 
 @media all and (min-width: 80em) {
-    .channelPrograms, .timeslotHeadersInner {
+    .channelPrograms,
+ .timeslotHeadersInner {
         width: 810vw;
     }
 }
@@ -120,11 +124,13 @@
     width: 2.0833333333333333333333333333333%;
 }
 
-.programCell, .guide-channelHeaderCell {
+.programCell,
+ .guide-channelHeaderCell {
     outline: none !important;
 }
 
-.guide-channelHeaderCell, .guide-channelTimeslotHeader {
+.guide-channelHeaderCell,
+ .guide-channelTimeslotHeader {
     padding: 0 !important;
     cursor: pointer;
     outline: none !important;
@@ -138,6 +144,7 @@
     display: flex;
     align-items: center;
     text-decoration: none;
+
     /* Needed in firefox */
     text-align: left;
     contain: strict;
@@ -159,30 +166,35 @@
 /* Important - have to put the fixed width on channelsContainer, not the individual channelHeaderCell
    This was causing channelsContainer to extend beyond the fixed width on ps4, tizen, lg and opera tv.
 */
-.channelsContainer, .guide-channelTimeslotHeader {
+.channelsContainer,
+ .guide-channelTimeslotHeader {
     width: 24vw;
 }
 
 @media all and (min-width: 31.25em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+ .guide-channelTimeslotHeader {
         width: 16vw;
     }
 }
 
 @media all and (min-width: 37.5em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+ .guide-channelTimeslotHeader {
         width: 16vw;
     }
 }
 
 @media all and (min-width: 50em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+ .guide-channelTimeslotHeader {
         width: 14vw;
     }
 }
 
 @media all and (min-width: 80em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+ .guide-channelTimeslotHeader {
         width: 12vw;
     }
 }
@@ -201,20 +213,26 @@
 }
 
 @media all and (max-width: 50em) {
-    .newTvProgram, .liveTvProgram, .premiereTvProgram, .guideHdIcon {
+    .newTvProgram,
+ .liveTvProgram,
+ .premiereTvProgram,
+ .guideHdIcon {
         display: none;
     }
 }
 
-    .channelPrograms + .channelPrograms, .guide-channelHeaderCell + .guide-channelHeaderCell {
+    .channelPrograms + .channelPrograms,
+ .guide-channelHeaderCell + .guide-channelHeaderCell {
         margin-top: -1px;
     }
 
-.channelPrograms-tv, .guide-channelHeaderCell-tv {
+.channelPrograms-tv,
+ .guide-channelHeaderCell-tv {
     height: 3em;
 }
 
-.guide-channelTimeslotHeader, .timeslotHeader {
+.guide-channelTimeslotHeader,
+ .timeslotHeader {
     background: transparent !important;
     height: 2.8em;
 }
@@ -243,6 +261,7 @@
     text-decoration: none;
     overflow: hidden;
     align-items: center;
+
     /* Needed for Firefox */
     text-align: left;
     contain: strict;
@@ -259,6 +278,7 @@
     position: relative;
     flex-grow: 1;
     contain: layout style paint;
+
     /* transition: transform 60ms ease-out; */
 }
 
@@ -356,11 +376,13 @@
     flex-direction: column;
 }
 
-.channelsContainer, .programGrid {
+.channelsContainer,
+ .programGrid {
     contain: layout style paint;
 }
 
-.timerIcon, .seriesTimerIcon {
+.timerIcon,
+ .seriesTimerIcon {
     color: #c33 !important;
 }
 

src/components/homesections/homesections.css

@@ -10,8 +10,8 @@
 }
 
 .homeLibraryIcon {
-    margin-left: .5em;
-    margin-right: .5em;
+    margin-left: 0.5em;
+    margin-right: 0.5em;
     -webkit-flex-shrink: 0;
     flex-shrink: 0;
 }

src/components/images/style.css

@@ -1,5 +1,22 @@
 .lazy-image-fadein {
+    opacity: 0;
     animation: lazy-image-fadein 330ms ease-in normal both;
+    -webkit-animation-duration: 0.8s;
+    -moz-animation-duration: 0.8s;
+    -o-animation-duration: 0.8s;
+    animation-duration: 0.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, 0.5, 1);
+    -moz-animation-timing-function: cubic-bezier(0, 0, 0.5, 1);
+    -o-animation-timing-function: cubic-bezier(0, 0, 0.5, 1);
+    animation-timing-function: cubic-bezier(0, 0, 0.5, 1);
 }
 
 .lazy-image-fadein-fast {
@@ -16,26 +33,6 @@
     }
 }
 
-.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);
-}
-
 @keyframes popInAnimation {
     0% {
         opacity: 0;

src/components/imageuploader/style.css

@@ -1,6 +1,7 @@
 .imageEditor-dropZone {
-    border: .2em dashed currentcolor;
-    border-radius: .25em;
+    border: 0.2em dashed currentcolor;
+    border-radius: 0.25em;
+
     /* padding: 1.6em; */
     text-align: center;
     position: relative;

src/components/indicators/indicators.css

@@ -85,7 +85,8 @@
     color: #333;
 }
 
-.missingIndicator, .unairedIndicator {
+.missingIndicator,
+ .unairedIndicator {
     background: #c33;
     padding: 0.25em 0.5em;
     border-radius: 100em;

src/components/listview/listview.css

@@ -53,11 +53,15 @@
     transform: scale(1) !important;
 }
 
-.listItemImage, .listItemIcon, .listItemAside {
+.listItemImage,
+ .listItemIcon,
+ .listItemAside {
     flex-shrink: 0;
 }
 
-.listItemBody, .listItemImage, .listItemIcon {
+.listItemBody,
+ .listItemImage,
+ .listItemIcon {
     display: inline-block;
     vertical-align: middle;
 }
@@ -85,7 +89,9 @@
     justify-content: center;
 }
 
-.listItem, .listItemBody, .listItemMediaInfo {
+.listItem,
+ .listItemBody,
+ .listItemMediaInfo {
     display: flex;
     contain: layout style;
 }
@@ -253,7 +259,9 @@
 }
 
 @media all and (max-width: 50em) {
-    .listItem .endsAt, .listItem .criticRating, .listItem-overview {
+    .listItem .endsAt,
+ .listItem .criticRating,
+ .listItem-overview {
         display: none !important;
     }
 }

src/components/navdrawer/navdrawer.css

@@ -25,8 +25,8 @@
 }
 
 .drawer-open {
-    -webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, .4);
-    box-shadow: 2px 0 12px rgba(0, 0, 0, .4);
+    -webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, 0.4);
+    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.4);
 }
 
 .scrollContainer {
@@ -40,9 +40,9 @@
     right: 0;
     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;
+    -webkit-transition: opacity ease-in-out 0.38s, visibility ease-in-out 0.38s;
+    -o-transition: opacity ease-in-out 0.38s, visibility ease-in-out 0.38s;
+    transition: opacity ease-in-out 0.38s, visibility ease-in-out 0.38s;
     will-change: opacity;
     background-color: rgba(0, 0, 0, 0.3);
 }

src/components/nowplayingbar/nowplayingbar.css

@@ -28,7 +28,8 @@
     justify-content: center;
 }
 
-.mediaButton, .nowPlayingBarUserDataButtons .btnUserItemRating {
+.mediaButton,
+ .nowPlayingBarUserDataButtons .btnUserItemRating {
     vertical-align: middle;
     margin: 0;
     text-align: center;
@@ -62,6 +63,7 @@
 .nowPlayingBarCenter {
     vertical-align: middle;
     text-align: center;
+
     /* Need this to make sure it's on top of nowPlayingBarPositionContainer so that buttons are fully clickable */
     z-index: 2;
     flex-grow: 1;
@@ -89,7 +91,8 @@
 
 .nowPlayingBarRight {
     position: relative;
-    margin: 0 .5em 0 auto;
+    margin: 0 0.5em 0 auto;
+
     /* Need this to make sure it's on top of nowPlayingBarPositionContainer so that buttons are fully clickable */
     z-index: 2;
     display: flex;
@@ -161,7 +164,8 @@
 }
 
 @media all and (max-width: 24em) {
-    .nowPlayingBar .muteButton, .nowPlayingBar .unmuteButton {
+    .nowPlayingBar .muteButton,
+ .nowPlayingBar .unmuteButton {
         display: none;
     }
 }

src/components/remotecontrol/remotecontrol.css

@@ -12,23 +12,23 @@
     text-align: center;
 }
 
-.btnArrowUp{
+.btnArrowUp {
     border-radius: 40% 40% 10% 10%;
 }
 
-.btnArrowLeft{
+.btnArrowLeft {
     border-radius: 40% 10% 10% 40%;
 }
 
-.btnArrowRight{
+.btnArrowRight {
     border-radius: 10% 40% 40% 10%;
 }
 
-.btnArrowDown{
+.btnArrowDown {
     border-radius: 10% 10% 40% 40%;
 }
 
-.btnOk{
+.btnOk {
     border-radius: 10%;
 }
 
@@ -55,7 +55,7 @@
 .nowPlayingTime {
     display: flex;
     display: -webkit-box;
-    display: -webkit-flex
+    display: -webkit-flex;
 }
 
 .nowPlayingPageImageContainer {
@@ -99,7 +99,7 @@
     -moz-user-select: none;
     -webkit-user-drag: none;
     -webkit-user-select: none;
-    -ms-user-select: none
+    -ms-user-select: none;
 }
 
 @media all and (orientation: portrait) and (max-width: 50em) {
@@ -218,7 +218,8 @@
     .nowPlayingInfoButtons .nowPlayingPageUserDataButtons {
         display: none !important;
     }
-    .navigationSection .collapseContent i{
+
+    .navigationSection .collapseContent i {
         font-size: 4em;
     }
 }

src/components/slideshow/style.css

@@ -3,11 +3,14 @@
     background: #000;
 }
 
-.slideshowSwiperContainer, .swiper-wrapper, .swiper-slide {
+.slideshowSwiperContainer,
+ .swiper-wrapper,
+ .swiper-slide {
     background: #000;
 }
 
-.slideshowImage, .slideshowSwiperContainer {
+.slideshowImage,
+ .slideshowSwiperContainer {
     position: fixed;
     top: 0;
     right: 0;
@@ -32,6 +35,7 @@
     color: #fff;
     z-index: 1002;
     font-weight: normal;
+
     /* Add an outline */
     text-shadow: 3px 3px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
 }

src/components/viewManager/viewContainer.css

@@ -5,7 +5,9 @@
     right: 0;
     bottom: 0;
     contain: layout style size;
+
     /* Can't use will-change because it causes the alpha picker to move when the page scrolls */
+
     /* will-change: transform; */
 }