live tv updates

dashboard-ui/css/card.css

@@ -88,8 +88,8 @@
 }*/
 
 .ui-page-theme-b .visualCardBox {
-    background: rgb(51, 51, 51);
-    border: 1px solid rgb(31, 31, 31);
+    background: rgba(45,45,45,.85);
+    border: 1px solid #1f1f1f;
     border-radius: 3px;
 }
 
@@ -365,10 +365,6 @@
 
 @media all and (min-width: 1600px) {
 
-    .squareCard {
-        width: 12.5%;
-    }
-
     .portraitCard {
         width: 12.5%;
     }
@@ -386,7 +382,7 @@
 @media all and (min-width: 1800px) {
 
     .squareCard {
-        width: 10%;
+        width: 12.5%;
     }
 
     .portraitCard {
@@ -398,8 +394,19 @@
     }
 }
 
+@media all and (min-width: 1920px) {
+
+    .squareCard {
+        width: 11.111111111111111111111111111111%;
+    }
+}
+
 @media all and (min-width: 2200px) {
 
+    .squareCard {
+        width: 10%;
+    }
+
     .backdropCard {
         width: 16.666666666666666666666666666667%;
     }

dashboard-ui/css/livetv.css

@@ -6,7 +6,7 @@
 .tvProgram {
     display: block;
     text-decoration: none;
-    font-weight: normal!important;
+    font-weight: normal !important;
     white-space: nowrap;
     position: relative;
 }
@@ -173,13 +173,13 @@
 }
 
 .channelTimeslotHeader {
-    border-right: 1px solid #4971A7;
+    border-right: 1px solid #38c;
 }
 
 .channelTimeslotHeader, .timeslotHeader {
-    background: #4971A7;
-    border-bottom: 1px solid #4971A7;
-    border-left: 1px solid #4971A7;
+    background: #38c;
+    border-bottom: 1px solid #38c;
+    border-left: 1px solid #38c;
 }
 
 .timeslotHeader, .channelTimeslotHeader {
@@ -190,8 +190,8 @@
     padding: .5em .5em;
     display: block;
     text-decoration: none;
-    font-weight: normal!important;
-    color: #fff!important;
+    font-weight: normal !important;
+    color: #fff !important;
     position: relative;
 }
 
@@ -228,8 +228,8 @@
     top: 0;
     display: block;
     text-decoration: none;
-    font-weight: normal!important;
-    color: #fff!important;
+    font-weight: normal !important;
+    color: #fff !important;
 }
 
 .timeslotCellInnerWithProgram {
@@ -278,60 +278,74 @@
 @media (min-height: 500px) {
 
     .channelList, .programGrid {
-        height: 290px;
+        height: 360px;
     }
 }
 
 @media (min-height: 600px) {
 
     .channelList, .programGrid {
-        height: 390px;
+        height: 400px;
     }
 }
 
 @media (min-height: 700px) {
 
     .channelList, .programGrid {
-        height: 490px;
+        height: 500px;
     }
 }
 
 @media (min-height: 800px) {
 
     .channelList, .programGrid {
-        height: 590px;
+        height: 600px;
     }
 }
 
 @media (min-height: 900px) {
 
     .channelList, .programGrid {
-        height: 690px;
+        height: 700px;
     }
 }
 
 @media (min-height: 1000px) {
 
     .channelList, .programGrid {
-        height: 790px;
+        height: 800px;
     }
 }
 
 @media (min-height: 1100px) {
 
     .channelList, .programGrid {
-        height: 890px;
+        height: 900px;
     }
 }
 
 @media (min-height: 1200px) {
 
     .channelList, .programGrid {
-        height: 950px;
+        height: 1000px;
     }
 }
 
-@media (max-width: 600px) {
+@media (min-height: 1300px) {
+
+    .channelList, .programGrid {
+        height: 1100px;
+    }
+}
+
+@media (min-height: 1400px) {
+
+    .channelList, .programGrid {
+        height: 1200px;
+    }
+}
+
+@media (max-width: 800px) {
 
     .guideChannelImage {
         display: none;
@@ -340,4 +354,12 @@
     .timerPageImageContainer {
         display: none !important;
     }
-}
+
+    .channelHeaderCell, .channelTimeslotHeader {
+        width: 89px;
+    }
+
+    .programGrid, .timeslotHeaders {
+        margin-left: 90px;
+    }
+}