diff --git a/CHANGES.md b/CHANGES.md index 82e74991..d5141388 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -25,6 +25,14 @@ * Add api disabled error code for newznab providers * Add support for a proxy host PAC url on the General Config/Advanced Settings page * Add proxy request url parsing to enforce netloc only matching which prevents false positives when url query parts contain FQDNs +* Add scroll into view buttons when overdues shows are available on the Episodes page/DayByDay layout +* Add scroll into view buttons when future shows are available on the Episodes page/DayByDay layout +* Add qTips to episode names on the Episodes page/DayByDay layout +* Change Episodes page/List layout qtips to prepend show title to episode plot +* Change Episodes page/DayByDay layout qtips to prepend show title to episode plot +* Change Episodes page/DayByDay layout cards to display show title in a qtip when there is no plot +* Change position of "[paused]" text to top right of a card on the Episodes page/DayByDay layout +* Add "On Air until" text and overdue/on air colour bars to show episode states on the Episodes page/DayByDay layout [develop changelog] diff --git a/gui/slick/css/dark.css b/gui/slick/css/dark.css index e2f1656b..230bc637 100644 --- a/gui/slick/css/dark.css +++ b/gui/slick/css/dark.css @@ -632,6 +632,17 @@ h2.day, h2.network { color: #999; } +.over-layer0 { + background: rgb(61,61,61); +} + +.over-layer1 { + background: transparent; + color:white; + border-left: 1px solid rgb(34, 34, 34); + border-bottom :1px solid rgb(34, 34, 34) +} + .carousel-control { color: #297AB8; filter: alpha(opacity=100); diff --git a/gui/slick/css/light.css b/gui/slick/css/light.css index 44c86e0b..3dc56096 100644 --- a/gui/slick/css/light.css +++ b/gui/slick/css/light.css @@ -591,6 +591,20 @@ h2.day, h2.network { border-color: #CCC; } +.over-layer0 { + background: rgb(61,61,61); +} + +.over-layer1 { + background: transparent; + color:white; + border-left: 1px solid rgb(255,255,255); + border-bottom :1px solid rgb(255,255,255) +} + +.carousel-control, +.carousel-control:hover, +.carousel-control:focus, .day-of-week .text .airtime, .day-of-week .text .episode, .day-of-week .text .episode .name { @@ -611,15 +625,6 @@ h2.day, h2.network { color: #666; } -.carousel-control { - color: #000; -} - -.carousel-control:hover, -.carousel-control:focus { - color: #000; -} - .carousel-indicators li { background: #555; border: 1px solid #555; diff --git a/gui/slick/css/style.css b/gui/slick/css/style.css index 61293a86..a12bce43 100644 --- a/gui/slick/css/style.css +++ b/gui/slick/css/style.css @@ -1401,6 +1401,7 @@ episodeView.tmpl border-radius: 5px; } +.carousel-indicators li.listing-soon, .listing-default { background-color: #f5f1e4; } @@ -1409,14 +1410,17 @@ episodeView.tmpl background-color: #dfd; } +.carousel-indicators li.listing-overdue, .listing-overdue { background-color: #fdd; } +.carousel-indicators li.listing-default, .listing-toofar { background-color: #bedeed; } +.carousel-indicators li.listing-soon, span.listing-default { color: #826f30; border: 1px solid #826f30; @@ -1427,11 +1431,13 @@ span.listing-current { border: 1px solid #295730; } +.carousel-indicators li.listing-overdue, span.listing-overdue { color: #890000; border: 1px solid #890000; } +.carousel-indicators li.listing-default, span.listing-toofar { color: #1d5068; border: 1px solid #1d5068; @@ -1579,6 +1585,23 @@ h2.day, h2.network { width: 100% } +.daybyday-show .state { + height: 3px; +} + +.daybyday-show .listing-default { + background-color: transparent; +} + +.carousel-indicators li.listing-overdue, +.daybyday-show .listing-overdue { + background-color: #ffb0b0; +} + +.daybyday-show .listing-current { + background-color: #aaffaa; +} + .day-of-week .poster img { border: 1px solid; border-radius: 5px; @@ -1631,52 +1654,94 @@ h2.day, h2.network { margin-left: 0; } +.over-layer0 { + filter: alpha(opacity=60); + opacity: .6; +} + +.over-layer1 { + background: transparent; +} + +.over-layer0, +.over-layer1 { + position: absolute; + top: 0; + right: 0; + font-size: 10px; + padding: 4px 6px 2px 2px; +} + +.on-air0, +.on-air1 { + text-align: right; +} +.on-air0 { + background-color: #dfd !important; + filter: alpha(opacity=75); + opacity: .75; +} +.on-air1 { + color: #295730 !important; + border-left: 1px solid #295730 !important; + border-bottom: 1px solid #295730 !important; +} + .daybydayCarouselContainer { min-height: 20px; - padding: 19px; - margin-bottom: 20px; + margin: 19px 0; } .controlsBlock { position: relative; display: block; - width: 220px; + width: 180px; margin: 0 auto; - height: 45px; + height: 35px; text-align: center; } .carousel-control { - top: -24px; background: none !important; text-align: center; opacity: 0.75; + height: 20px; + width: 20px; + top:1px } .carousel-indicators { - position: absolute; - bottom: 12px; + top: 1px; } .carousel-indicators li { border-radius: 0; width: 12px; - height: 12px; + height: 18px; } .carousel-indicators .active { width: 14px; - height: 14px; -} + height: 20px; +} -@media screen and (min-width: 768px) { - .carousel-control .glyphicon-chevron-left, - .carousel-control .glyphicon-chevron-right { - width: 30px; - height: 30px; - margin-top: 0; - font-size: 20px; - } +.carousel-control.right { + right: 4px +} + +.carousel-control .glyphicon-chevron-left { + margin-left: -10px; +} +.carousel-control .glyphicon-chevron-right { + margin-right: -10px; +} +.carousel-control .glyphicon-chevron-left, +.carousel-control .glyphicon-chevron-right { + width: 20px; + height: 20px; + margin-top: 0; + font-size: 20px; + top:0; } /* ======================================================================= diff --git a/gui/slick/interfaces/default/episodeView.tmpl b/gui/slick/interfaces/default/episodeView.tmpl index 14157702..fa41f1e2 100644 --- a/gui/slick/interfaces/default/episodeView.tmpl +++ b/gui/slick/interfaces/default/episodeView.tmpl @@ -108,6 +108,19 @@ \$(this).removeClass(sortdir).addClass(newdir); uiSortBy(\$('#sort').val()); }); + + \$('.carousel').on('slide.bs.carousel', function () { + imagesLoaded('.daybyday-show', function() { + jQuery.each(\$container, function(j) { + this.isotope('layout'); + }); + }); + }); + + \$('div[title!=""], span[title!=""]').qtip({style: {classes: 'qtip-rounded qtip-shadow'}, + position: {viewport: \$(window), my: 'left center', adjust: {y: -10, x: 0}}, + show: {solo: true} + }); }); //--> @@ -133,7 +146,7 @@