Add Web UI reference page

astro.config.mjs

@@ -214,6 +214,7 @@ export default defineConfig({
             },
             { label: "Plugins", slug: "reference/plugins" },
             { label: "Modbus", slug: "reference/modbus" },
+            { label: "Web UI", slug: "reference/web-ui" },
             {
               label: "CLI",
               collapsed: true,

src/content/docs/de/reference/web-ui.md

@@ -0,0 +1,84 @@
+---
+title: "Web UI"
+sidebar:
+  order: 3
+---
+
+Die Weboberfläche läuft auf Port `7070` und nutzt Hash-Routing.
+Über die URL lassen sich Seite und Anzeigeeinstellungen festlegen.
+
+## Verfügbare Seiten {#links}
+
+Jede Seite hat ihre eigene Hash-Route.
+Du kannst direkt darauf verlinken oder sie als Lesezeichen speichern.
+
+| Seite              | Route        | Login | Parameter                                         |
+| ------------------ | ------------ | ----- | ------------------------------------------------- |
+| Start / Ladepunkte | `#/`         | nein  | `lp`                                              |
+| Hausbatterie       | `#/battery`  | nein  | —                                                 |
+| Vorhersage         | `#/forecast` | nein  | —                                                 |
+| Ladevorgänge       | `#/sessions` | nein  | `month`, `year`, `loadpoint`, `vehicle`, `period` |
+| Konfiguration      | `#/config`   | ja    | —                                                 |
+| Logs               | `#/log`      | ja    | `areas`, `level`                                  |
+| Historie 🧪        | `#/history`  | nein  | `day`, `month`, `year`, `period`                  |
+| Optimize 🧪        | `#/optimize` | nein  | —                                                 |
+| Problem melden     | `#/issue`    | ja    | —                                                 |
+
+🧪 kennzeichnet experimentelle Seiten.
+
+| Parameter   | Beschreibung                                  |
+| ----------- | --------------------------------------------- |
+| `lp`        | Ladepunkt-Nummer, beginnend bei `1`           |
+| `year`      | Anzuzeigendes Jahr, z. B. `2026`              |
+| `month`     | Monat, `1`–`12`                               |
+| `day`       | Tag des Monats, `1`–`31`                      |
+| `period`    | Zeitraum: `day`, `month`, `year` oder `total` |
+| `loadpoint` | Titel des Ladepunkts                          |
+| `vehicle`   | Titel des Fahrzeugs                           |
+| `areas`     | Anzuzeigende Log-Bereiche, kommagetrennt      |
+| `level`     | Minimales Log-Level                           |
+
+### Beispiele {#examples}
+
+Wählt einen Ladepunkt auf dem Startbildschirm vor:
+
+```
+http://evcc.local:7070/#/?lp=1
+```
+
+Am einfachsten kommst du an den passenden Link, indem du den Ladepunkt in der Oberfläche auswählst und die Adresse aus dem Browser kopierst.
+
+Filtere **Ladevorgänge** oder **Historie** nach Zeitraum oder Gerät:
+
+```
+http://evcc.local:7070/#/sessions?year=2026&month=3
+```
+
+## Einstellungen anwenden {#settings}
+
+Die unter **Mehr → Darstellung** wählbaren Einstellungen lassen sich auch über die URL setzen.
+So lässt sich das Aussehen der Oberfläche unabhängig von den im Browser gespeicherten Einstellungen erzwingen, etwa für Kiosk-Bildschirme, Dashboards und iframe-Einbindungen:
+
+| Name       | Parameter | Werte                   |
+| ---------- | --------- | ----------------------- |
+| Design     | `theme`   | `auto`, `light`, `dark` |
+| Sprache    | `lang`    | `auto`, `de`, …         |
+| Einheit    | `unit`    | `km`, `mi`              |
+| Zeitformat | `format`  | `12`, `24`              |
+
+### Beispiel {#example}
+
+```
+http://evcc.local:7070/?theme=dark&lang=de&unit=mi&format=24
+```
+
+Die Werte werden beim Laden einmalig angewendet, als Browser-Einstellung gespeichert und dann aus der Adresszeile entfernt.
+
+`lang` akzeptiert jeden Sprachcode mit Übersetzung im [`i18n`-Ordner](https://github.com/evcc-io/evcc/tree/master/i18n) (z. B. `de`, `fr`, `zh-Hans`) oder `auto` für die Browsersprache.
+
+Einstellungen und eine Seite lassen sich in einer URL kombinieren.
+Die Einstellungen stehen vor dem `#`, die Seite dahinter:
+
+```
+http://evcc.local:7070/?theme=dark&lang=de#/sessions
+```

src/content/docs/en/reference/web-ui.md

@@ -0,0 +1,84 @@
+---
+title: "Web UI"
+sidebar:
+  order: 3
+---
+
+The web UI runs on port `7070` and uses hash routing.
+The URL can set both the page and the display settings.
+
+## Available Pages {#links}
+
+Each page has its own hash route.
+Link to it directly or bookmark it.
+
+| Page              | Route        | Login | Parameters                                        |
+| ----------------- | ------------ | ----- | ------------------------------------------------- |
+| Home / loadpoints | `#/`         | no    | `lp`                                              |
+| Home Battery      | `#/battery`  | no    | —                                                 |
+| Forecast          | `#/forecast` | no    | —                                                 |
+| Charging Sessions | `#/sessions` | no    | `month`, `year`, `loadpoint`, `vehicle`, `period` |
+| Configuration     | `#/config`   | yes   | —                                                 |
+| Logs              | `#/log`      | yes   | `areas`, `level`                                  |
+| History 🧪        | `#/history`  | no    | `day`, `month`, `year`, `period`                  |
+| Optimize 🧪       | `#/optimize` | no    | —                                                 |
+| Report a problem  | `#/issue`    | yes   | —                                                 |
+
+🧪 marks experimental pages.
+
+| Parameter   | Description                                   |
+| ----------- | --------------------------------------------- |
+| `lp`        | Loadpoint number, starting at `1`             |
+| `year`      | Year to show, e.g. `2026`                     |
+| `month`     | Month, `1`–`12`                               |
+| `day`       | Day of month, `1`–`31`                        |
+| `period`    | Time range: `day`, `month`, `year` or `total` |
+| `loadpoint` | Loadpoint title                               |
+| `vehicle`   | Vehicle title                                 |
+| `areas`     | Log areas to show, comma-separated            |
+| `level`     | Minimum log level                             |
+
+### Examples {#examples}
+
+Pre-select a loadpoint on the home screen:
+
+```
+http://evcc.local:7070/#/?lp=1
+```
+
+The simplest way to get the right link is to select the loadpoint in the UI and copy the address from your browser.
+
+Filter **Charging Sessions** or **History** by time range or device:
+
+```
+http://evcc.local:7070/#/sessions?year=2026&month=3
+```
+
+## Applying Settings {#settings}
+
+The options under **More → User Interface** can also be set through the URL.
+This forces the UI's appearance regardless of any stored browser preference, useful for kiosk screens, dashboards and iframe embeds:
+
+| Name        | Parameter | Values                  |
+| ----------- | --------- | ----------------------- |
+| Design      | `theme`   | `auto`, `light`, `dark` |
+| Language    | `lang`    | `auto`, `de`, …         |
+| Units       | `unit`    | `km`, `mi`              |
+| Time format | `format`  | `12`, `24`              |
+
+### Example {#example}
+
+```
+http://evcc.local:7070/?theme=dark&lang=de&unit=mi&format=24
+```
+
+The values are applied once on load, stored as a browser preference and then removed from the address bar.
+
+`lang` accepts any language code with a translation in the [`i18n` folder](https://github.com/evcc-io/evcc/tree/master/i18n) (e.g. `de`, `fr`, `zh-Hans`) or `auto` to follow the browser language.
+
+Settings and a page can be combined in one URL.
+Settings go before the `#`, the page after it:
+
+```
+http://evcc.local:7070/?theme=dark&lang=de#/sessions
+```