webUI

2026-03-30 11:59:12 +03:00 · 2021-12-13 16:40:44 +03:00
parent d083fbf9cf
commit 32350ddaf1
31 changed files with 860 additions and 149 deletions
--- a/data_ms/dashboard/index.html
+++ b/data_ms/dashboard/index.html
@@ -0,0 +1,104 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width,initial-scale=1" />
+
+    <title>LiveControl v 0.3.2</title>
+
+    <link rel="icon" type="image/png" href="/favicon.ico" />
+    <link rel="stylesheet" href="/dashboard/global.css" />
+    <link rel="stylesheet" href="/dashboard/build/bundle.css" />
+
+    <script defer src="/dashboard/build/bundle.js" onload="loadPage()"></script>
+    <script>
+         function get_cookie ( cookie_name ){
+              var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)' );
+              if ( results )
+              return ( unescape ( results[2] ) );
+              else
+              return null;
+              }
+             
+               if (get_cookie("darktheme") == "true"){
+                var myColor = "#1d3040";
+    document.write('\
+        <style>\
+            body{\
+                background-color: '+myColor+';\
+            }\
+        </style>\
+    ');
+               }
+            
+      function loadPage() {
+        document.getElementById("status").style.display = "none";
+      }
+      
+    </script>
+
+
+    <style>
+      
+       .rotate-shadows {
+        width: 220px;
+        height: 220px;
+        margin:0 auto;
+        position: relative;
+      }
+      .rotate-shadows:after,
+      .rotate-shadows:before {
+        content: "";
+        border-radius: 150%;
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        transform-origin: center center;
+      }
+      .rotate-shadows:before {
+        box-shadow: inset 0 20px 0 rgba(0, 250, 250, 0.2),
+          inset 20px 0 0 rgba(0, 200, 200, 0.2),
+          inset 0 -20px 0 rgba(0, 150, 200, 0.2),
+          inset -20px 0 0 rgba(0, 200, 250, 0.2);
+        animation: rotate-before 9s -0.5s linear infinite;
+      }
+      .rotate-shadows:after {
+        box-shadow: inset 0 20px 0 rgba(250, 250, 0, 0.2),
+          inset 20px 0 0 rgba(250, 200, 0, 0.2),
+          inset 0 -20px 0 rgba(250, 150, 0, 0.2),
+          inset -20px 0 0 rgba(250, 100, 0, 0.2);
+        animation: rotate-after 9s -0.5s linear infinite;
+      }
+      @keyframes rotate-after {
+        0% {
+          transform: rotateZ(0deg) scaleX(1) scaleY(1);
+        }
+        50% {
+          transform: rotateZ(180deg) scaleX(0.82) scaleY(0.95);
+        }
+        100% {
+          transform: rotateZ(360deg) scaleX(1) scaleY(1);
+        }
+      }
+      @keyframes rotate-before {
+        0% {
+          transform: rotateZ(0deg) scaleX(1) scaleY(1);
+        }
+        50% {
+          transform: rotateZ(-180deg) scaleX(0.95) scaleY(0.85);
+        }
+        100% {
+          transform: rotateZ(-360deg) scaleX(1) scaleY(1);
+        }
+      }
+    </style>
+  </head>
+
+  <body>
+  
+    <p><div id="status" class="rotate-shadows"></div></p>
+    
+  </body>
+</html>