thomas
/
giess-o-mat
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

add support for dark-mode in web ui

Thomas Buck 1 year ago
parent
a0f699d41d
commit
3a80536871
2 changed files with 53 additions and 16 deletions
Split View Show Diff Stats
  1. 8
    0
      src/SimpleUpdater.cpp
  2. 45
    16
      src/WifiStuff.cpp

+ 8
- 0
src/SimpleUpdater.cpp View File 

@@ -35,6 +35,14 @@ void SimpleUpdater::get(void) {
35 35 
         "<meta name='viewport' content='width=device-width, initial-scale=1'/>\n"
36 36 
         "<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>\n"
37 37 
         "<title>SimpleUpdater ESP32</title>\n"
38 
+        "<style>\n"
39 
+        "@media (prefers-color-scheme: dark) {\n"
40 
+            "body {\n"
41 
+                "background-color: black;\n"
42 
+                "color: white;\n"
43 
+            "}\n"
44 
+        "}\n"
45 
+        "</style>\n"
38 46 
         "</head><body>\n"
39 47
40 48 
         "<h1>SimpleUpdater</h1>\n"

+ 45
- 16
src/WifiStuff.cpp View File 

@@ -377,8 +377,37 @@ void handleRoot() {
377 377 
     message += F("#state {\n");
378 378 
     message += F("text-align: center;\n");
379 379 
     message += F("}\n");
380 
+
381 
+    message += F("@media (prefers-color-scheme: dark) {\n");
382 
+    message += F("body {\n");
383 
+    message += F("background-color: black;\n");
384 
+    message += F("color: white;\n");
385 
+    message += F("}\n");
386 
+    message += F(".ui {\n");
387 
+    message += F("border: 1px dashed white;\n");
388 
+    message += F("}\n");
389 
+    message += F(".io {\n");
390 
+    message += F("border: 1px dashed white;\n");
391 
+    message += F("}\n");
392 
+    message += F(".ioelem {\n");
393 
+    message += F("border: 1px solid white;\n");
394 
+    message += F("}\n");
395 
+    message += F(".info {\n");
396 
+    message += F("border: 1px dashed white;\n");
397 
+    message += F("}\n");
398 
+    message += F(".log {\n");
399 
+    message += F("border: 1px dashed white;\n");
400 
+    message += F("}\n");
401 
+    message += F(".pad {\n");
402 
+    message += F("background: #222222;\n");
403 
+    message += F("border: 3px solid white;\n");
404 
+    message += F("}\n");
405 
+    message += F(".lcd {\n");
406 
+    message += F("border: 5px solid white;\n");
407 
+    message += F("}\n");
408 
+    message += F("}\n");
409 
+
380 410 
     message += F("</style>\n");
381 
-
382 411 
     message += F("</head><body>\n");
383 412 
     message += F("<h1 class='head'>Gieß-o-mat</h1>\n");
384 413 
 
@@ -456,6 +485,21 @@ void handleRoot() {
456 485 
         message += F("</div>");
457 486 
     }
458 487 
     message += F("</div><hr>\n");
488 
+
489 
+    message += F("Kickstart:\n");
490 
+    message += F("<div class='container'>\n");
491 
+    for (int i = 0; i < VALVE_COUNT - 1; i++) {
492 
+        message += F("<div class='ioelem kickstart' style='background-color: ");
493 
+        if (get_plants()->getKickstart()->getPin(i)) {
494 
+            message += F("red");
495 
+        } else {
496 
+            message += F("green");
497 
+        }
498 
+        message += F(";'>A");
499 
+        message += String(i + 1);
500 
+        message += F("</div>");
501 
+    }
502 
+    message += F("</div><hr>\n");
459 503
460 504 
     message += F("Valves:\n");
461 505 
     message += F("<div class='container'>\n");
 
@@ -502,21 +546,6 @@ void handleRoot() {
502 546 
     }
503 547 
     message += F("</div><hr>\n");
504 548
505 
-    message += F("Kickstart:\n");
506 
-    message += F("<div class='container'>\n");
507 
-    for (int i = 0; i < VALVE_COUNT - 1; i++) {
508 
-        message += F("<div class='ioelem kickstart' style='background-color: ");
509 
-        if (get_plants()->getKickstart()->getPin(i)) {
510 
-            message += F("red");
511 
-        } else {
512 
-            message += F("green");
513 
-        }
514 
-        message += F(";'>A");
515 
-        message += String(i + 1);
516 
-        message += F("</div>");
517 
-    }
518 
-    message += F("</div><hr>\n");
519 
-
520 549 
     message += F("Green means valve is closed / pump is off / switch is not submersed.\n");
521 550 
     message += F("<br>\n");
522 551 
     message += F("Red means valve is open / pump is running / switch is submersed.</div>\n");

Write Preview
Loading…
Cancel
Save