Fix intentation (CSS)

.stylelintrc

@@ -70,6 +70,7 @@
     "function-parentheses-newline-inside": "always-multi-line",
     "function-parentheses-space-inside": "never-single-line",
     "function-whitespace-after": "always",
+    "indentation": 4,
     "keyframe-declaration-no-important": true,
     "length-zero-no-unit": true,
     "max-empty-lines": 1,

src/assets/css/fonts.css

@@ -6,8 +6,8 @@ html {
 }
 
 h1,
- h2,
- h3 {
+h2,
+h3 {
     /* For better bolding, since Helvetica does not support 500 weight, and 600 is too thick */
     font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", 'Open Sans', sans-serif;
 }

src/assets/css/scrollstyles.css

@@ -10,7 +10,7 @@
 }
 
 .hiddenScrollX,
- .layout-tv .scrollX {
+.layout-tv .scrollX {
     -ms-overflow-style: none;
 }
 
@@ -19,7 +19,7 @@
 }
 
 .hiddenScrollX::-webkit-scrollbar,
- .layout-tv .scrollX::-webkit-scrollbar {
+.layout-tv .scrollX::-webkit-scrollbar {
     height: 0 !important;
     display: none;
 }
@@ -38,7 +38,7 @@
 }
 
 .hiddenScrollY,
- .layout-tv .smoothScrollY {
+.layout-tv .smoothScrollY {
     -ms-overflow-style: none;
 
     /* Can't do this because it not only hides the scrollbar, but also prevents scrolling */
@@ -51,8 +51,8 @@
 }
 
 .hiddenScrollY::-webkit-scrollbar,
- .layout-tv .smoothScrollY::-webkit-scrollbar,
- .layout-tv .scrollY::-webkit-scrollbar {
+.layout-tv .smoothScrollY::-webkit-scrollbar,
+.layout-tv .scrollY::-webkit-scrollbar {
     width: 0 !important;
     display: none;
 }

src/assets/css/videoosd.css

@@ -277,7 +277,7 @@
 
 @media all and (max-width: 50em) {
     .videoOsdBottom .btnFastForward,
- .videoOsdBottom .btnRewind {
+    .videoOsdBottom .btnRewind {
         display: none !important;
     }
 }

src/components/appfooter/appfooter.css

@@ -8,6 +8,6 @@
     contain: layout style;
 }
 
-    .appfooter.headroom--unpinned {
-        transform: translateY(100%) !important;
-    }
+.appfooter.headroom--unpinned {
+    transform: translateY(100%) !important;
+}

src/components/cardbuilder/card.css

@@ -56,26 +56,26 @@ button::-moz-focus-inner {
 }
 
 .cardPadder-backdrop,
- .cardPadder-mixedBackdrop,
- .cardPadder-smallBackdrop,
- .cardPadder-overflowBackdrop,
- .cardPadder-overflowSmallBackdrop {
+.cardPadder-mixedBackdrop,
+.cardPadder-smallBackdrop,
+.cardPadder-overflowBackdrop,
+.cardPadder-overflowSmallBackdrop {
     padding-bottom: 56.25%;
     contain: strict;
 }
 
 .cardPadder-square,
- .cardPadder-mixedSquare,
- .cardPadder-overflowSquare,
- .overflowSquareCard-textCardPadder {
+.cardPadder-mixedSquare,
+.cardPadder-overflowSquare,
+.overflowSquareCard-textCardPadder {
     padding-bottom: 100%;
     contain: strict;
 }
 
 .cardPadder-portrait,
- .cardPadder-mixedPortrait,
- .cardPadder-overflowPortrait,
- .overflowPortraitCard-textCardPadder {
+.cardPadder-mixedPortrait,
+.cardPadder-overflowPortrait,
+.overflowPortraitCard-textCardPadder {
     padding-bottom: 150%;
     contain: strict;
 }
@@ -492,14 +492,14 @@ button::-moz-focus-inner {
     }
 
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 33.333333333333333333333333333333%;
     }
 }
 
 @media (min-width: 43.75em) {
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 25%;
     }
 }
@@ -516,7 +516,7 @@ button::-moz-focus-inner {
     }
 
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 20%;
     }
 
@@ -537,7 +537,7 @@ button::-moz-focus-inner {
     }
 
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 16.666666666666666666666666666667%;
     }
 
@@ -552,7 +552,7 @@ button::-moz-focus-inner {
 
 @media (min-width: 87.5em) {
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 14.285714285714285714285714285714%;
     }
 
@@ -571,14 +571,14 @@ button::-moz-focus-inner {
     }
 
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 12.5%;
     }
 }
 
 @media (min-width: 120em) {
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 11.111111111111111111111111111111%;
     }
 }
@@ -589,7 +589,7 @@ button::-moz-focus-inner {
     }
 
     .squareCard,
- .portraitCard {
+    .portraitCard {
         width: 10%;
     }
 }
@@ -621,7 +621,7 @@ button::-moz-focus-inner {
 }
 
 .overflowSquareCard,
- .overflowPortraitCard {
+.overflowPortraitCard {
     width: 40vw;
 }
 
@@ -647,33 +647,33 @@ button::-moz-focus-inner {
 
 @media (min-width: 43.75em) {
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 23.1vw;
     }
 }
 
 @media (min-width: 48.125em) {
     .overflowBackdropCard,
- .overflowSmallBackdropCard {
+    .overflowSmallBackdropCard {
         width: 30vw;
     }
 }
 
 @media (orientation: landscape) {
     .overflowBackdropCard,
- .overflowSmallBackdropCard {
+    .overflowSmallBackdropCard {
         width: 30vw;
     }
 
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 23.1vw;
     }
 }
 
 @media (orientation: landscape) and (min-width: 48.125em) {
     .overflowBackdropCard,
- .overflowSmallBackdropCard {
+    .overflowSmallBackdropCard {
         width: 23.1vw;
     }
 }
@@ -686,59 +686,59 @@ button::-moz-focus-inner {
 
 @media (min-width: 50em) {
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 18.5vw;
     }
 }
 
 @media (min-width: 75em) {
     .overflowBackdropCard,
- .overflowSmallBackdropCard {
+    .overflowSmallBackdropCard {
         width: 23.1vw;
     }
 
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 15.5vw;
     }
 }
 
 @media (min-width: 87.5em) {
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 13.3vw;
     }
 }
 
 @media (min-width: 100em) {
     .overflowBackdropCard,
- .overflowSmallBackdropCard {
+    .overflowSmallBackdropCard {
         width: 18.7vw;
     }
 
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 11.6vw;
     }
 }
 
 @media (min-width: 120em) {
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 10.3vw;
     }
 }
 
 @media (min-width: 131.25em) {
     .overflowSquareCard,
- .overflowPortraitCard {
+    .overflowPortraitCard {
         width: 9.3vw;
     }
 }
 
 @media (min-width: 156.25em) {
     .overflowBackdropCard,
- .overflowSmallBackdropCard {
+    .overflowSmallBackdropCard {
         width: 15.6vw;
     }
 }
@@ -756,7 +756,7 @@ button::-moz-focus-inner {
 }
 
 .itemsContainer-tv > .overflowSquareCard,
- .itemsContainer-tv > .overflowPortraitCard {
+.itemsContainer-tv > .overflowPortraitCard {
     width: 15.6vw;
 }
 

src/components/dialogHelper/dialoghelper.css

@@ -114,7 +114,7 @@
 
 @media all and (max-width: 80em), all and (max-height: 45em) {
     .dialog-fixedSize,
- .dialog-fullscreen-lowres {
+    .dialog-fullscreen-lowres {
         position: fixed !important;
         top: 0 !important;
         bottom: 0 !important;

src/components/guide/guide.css

@@ -92,27 +92,27 @@
 }
 
 .channelPrograms,
- .timeslotHeadersInner {
+.timeslotHeadersInner {
     width: 1800vw;
 }
 
 @media all and (min-width: 37.5em) {
     .channelPrograms,
- .timeslotHeadersInner {
+    .timeslotHeadersInner {
         width: 1400vw;
     }
 }
 
 @media all and (min-width: 50em) {
     .channelPrograms,
- .timeslotHeadersInner {
+    .timeslotHeadersInner {
         width: 1200vw;
     }
 }
 
 @media all and (min-width: 80em) {
     .channelPrograms,
- .timeslotHeadersInner {
+    .timeslotHeadersInner {
         width: 810vw;
     }
 }
@@ -125,12 +125,12 @@
 }
 
 .programCell,
- .guide-channelHeaderCell {
+.guide-channelHeaderCell {
     outline: none !important;
 }
 
 .guide-channelHeaderCell,
- .guide-channelTimeslotHeader {
+.guide-channelTimeslotHeader {
     padding: 0 !important;
     cursor: pointer;
     outline: none !important;
@@ -167,34 +167,34 @@
    This was causing channelsContainer to extend beyond the fixed width on ps4, tizen, lg and opera tv.
 */
 .channelsContainer,
- .guide-channelTimeslotHeader {
+.guide-channelTimeslotHeader {
     width: 24vw;
 }
 
 @media all and (min-width: 31.25em) {
     .channelsContainer,
- .guide-channelTimeslotHeader {
+    .guide-channelTimeslotHeader {
         width: 16vw;
     }
 }
 
 @media all and (min-width: 37.5em) {
     .channelsContainer,
- .guide-channelTimeslotHeader {
+    .guide-channelTimeslotHeader {
         width: 16vw;
     }
 }
 
 @media all and (min-width: 50em) {
     .channelsContainer,
- .guide-channelTimeslotHeader {
+    .guide-channelTimeslotHeader {
         width: 14vw;
     }
 }
 
 @media all and (min-width: 80em) {
     .channelsContainer,
- .guide-channelTimeslotHeader {
+    .guide-channelTimeslotHeader {
         width: 12vw;
     }
 }
@@ -214,25 +214,25 @@
 
 @media all and (max-width: 50em) {
     .newTvProgram,
- .liveTvProgram,
- .premiereTvProgram,
- .guideHdIcon {
+    .liveTvProgram,
+    .premiereTvProgram,
+    .guideHdIcon {
         display: none;
     }
 }
 
-    .channelPrograms + .channelPrograms,
- .guide-channelHeaderCell + .guide-channelHeaderCell {
-        margin-top: -1px;
-    }
+.channelPrograms + .channelPrograms,
+.guide-channelHeaderCell + .guide-channelHeaderCell {
+    margin-top: -1px;
+}
 
 .channelPrograms-tv,
- .guide-channelHeaderCell-tv {
+.guide-channelHeaderCell-tv {
     height: 3em;
 }
 
 .guide-channelTimeslotHeader,
- .timeslotHeader {
+.timeslotHeader {
     background: transparent !important;
     height: 2.8em;
 }
@@ -377,12 +377,12 @@
 }
 
 .channelsContainer,
- .programGrid {
+.programGrid {
     contain: layout style paint;
 }
 
 .timerIcon,
- .seriesTimerIcon {
+.seriesTimerIcon {
     color: #c33 !important;
 }
 
@@ -425,11 +425,11 @@
     font-weight: normal;
 }
 
-    .guide-date-tab-button.emby-tab-button-active {
-        border-color: transparent !important;
-    }
+.guide-date-tab-button.emby-tab-button-active {
+    border-color: transparent !important;
+}
 
-    .guide-date-tab-button.show-focus:focus {
-        border-radius: 0.15em !important;
-        transform: none !important;
-    }
+.guide-date-tab-button.show-focus:focus {
+    border-radius: 0.15em !important;
+    transform: none !important;
+}

src/components/indicators/indicators.css

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

src/components/listview/listview.css

@@ -54,14 +54,14 @@
 }
 
 .listItemImage,
- .listItemIcon,
- .listItemAside {
+.listItemIcon,
+.listItemAside {
     flex-shrink: 0;
 }
 
 .listItemBody,
- .listItemImage,
- .listItemIcon {
+.listItemImage,
+.listItemIcon {
     display: inline-block;
     vertical-align: middle;
 }
@@ -90,8 +90,8 @@
 }
 
 .listItem,
- .listItemBody,
- .listItemMediaInfo {
+.listItemBody,
+.listItemMediaInfo {
     display: flex;
     contain: layout style;
 }
@@ -260,8 +260,8 @@
 
 @media all and (max-width: 50em) {
     .listItem .endsAt,
- .listItem .criticRating,
- .listItem-overview {
+    .listItem .criticRating,
+    .listItem-overview {
         display: none !important;
     }
 }

src/components/loading/loading.css

@@ -371,9 +371,9 @@
     border-color: inherit;
 }
 
-    .mdl-spinner__circle-clipper .mdl-spinner__circle {
-        width: 200%;
-    }
+.mdl-spinner__circle-clipper .mdl-spinner__circle {
+    width: 200%;
+}
 
 .mdl-spinner__circleLeft {
     border-right-color: transparent !important;

src/components/nowplayingbar/nowplayingbar.css

@@ -29,7 +29,7 @@
 }
 
 .mediaButton,
- .nowPlayingBarUserDataButtons .btnUserItemRating {
+.nowPlayingBarUserDataButtons .btnUserItemRating {
     vertical-align: middle;
     margin: 0;
     text-align: center;
@@ -165,7 +165,7 @@
 
 @media all and (max-width: 24em) {
     .nowPlayingBar .muteButton,
- .nowPlayingBar .unmuteButton {
+    .nowPlayingBar .unmuteButton {
         display: none;
     }
 }

src/components/slideshow/style.css

@@ -4,13 +4,13 @@
 }
 
 .slideshowSwiperContainer,
- .swiper-wrapper,
- .swiper-slide {
+.swiper-wrapper,
+.swiper-slide {
     background: #000;
 }
 
 .slideshowImage,
- .slideshowSwiperContainer {
+.slideshowSwiperContainer {
     position: fixed;
     top: 0;
     right: 0;

src/components/youtubeplayer/style.css

@@ -9,13 +9,13 @@
     align-items: center;
 }
 
-    .youtubePlayerContainer.onTop {
-        z-index: 1000;
-    }
+.youtubePlayerContainer.onTop {
+    z-index: 1000;
+}
 
-    .youtubePlayerContainer video {
-        margin: 0 !important;
-        padding: 0 !important;
-        width: 100%;
-        height: 100%;
-    }
+.youtubePlayerContainer video {
+    margin: 0 !important;
+    padding: 0 !important;
+    width: 100%;
+    height: 100%;
+}

src/elements/emby-button/emby-button.css

@@ -131,33 +131,33 @@
     z-index: 1;
 }
 
-    .paper-icon-button-light::-moz-focus-inner {
-        border: 0;
-    }
+.paper-icon-button-light::-moz-focus-inner {
+    border: 0;
+}
 
-    .paper-icon-button-light:disabled {
-        opacity: 0.3;
-        cursor: default;
-    }
+.paper-icon-button-light:disabled {
+    opacity: 0.3;
+    cursor: default;
+}
 
-    .paper-icon-button-light > i {
-        font-size: 1.66956521739130434em;
+.paper-icon-button-light > i {
+    font-size: 1.66956521739130434em;
 
-        /* Make sure its on top of the ripple */
-        position: relative;
-        z-index: 1;
-        vertical-align: middle;
-    }
+    /* Make sure its on top of the ripple */
+    position: relative;
+    z-index: 1;
+    vertical-align: middle;
+}
 
-    .paper-icon-button-light > div {
-        max-height: 100%;
-        transform: scale(1.8);
-        position: relative;
-        z-index: 1;
-        vertical-align: middle;
-        display: inline;
-        margin: 0 auto;
-    }
+.paper-icon-button-light > div {
+    max-height: 100%;
+    transform: scale(1.8);
+    position: relative;
+    z-index: 1;
+    vertical-align: middle;
+    display: inline;
+    margin: 0 auto;
+}
 
 .emby-button-foreground {
     position: relative;

src/elements/emby-checkbox/emby-checkbox.css

@@ -101,11 +101,11 @@
     flex-wrap: wrap;
 }
 
-    .checkboxList-verticalwrap > .emby-checkbox-label {
-        display: inline-flex;
-        margin: 0.3em 0 0.3em 0;
-        width: 12em;
-    }
+.checkboxList-verticalwrap > .emby-checkbox-label {
+    display: inline-flex;
+    margin: 0.3em 0 0.3em 0;
+    width: 12em;
+}
 
 .checkboxList-paperList {
     padding: 1em !important;

src/elements/emby-input/emby-input.css

@@ -21,9 +21,9 @@
     width: 100%;
 }
 
-    .emby-input::-moz-focus-inner {
-        border: 0;
-    }
+.emby-input::-moz-focus-inner {
+    border: 0;
+}
 
 .inputContainer {
     margin-bottom: 1.8em;

src/elements/emby-select/emby-select.css

@@ -20,14 +20,14 @@
     width: 100%;
 }
 
-    .emby-select[disabled] {
-        background: none !important;
-        border-color: transparent !important;
-        color: inherit !important;
-        -webkit-appearance: none;
-        -moz-appearance: none;
-        appearance: none;
-    }
+.emby-select[disabled] {
+    background: none !important;
+    border-color: transparent !important;
+    color: inherit !important;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+}
 
 .emby-select::-moz-focus-inner {
     border: 0;
@@ -38,10 +38,10 @@
     font-size: inherit;
 }
 
-    .selectContainer-inline > .emby-select[disabled] {
-        padding-left: 0;
-        padding-right: 0;
-    }
+.selectContainer-inline > .emby-select[disabled] {
+    padding-left: 0;
+    padding-right: 0;
+}
 
 .emby-select-focusscale {
     transition: transform 180ms ease-out !important;
@@ -49,10 +49,10 @@
     transform-origin: center center;
 }
 
-    .emby-select-focusscale:focus {
-        transform: scale(1.04);
-        z-index: 1;
-    }
+.emby-select-focusscale:focus {
+    transform: scale(1.04);
+    z-index: 1;
+}
 
 .emby-select + .fieldDescription {
     margin-top: 0.25em;

src/elements/emby-slider/emby-slider.css

@@ -31,55 +31,55 @@
     display: block;
 }
 
-    .mdl-slider::-moz-focus-outer {
-        border: 0;
-    }
+.mdl-slider::-moz-focus-outer {
+    border: 0;
+}
 
-    .mdl-slider::-ms-tooltip {
-        display: none;
-    }
+.mdl-slider::-ms-tooltip {
+    display: none;
+}
 
-    .mdl-slider::-webkit-slider-runnable-track {
-        background: transparent;
-    }
+.mdl-slider::-webkit-slider-runnable-track {
+    background: transparent;
+}
 
-    .mdl-slider::-moz-range-track {
-        background: #444;
-        border: none;
-        width: calc(100% - 20px);
-    }
+.mdl-slider::-moz-range-track {
+    background: #444;
+    border: none;
+    width: calc(100% - 20px);
+}
 
-    .mdl-slider::-moz-range-progress {
-        background: #00a4dc;
-        width: calc(100% - 20px);
-    }
+.mdl-slider::-moz-range-progress {
+    background: #00a4dc;
+    width: calc(100% - 20px);
+}
 
-    .mdl-slider::-ms-track {
-        background: none;
-        color: transparent;
-        height: 0.2em;
-        width: 100%;
-        border: none;
-    }
+.mdl-slider::-ms-track {
+    background: none;
+    color: transparent;
+    height: 0.2em;
+    width: 100%;
+    border: none;
+}
 
-    .mdl-slider::-ms-fill-lower {
-        display: none;
-    }
+.mdl-slider::-ms-fill-lower {
+    display: none;
+}
 
-    .mdl-slider::-ms-fill-upper {
-        display: none;
-    }
+.mdl-slider::-ms-fill-upper {
+    display: none;
+}
 
-    .mdl-slider::-webkit-slider-thumb {
-        -webkit-appearance: none;
-        width: 1.2em;
-        height: 1.2em;
-        box-sizing: border-box;
-        border-radius: 50%;
-        background: #00a4dc;
-        border: none;
-        transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
-    }
+.mdl-slider::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    width: 1.2em;
+    height: 1.2em;
+    box-sizing: border-box;
+    border-radius: 50%;
+    background: #00a4dc;
+    border: none;
+    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
+}
 
 .mdl-slider-hoverthumb::-webkit-slider-thumb {
     transform: none;

src/elements/emby-textarea/emby-textarea.css

@@ -21,9 +21,9 @@
     width: 100%;
 }
 
-    .emby-textarea::-moz-focus-inner {
-        border: 0;
-    }
+.emby-textarea::-moz-focus-inner {
+    border: 0;
+}
 
 .textareaLabel {
     display: inline-block;

src/themes/appletv/theme.css

@@ -7,7 +7,7 @@ html {
 .wizardStartForm,
 .ui-corner-all,
 .ui-shadow {
-  background-color: #303030;
+    background-color: #303030;
 }
 
 .emby-collapsible-button {

src/themes/blueradiance/theme.css

@@ -7,7 +7,7 @@ html {
 .wizardStartForm,
 .ui-corner-all,
 .ui-shadow {
-  background-color: #303030;
+    background-color: #303030;
 }
 
 .emby-collapsible-button {

src/themes/dark/theme.css

@@ -7,7 +7,7 @@ html {
 .wizardStartForm,
 .ui-corner-all,
 .ui-shadow {
-  background-color: #101010;
+    background-color: #101010;
 }
 
 .emby-collapsible-button {

src/themes/emby/theme.css

@@ -7,7 +7,7 @@ html {
 .wizardStartForm,
 .ui-corner-all,
 .ui-shadow {
-  background-color: #1f1f1f;
+    background-color: #1f1f1f;
 }
 
 .emby-collapsible-button {

src/themes/light/theme.css

@@ -7,7 +7,7 @@ html {
 .wizardStartForm,
 .ui-corner-all,
 .ui-shadow {
-  background-color: #303030;
+    background-color: #303030;
 }
 
 .emby-collapsible-button {

src/themes/wmc/theme.css

@@ -7,7 +7,7 @@ html {
 .wizardStartForm,
 .ui-corner-all,
 .ui-shadow {
-  background-color: #0c2450;
+    background-color: #0c2450;
 }
 
 .emby-collapsible-button {