rasmus/sensor-pico
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

AI update

Browse Source
This commit is contained in:
rasmus
2026-03-27 22:27:32 +01:00
parent 2a29f6667e
commit e8f90661d3
9 changed files with 963 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

217
fs/mqtt_config.html
View File

@@ -1,32 +1,189 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Konfiguration</title>
</head>
<body>
<h1>MQTT Konfiguration</h1>
<form action="/mqtt-config" method="post">
<label>MQTT Adresse:</label>
<input type="text" name="mqtt-address">
<br>
<label>MQTT Port:</label>
<input type="number" name="mqtt-port">
<br>
<label>MQTT User:</label>
<input type="text" name="mqtt-user">
<br>
<label>MQTT Passwort:</label>
<input type="password" name="mqtt-password">
<br>
<label>Messfrequenz (ms)</label>
<input type="number" name="measure-frequency">
<br>
<label>Pushfrequenz (s)</label>
<input type="number" name="push-frequency">
<br>
<input type="submit" value="Speichern">
</form>
</body>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MQTT Konfiguration</title>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
background: #0d1117;
color: #c9d1d9;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
}
.container { width: 100%; max-width: 420px; }
.back {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
color: #8b949e;
text-decoration: none;
margin-bottom: 24px;
transition: color 0.15s;
}
.back:hover { color: #388bfd; }
.card {
background: #161b22;
border: 1px solid #30363d;
border-radius: 12px;
padding: 28px;
}
.card-header {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 24px;
}
.card-icon {
width: 40px;
height: 40px;
background: #2d2016;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
flex-shrink: 0;
}
h1 {
font-size: 18px;
font-weight: 600;
color: #f0f6fc;
}
.card-subtitle {
font-size: 12px;
color: #8b949e;
margin-top: 2px;
}
.section-label {
font-size: 11px;
font-weight: 600;
color: #484f58;
text-transform: uppercase;
letter-spacing: 0.8px;
margin-bottom: 14px;
}
.form-group { margin-bottom: 16px; }
.form-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
margin-bottom: 16px;
}
label {
display: block;
font-size: 13px;
font-weight: 500;
color: #8b949e;
margin-bottom: 6px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
input[type="text"],
input[type="password"],
input[type="number"] {
width: 100%;
background: #0d1117;
border: 1px solid #30363d;
border-radius: 8px;
padding: 10px 12px;
font-size: 14px;
color: #f0f6fc;
outline: none;
transition: border-color 0.15s;
font-family: inherit;
}
input:focus { border-color: #388bfd; }
input::placeholder { color: #484f58; }
.divider {
border: none;
border-top: 1px solid #30363d;
margin: 22px 0;
}
.input-hint {
font-size: 11px;
color: #484f58;
margin-top: 4px;
}
button[type="submit"] {
width: 100%;
background: #238636;
border: 1px solid #2ea043;
border-radius: 8px;
padding: 11px;
font-size: 14px;
font-weight: 500;
color: #fff;
cursor: pointer;
transition: background 0.15s, border-color 0.15s;
font-family: inherit;
}
button[type="submit"]:hover {
background: #2ea043;
border-color: #3fb950;
}
button[type="submit"]:active { background: #1a7f37; }
</style>
</head>
<body>
<div class="container">
<a href="/" class="back">&#8592; Zurück</a>
<div class="card">
<div class="card-header">
<div class="card-icon">&#9881;</div>
<div>
<h1>MQTT &amp; Messung</h1>
<p class="card-subtitle">Broker und Intervalle konfigurieren</p>
</div>
</div>
<form action="/mqtt-config" method="post">
<p class="section-label">Broker</p>
<div class="form-row">
<div>
<div class="form-group">
<label for="mqtt-address">Adresse</label>
<input type="text" id="mqtt-address" name="mqtt-address" placeholder="192.168.1.100" autocomplete="off">
</div>
</div>
<div>
<div class="form-group">
<label for="mqtt-port">Port</label>
<input type="number" id="mqtt-port" name="mqtt-port" placeholder="1883" min="1" max="65535">
</div>
</div>
</div>
<div class="form-group">
<label for="mqtt-user">Benutzer</label>
<input type="text" id="mqtt-user" name="mqtt-user" placeholder="Optional" autocomplete="off">
</div>
<div class="form-group">
<label for="mqtt-password">Passwort</label>
<input type="password" id="mqtt-password" name="mqtt-password" placeholder="Optional" autocomplete="off">
</div>
<hr class="divider">
<p class="section-label">Intervalle</p>
<div class="form-row">
<div>
<label for="measure-frequency">Messintervall</label>
<input type="number" id="measure-frequency" name="measure-frequency" placeholder="500" min="1">
<p class="input-hint">in Millisekunden</p>
</div>
<div>
<label for="push-frequency">Sendeintervall</label>
<input type="number" id="push-frequency" name="push-frequency" placeholder="60" min="1">
<p class="input-hint">in Sekunden</p>
</div>
</div>
<hr class="divider">
<button type="submit">Speichern</button>
</form>
</div>
</div>
</body>
</html>