webui: improve mobile temperature config layout

2026-06-08 10:40:11 -06:00
parent bd00b6e7ca
commit 094bfb33a4
2 changed files with 79 additions and 0 deletions
@@ -324,6 +324,73 @@ button[onclick^="scan"]{
  }
 }

+
+/* Mobile temperature config layout */
+.tempConfigCard{
+  border:1px solid var(--softline);
+  border-radius:18px;
+  padding:14px;
+  background:linear-gradient(180deg,#101a27,#0a111a);
+  display:grid;
+  gap:10px;
+}
+.tempConfigTop{
+  display:flex;
+  justify-content:space-between;
+  align-items:center;
+  gap:10px;
+}
+.tempConfigTitle{
+  font-size:16px;
+  font-weight:950;
+  color:#f4f8ff;
+}
+.tempConfigAddress{
+  font-size:12px;
+  color:#9daabe;
+  word-break:break-all;
+  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
+}
+.tempConfigControls{
+  display:grid;
+  grid-template-columns:1fr 1fr;
+  gap:10px;
+}
+.tempCheck{
+  min-height:44px;
+  border:1px solid var(--softline);
+  border-radius:14px;
+  padding:10px 12px;
+  display:flex;
+  align-items:center;
+  gap:9px;
+  background:#0b131d;
+  color:#dce7f6;
+  font-weight:800;
+}
+.tempCheck input{
+  width:22px;
+  height:22px;
+  min-height:0;
+  margin:0;
+}
+.tempClear{
+  width:100%;
+}
+@media(max-width:700px){
+  #tempConfigList{
+    display:grid;
+    gap:12px;
+  }
+  .tempConfigControls{
+    grid-template-columns:1fr;
+  }
+  .tempConfigTop{
+    display:grid;
+    gap:8px;
+  }
+}
+
 </style>
 </head>
 <body>
@@ -526,3 +526,15 @@ def test_embedded_webui_main_pages_are_mutually_exclusive():
    assert 'battery:"batteryPage"' in source
    assert 'config:"configPage"' in source
    assert 'showConfigSubtab("general")' in source
+
+
+def test_embedded_webui_mobile_temperature_config_cards():
+    source = firmware_source()
+
+    assert "/* Mobile temperature config layout */" in source
+    assert "tempConfigCard" in source
+    assert "tempConfigControls" in source
+    assert "Temp Slot ${i+1}" in source
+    assert "Clear Assignment" in source
+    assert "Weather Badge" in source
+    assert "@media(max-width:700px)" in source