more fun dash.html

Jesse-Hufstetler · Nov 18, 2023 · d8c4c58 · d8c4c58
1 parent 99b71ee
commit d8c4c58
Showing 1 changed file with 40 additions and 1 deletion.
diff --git a/dash.html b/dash.html
@@ -22,6 +22,7 @@
         text-align: center;
         font-size: 7vw;
         overflow: hidden;
+        text-shadow: #ffffff 0 0 10px;
     }
 
     div.outer-div {
@@ -53,10 +54,45 @@
         -ms-transform: translateY(-50%);
         transform: translateY(-50%);
     }
+
+
+    .bg {
+        animation: slide 3s ease-in-out infinite alternate;
+        background-image: linear-gradient(-60deg, #e0ff00 50%, #0099ff 50%);
+        bottom: 0;
+        left: -50%;
+        opacity: .5;
+        position: fixed;
+        right: -50%;
+        top: 0;
+        z-index: -1;
+    }
+
+    .bg2 {
+        animation-direction: alternate-reverse;
+        animation-duration: 4s;
+    }
+
+    .bg3 {
+        animation-duration: 5s;
+    }
+
+    @keyframes slide {
+        0% {
+            transform: translateX(-25%);
+        }
+
+        100% {
+            transform: translateX(25%);
+        }
+    }
     </style>
 </head>
 
 <body>
+    <div class="bg"></div>
+    <div class="bg bg2"></div>
+    <div class="bg bg3"></div>
     <div class='outer-div'>
         <div class='middle-div'>
             <div id="time" style="font-size: 20vw;"></div>
@@ -97,18 +133,21 @@
             mouseTimer = window.setTimeout(disappearCursor, 500);
         };
     })();
+    var dformat = 'dddd';
 
     function getWeather() {
         document.getElementById("day").innerText = momentProxy().format('MMMM Do YYYY')
-        document.getElementById("wday").innerText = momentProxy().format('ddd')
+        document.getElementById("wday").innerText = momentProxy().format(dformat)
         if (appid) fetch(`https://api.openweathermap.org/data/2.5/weather?zip=44720,US&appid=${appid}&units=imperial`)
             .then(response => response.json())
             .then(data => {
                 var feelsLike = Math.round(data.main.feels_like);
                 var dp = Math.round(dpF(data.main.humidity, data.main.temp));
                 console.log(data);
+                dformat = 'ddd';
                 document.getElementById("temp").innerText = `${feelsLike}°`;
                 document.getElementById("dp").innerText = `/${dp}°`;
+                document.getElementById("wday").innerText = momentProxy().format(dformat)
             });
     }
     document.onclick = function() {