projects / libreplanet-static.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: e74994b)
add magic css to day and time
authorValessioBrito <contato@valessiobrito.com.br>
Wed, 20 Mar 2019 19:42:49 +0000 (15:42 -0400)
committerValessioBrito <contato@valessiobrito.com.br>
Wed, 20 Mar 2019 19:42:49 +0000 (15:42 -0400)
2019/tv.html patch | blob | blame | history

diff --git a/2019/tv.html b/2019/tv.html
index 0fff8aa76ec145b46e6051fd768cdd66824a2e3e..d1a8ae2010c2149601a5296fd54a6a536a5b02d6 100644 (file)
--- a/2019/tv.html
+++ b/2019/tv.html
@@ -98,19 +98,33 @@ footer .mpost a {
     align-items: center;
     width: 48%;
     padding: 0 0.5em;
+    float: left;
 }
 .content-ft:first-child {
     border-right: 3px solid #4F0276;
 }
 
+#content-program {
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+}
+
+#content-program .program-day  {
+  margin-top: 0%;
+  animation: slide-slow infinite;
+  animation-duration: 20s;
+  animation-direction: alternate;
+}
+
+@keyframes slide-slow {
+  from { margin-top: 1%; }
+  to { margin-top: -20%; }
+}
+
 .program-day-header {
   text-align: center;
   color: #FFF;
- /* 
-  color: #4F0276;
-  background: #52ce73;
-  border-radius: 100%;
-  */
 }
 
 .program-timeslot-header { 
@@ -187,8 +201,52 @@ aside { position: relative; }
   100% { left: 110%; opacity: 0; }
 }
 
+/* Hidden all content */
+.program-day,
+.program-timeslot { display: none; }
+
+/* Show specifiy day */
+.day23 #day-1-program,
+.day20 #day-2-program { display: block; }
+
+/* Show specifiy time */
+.time9 #day-1-timeslot-1,
+.time9 #day-1-timeslot-2,
+.time9 #day-1-timeslot-3,
+.time9 #day-1-timeslot-4,
+.time10 #day-1-timeslot-5,
+.time10 #day-1-timeslot-6,
+.time10 #day-1-timeslot-7,
+.time11 #day-1-timeslot-7,
+.time11 #day-1-timeslot-8,
+.time11 #day-1-timeslot-9,
+.time12 #day-1-timeslot-10,
+.time12 #day-1-timeslot-11,
+.time12 #day-1-timeslot-12,
+.time15 #day-1-timeslot-13,
+.time15 #day-1-timeslot-14,
+.time15 #day-1-timeslot-15,
+.time15 #day-1-timeslot-16,
+.time9 #day-2-timeslot-1,
+.time9 #day-2-timeslot-2,
+.time9 #day-2-timeslot-3,
+.time9 #day-2-timeslot-4,
+.time10 #day-2-timeslot-5,
+.time10 #day-2-timeslot-6,
+.time10 #day-2-timeslot-7,
+.time11 #day-2-timeslot-8,
+.time11 #day-2-timeslot-9,
+.time11 #day-2-timeslot-10, 
+.time12 #day-2-timeslot-11,
+.time12 #day-2-timeslot-12,
+.time13 #day-2-timeslot-13,
+.time13 #day-2-timeslot-14,
+.time17 #day-2-timeslot-15,
+.time17 #day-2-timeslot-16, 
+.time17 #day-2-timeslot-17 { display: block; }
+
 </style>
-<body>
+<body class="day time">
 
 <div class="wrapper">
   <header class="grid">
@@ -256,7 +314,13 @@ fetch(feedUrl).then((res) => {
                }
                document.querySelector('output').appendChild(frag)
        })
-}).catch(() => console.error('Error in fetching the RSS feed'))
+}).catch(() => console.error('Error in fetching the RSS feed'));
+
+var d = new Date();
+var h = d.getHours();
+var m = d.getDate();
+document.body.className = "day" + m + " time" + h;
+
 </script>
 </body>
 </html>