diff --git a/firmware/html/style.css b/firmware/html/style.css
index ec5cadd..2485906 100644
--- a/firmware/html/style.css
+++ b/firmware/html/style.css
@@ -1,101 +1,107 @@
/* Vereinheitlichter Look */
body {
-font-family: Arial, sans-serif;
+ font-family: Arial, sans-serif;
}
/* Gemeinsame Regeln für die Tabs */
#tab-lights,
#tab-config,
#tab-tde {
-display: none;
-background-color: #ffffff;
-color: black;
-font-weight: bold;
-padding: 10px;
-border-radius: 3px;
+ display: none;
+ background-color: #ffffff;
+ color: black;
+ font-weight: bold;
+ padding: 10px;
+ border-radius: 3px;
}
/* Sichtbarkeitsregeln für die Tabs */
#tab-lights.visible,
#tab-config.visible,
#tab-tde.visible {
-display: block;
+ display: block;
}
/* Gemeinsame Regeln für Tabellenzellen */
.pure-table td {
-padding: 4px;
+ padding: 4px;
+ vertical-align: top;
+ /* Hinzugefügt: vertikale Ausrichtung oben */
}
/* Stil für Formularelemente */
.pure-form input[type="number"] {
-width: 60px;
-height: 20px;
-border-radius: 3px;
-border: 1px solid #ccc;
+ width: 60px;
+ height: 20px;
+ border-radius: 3px;
+ border: 1px solid #ccc;
}
.pure-form select {
-width: 80px;
-height: 26px;
-border-radius: 3px;
-border: 1px solid #ccc;
-background-color: #fff;
+ width: 80px;
+ height: 26px;
+ border-radius: 3px;
+ border: 1px solid #ccc;
+ background-color: #fff;
}
/* Stil für Buttons */
.pure-button {
-background-color: #5a5a5a;
-color: #fff;
-border-radius: 3px;
-border: none;
-padding: 8px 12px;
-font-size: 14px;
-cursor: pointer;
+ background-color: #5a5a5a;
+ color: #fff;
+ border-radius: 3px;
+ border: none;
+ padding: 8px 12px;
+ font-size: 14px;
+ cursor: pointer;
}
.pure-button:hover {
-background-color: #333;
+ background-color: #333;
}
/* Stil für die Toast-Nachrichten */
.toast {
-position: fixed;
-bottom: 10px;
-left: 50%;
-transform: translateX(-50%);
-padding: 10px;
-border-radius: 5px;
-color: #fff;
-font-size: 16px;
-font-weight: bold;
-text-align: center;
-opacity: 0;
-transition: opacity 0.5s ease-in-out;
+ position: fixed;
+ bottom: 10px;
+ left: 50%;
+ transform: translateX(-50%);
+ padding: 10px;
+ border-radius: 5px;
+ color: #fff;
+ font-size: 16px;
+ font-weight: bold;
+ text-align: center;
+ opacity: 0;
+ transition: opacity 0.5s ease-in-out;
}
.toast.success {
-background-color: #4caf50;
+ background-color: #4caf50;
}
.toast.error {
-background-color: #f44336;
+ background-color: #f44336;
}
/* Stil für den Range-Slider */
input[type=range] {
--webkit-appearance: none;
-width: 70%;
-height: 7px;
-margin: 4px 0;
-background-color: #ddd;
+ -webkit-appearance: none;
+ width: 70%;
+ height: 7px;
+ margin: 4px 0;
+ background-color: #ddd;
}
input[type=range]:focus {
-outline: none;
+ outline: none;
}
/* Spezifischer Stil für Elemente mit ID, die mit "bri" beginnen */
[id^="bri"] {
-width: 50%;
+ width: 50%;
}
+
+.top-align {
+ vertical-align: top;
+}
\ No newline at end of file