From e3e6afbbe36a81c470a74706dbfdd5abd79c8397 Mon Sep 17 00:00:00 2001
From: Lord-Grey <lordgrey.emmel@gmail.com>
Date: Fri, 2 Jan 2026 22:09:15 +0100
Subject: [PATCH 1/4] Update HyperBian doc for Trixie

---
 .../theme/components/WifiConfigGenerator.vue  | 252 ++++++++++++++++++
 docs/.vitepress/theme/index.ts                |   2 +
 docs/user/HyperBian.md                        | 175 +++++++-----
 3 files changed, 363 insertions(+), 66 deletions(-)
 create mode 100644 docs/.vitepress/theme/components/WifiConfigGenerator.vue

diff --git a/docs/.vitepress/theme/components/WifiConfigGenerator.vue b/docs/.vitepress/theme/components/WifiConfigGenerator.vue
new file mode 100644
index 00000000..9cbc5a02
--- /dev/null
+++ b/docs/.vitepress/theme/components/WifiConfigGenerator.vue
@@ -0,0 +1,252 @@
+<template>
+  <div class="wifi-config-generator">
+    <h2>WiFi Configuration Generator</h2>
+    <p>Generate a customized WiFi configuration for your HyperBian system.</p>
+    
+    <form @submit.prevent="generateConfig" class="config-form">
+      <div class="form-group">
+        <label for="ssid">SSID (Network Name):</label>
+        <input 
+          type="text" 
+          id="ssid" 
+          v-model="ssid" 
+          placeholder="Enter your WiFi network name"
+          required
+        />
+      </div>
+      
+      <div class="form-group">
+        <label for="password">Password:</label>
+        <div class="password-wrapper">
+          <input 
+            :type="showPassword ? 'text' : 'password'" 
+            id="password" 
+            v-model="password" 
+            placeholder="Enter your WiFi password"
+            required
+          />
+          <span @click="togglePasswordVisibility" class="password-toggle-icon">
+            <svg v-if="showPassword" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>
+            <svg v-else xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>
+          </span>
+        </div>
+      </div>
+      
+      <div class="form-group">
+        <label for="country">Country Code:</label>
+        <input 
+          type="text" 
+          id="country" 
+          v-model="country" 
+          placeholder="e.g., DE, US, GB"
+          pattern="[A-Z]{2}"
+          title="Two uppercase letters (e.g., DE, US, GB)"
+          maxlength="2"
+          required
+        />
+      </div>
+      
+      <button type="submit" class="generate-btn">Save WiFi Config</button>
+    </form>
+    
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+
+const ssid = ref('')
+const password = ref('')
+const country = ref('DE')
+const showPassword = ref(false)
+
+const togglePasswordVisibility = () => {
+  showPassword.value = !showPassword.value;
+};
+
+const configTemplate = `####################################################################################
+## Configure your initial HyperBian WiFi connectivity to your needs below.
+## Uncomment and edit the relevant sections as needed.
+##
+## If you have additional needs refer to the cloud-init documentation 
+## and the netplan reference for full details:
+##
+## https://netplan.io/reference
+## https://cloudinit.readthedocs.io/en/latest/topics/network-config.html
+## https://cloudinit.readthedocs.io/en/latest/topics/network-config-format-v2.html
+####################################################################################
+
+network:
+  version: 2 
+  wifis:
+    wlan0:
+      dhcp4: true
+      optional: true
+      access-points:
+        "SSID":
+          password: "PASSWORD"
+      regulatory-domain: COUNTRY`
+
+const generateConfig = () => {
+  // Escape special characters for YAML
+  const escape = (str) => str.replace(/\\/g, '\\\\').replace(/"/g, '\\"');
+
+  // Replace placeholders with user input (escaped for YAML)  
+  const config = configTemplate
+    .replace('"SSID"', `"${escape(ssid.value)}"`)
+    .replace('"PASSWORD"', `"${escape(password.value)}"`)
+    .replace('COUNTRY', country.value.toUpperCase());
+
+  const blob = new Blob([config], { type: 'application/octet-stream' });
+  const link = document.createElement('a');
+  link.href = URL.createObjectURL(blob);
+  link.download = 'network-config';
+  link.click();
+  URL.revokeObjectURL(link.href);
+};
+
+</script>
+
+<style scoped>
+.wifi-config-generator {
+  max-width: 800px;
+  margin: 0;
+  padding: 0;
+}
+
+.wifi-config-generator h2 {
+  margin-top: 0;
+  margin-bottom: 10px;
+}
+
+.wifi-config-generator p {
+  margin-bottom: 20px;
+  color: var(--vp-c-text-2);
+}
+
+.password-wrapper {
+  position: relative;
+}
+
+.password-toggle-icon {
+  position: absolute;
+  top: 50%;
+  right: 10px;
+  transform: translateY(-50%);
+  cursor: pointer;
+  color: var(--vp-c-text-2);
+}
+
+.config-form {
+  background: var(--vp-c-bg-soft);
+  padding: 20px;
+  border-radius: 8px;
+  margin-bottom: 30px;
+}
+
+.form-group {
+  margin-bottom: 15px;
+}
+
+.form-group label {
+  display: block;
+  margin-bottom: 5px;
+  font-weight: 600;
+  color: var(--vp-c-text-1);
+}
+
+.form-group input {
+  width: 100%;
+  padding: 10px;
+  padding-right: 40px; /* Make space for the icon */
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 4px;
+  font-size: 14px;
+  background: var(--vp-c-bg);
+  color: var(--vp-c-text-1);
+  box-sizing: border-box;
+}
+
+.form-group input:focus {
+  outline: none;
+  border-color: var(--vp-c-brand-1);
+}
+
+.generate-btn {
+  background: var(--vp-c-brand-1);
+  color: white;
+  border: none;
+  padding: 12px 24px;
+  border-radius: 4px;
+  font-size: 16px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.generate-btn:hover {
+  background: var(--vp-c-brand-2);
+}
+
+.config-output {
+  margin-top: 30px;
+}
+
+.config-output h3 {
+  margin-bottom: 10px;
+}
+
+.instruction {
+  margin-bottom: 15px;
+  padding: 10px;
+  background: var(--vp-c-tip-soft);
+  border-left: 4px solid var(--vp-c-tip-1);
+  border-radius: 4px;
+}
+
+.instruction code {
+  background: var(--vp-c-bg);
+  padding: 2px 6px;
+  border-radius: 3px;
+  font-family: var(--vp-font-family-mono);
+}
+
+.config-content {
+  background: var(--vp-c-bg-soft);
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 8px;
+  padding: 0;
+  overflow: hidden;
+  margin-bottom: 15px;
+}
+
+.config-content pre {
+  margin: 0;
+  padding: 20px;
+  overflow-x: auto;
+  background: transparent;
+}
+
+.config-content code {
+  font-family: var(--vp-font-family-mono);
+  font-size: 13px;
+  line-height: 1.6;
+  color: var(--vp-c-text-1);
+}
+
+.copy-btn {
+  background: var(--vp-c-bg-soft);
+  color: var(--vp-c-text-1);
+  border: 1px solid var(--vp-c-divider);
+  padding: 10px 20px;
+  border-radius: 4px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.copy-btn:hover {
+  background: var(--vp-c-bg-alt);
+  border-color: var(--vp-c-brand-1);
+}
+</style>
diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts
index 26ca40f3..0843dc24 100644
--- a/docs/.vitepress/theme/index.ts
+++ b/docs/.vitepress/theme/index.ts
@@ -5,6 +5,7 @@ import ExtendedLayout from './components/ExtendedLayout.vue'
 import ImageWrap from './components/ImageWrap.vue'
 import Contributors from './components/Contributors.vue'
 import FloatingVue from 'floating-vue'
+import WifiConfigGenerator from './components/WifiConfigGenerator.vue'
 
 import 'floating-vue/dist/style.css'
 import '@red-asuka/vitepress-plugin-tabs/dist/style.css'
@@ -21,5 +22,6 @@ export default {
     app.component('ImageWrap', ImageWrap)
     app.component('Contributors', Contributors)
     app.use(FloatingVue)
+    app.component('WifiConfigGenerator', WifiConfigGenerator)    
   }
 }
diff --git a/docs/user/HyperBian.md b/docs/user/HyperBian.md
index 53b4af7e..3d686f82 100644
--- a/docs/user/HyperBian.md
+++ b/docs/user/HyperBian.md
@@ -12,83 +12,126 @@ Is a ready to use image for your Raspberry Pi. Based on the original Raspberry P
 
 ## Installation
   1. Download the ready-made [HyperBian Image](https://github.com/Hyperion-Project/HyperBian/releases)
-  2. Install the [Raspberry Pi Imager](https://www.raspberrypi.com/documentation/computers/getting-started.html#raspberry-pi-imager) in support of burning the image to an SD card.
-  3. Start the Pi Imager
-  4. As operating system choose "Custom OS" and provide the downloaded HyperBian-XXXX package
-  5. Choose your target storage, i.e. your SD-Card
-  6. Click "Next" and select "No" for no extra customization
-  7. The HyperBian image should be written to the SD Card
-  8. Put the SD-Card into your Raspberry Pi and start up the system
-
-### WiFi, timezone & ssh access
-In case you want to use WiFi with your Raspberry Pi or update the timezone or other OS related configuration, you can use the Pi Imager OS customisation screen.
-At installation step 6., select "Edit Settings" and then e.g. provide the WiFi SSID, password and country.
-"Save" the settings and proceed with "Yes" to start the imaging process.
-
-::: tip Use HyperBian's default user (and password), if asked for
- - User: `hyperion`
- - Password: `ambientlight`
- 
-You can choose a different username, but then take care to update Hyperion's preconfigured service later.
-To update the service to the [current service user](/user/gettingstarted/Overview.html#change-the-service-user)
-:::
-
-The configuration will happening during the first boot.
-
-::: details Alternative way
-
-In case you are not using PI Imager or do not want providing the details via the Customisation screen,
-you can also setup addition details via file.
-
-Create a file named `custom.toml`.
-Customise the file with the setup you are looking for. Comment out element not to be changed.
-
-Store the file in the SD-Card boot portition.
-
-**Sample - custom.toml**
+  2. Download your preferred tool in support of burning the image to an SD card
+
+:::::: tabs :cache-lifetime="0" :options="{ useUrlFragment: false, disableScrollBehavior: true }"
+::::: tab name="Pi Imager"
+  3. Install the [Raspberry Pi Imager](https://www.raspberrypi.com/documentation/computers/getting-started.html#raspberry-pi-imager) 
+  4. Start the Pi Imager
+  5. Select your Raspberry Pi device + Click "Next" to continue
+  6. As operating system choose "Use Custom" at the bottom of the list
+  7. Select the downloaded HyperBian image file, click "Open" and "Next" to continue
+  8. Choose your storage device, i.e. your SD-Card and click "Next" to continue
+  9. Click "Write" to begin writing the image to the SD card
+  10. Wait until the image is written to the SD card
+
+:::::
+::::: tab name="Etcher"
+
+  3. Install [balenaEtcher](https://www.balena.io/etcher/)
+  4. Start Etcher.
+  5. Select "Flash from file" and choose the downloaded HyperBian image file.
+  6. Select "Target" and choose your SD card.
+  7. Click "Flash!" to begin writing the image.
+  8. Wait until the image is written to the SD card
+:::::
+
+::::: tab name="Windows"
+  On Windows, you can also use the `win32diskimager`.
+
+  3. Install and start [Win32 Disk Imager](https://sourceforge.net/projects/win32diskimager/).
+  4. Select the downloaded HyperBian image file.
+  5. Select your SD card device.
+  6. Click "Write" to burn the image to the SD card.
+:::::
+::::::
+
+When the SD-Card was prepared sucessfully, you can optionally prepare additional configuration files.
+> [!IMPORTANT]
+> Save the configuration file(s) in the boot partition of your SD-Card.
+The configuration will then happen during the first boot.
+
+:::::: details Prepare a WiFi Configuration
+
+This tool helps you generate a WiFi configuration file for your HyperBian installation.
+Simply enter your network details below and click "Generate Config" to create a customized configuration file.
+
+<WifiConfigGenerator />
+
+#### How to Use
+
+1. Enter your network details:
+   - **SSID**: Your WiFi network name
+   - **Password**: Your WiFi password
+   - **Country**: Your two-letter country code (e.g., DE, US, GB, FR)
+
+2. Click "Save WiFi Config" to save your customized `network-config` configuration file.
+
+3. The generated configuration file will be saved in your downloads folder
+
+4. Copy the `network-config` file into the boot partition of your HyperBian SD-Card.
+
+#### What is the network-config file?
+
+The `network-config` file is used by HyperBian during the first boot to configure your Raspberry Pi's WiFi connection. By placing this file in the boot partition before the first startup, your device will automatically connect to your WiFi network.
+
+:::: details Manual Configuration
+
+If you prefer to manually edit the configuration file, you can use the following template:
+
+```yaml
+####################################################################################
+## Configure your initial HyperBian Wifi connectivity to your needs below.
+## Uncomment and edit the relevant sections as needed.
+##
+## If you have additional needs refer to the cloud-init documentation 
+## and the netplan reference for full details:
+##
+## https://netplan.io/reference
+## https://cloudinit.readthedocs.io/en/latest/topics/network-config.html
+## https://cloudinit.readthedocs.io/en/latest/topics/network-config-format-v2.html
+####################################################################################
+
+network:
+  version: 2 
+  wifis:
+    wlan0:
+      dhcp4: true
+      optional: true
+      access-points:
+        "YOUR_SSID":
+          password: "YOUR_PASSWORD"
+      regulatory-domain: YOUR_COUNTRY_CODE
+```
 
-``` toml:no-line-numbers
-# Required:
-config_version = 1
+Replace `YOUR_SSID`, `YOUR_PASSWORD`, and `YOUR_COUNTRY_CODE` with your actual values.
+::::
 
-[system]
-hostname = "HyperBian"
+:::: tip
+For a list of country codes, refer to the [ISO 3166-1 alpha-2 standard](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2).
+::::
 
-[user]
-name = "hyperion"
-# The password can be encrypted or plain. To encrypt, we can use "openssl passwd -5 raspberry"
-password = "ambientlight"
-password_encrypted = false
+::::::
 
-[ssh]
-# ssh_import_id = "gh:user" # import public keys from github
-enabled = false
-password_authentication = true
-# We can also seed the ssh public keys configured for the default user:
-# authorized_keys = [ "ssh-rsa ... user@host", ... ]
+::: details Prepare a System configuration file
+:::
 
-[wlan]
-ssid = "myWifi"
-password = "myWifiPassword"
-password_encrypted = false
-hidden = false
-# The country is written to /etc/default/crda
-# Reference: https://wireless.wiki.kernel.org/en/developers/Regulatory
-country = "DE"
 
-[locale]
-keymap = "de"
-timezone = "Europe/Berlin"
-```
-:::
+-> Now, put the SD-Card into your Raspberry Pi and start up the system
 
+### Default Configuration
+... unless changed by custom configuration files
 
-#### Default SSH LOGIN
+::: tip HyperBian's default user and password
  - User: `hyperion`
  - Password: `ambientlight`
- 
+:::
+
 ::: tip
 HyperBian is shipped with an English keyboard configured. If you do not own an English keyboard some keys might be found at a different place.
-For the first time login, type as you would have an English keyboard; after logging in successfully you can update to your keyboard layout via `sudo raspi-config`.
+For the first time login, type as you would have an English keyboard.
 :::
 
+::: tip
+After logging in successfully you can update any configuration via `sudo raspi-config` too.
+:::

From 53e05c77954268e70b8e4862b6b1b1d47d796fcc Mon Sep 17 00:00:00 2001
From: Lord-Grey <lordgrey.emmel@gmail.com>
Date: Tue, 6 Jan 2026 12:33:57 +0100
Subject: [PATCH 2/4] Add system configuration tool

---
 .../components/SystemConfigGenerator.vue      | 326 +++++++++++++++++
 .../theme/components/WifiConfigGenerator.vue  |  42 +--
 docs/.vitepress/theme/data/countries.ts       | 251 +++++++++++++
 docs/.vitepress/theme/data/timezones.ts       | 342 ++++++++++++++++++
 docs/.vitepress/theme/index.ts                |   4 +-
 docs/user/HyperBian.md                        | 162 ++++++++-
 package.json                                  |   3 +-
 7 files changed, 1083 insertions(+), 47 deletions(-)
 create mode 100644 docs/.vitepress/theme/components/SystemConfigGenerator.vue
 create mode 100644 docs/.vitepress/theme/data/countries.ts
 create mode 100644 docs/.vitepress/theme/data/timezones.ts

diff --git a/docs/.vitepress/theme/components/SystemConfigGenerator.vue b/docs/.vitepress/theme/components/SystemConfigGenerator.vue
new file mode 100644
index 00000000..de0d61da
--- /dev/null
+++ b/docs/.vitepress/theme/components/SystemConfigGenerator.vue
@@ -0,0 +1,326 @@
+<template>
+  <div class="system-config-generator">
+    <h2>System Configuration Generator</h2>
+    <p>Generate a customized system configuration for your HyperBian system.</p>
+
+    <form @submit.prevent="generateConfig" class="config-form">
+      <div class="form-group">
+        <label for="username">Username:</label>
+        <input type="text" id="username" v-model="config.username" placeholder="e.g., hyperion">
+      </div>
+
+      <div class="form-group">
+        <label for="password">Password:</label>
+        <div class="password-wrapper">
+          <input 
+            :type="showPassword ? 'text' : 'password'" 
+            id="password" 
+            v-model="config.password" 
+            placeholder="Enter the user's password"
+          />
+          <span @click="togglePasswordVisibility" class="password-toggle-icon">
+            <svg v-if="showPassword" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>
+            <svg v-else xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>
+          </span>
+        </div>
+      </div>
+
+      <div class="form-group">
+        <label for="hostname">Hostname:</label>
+        <input type="text" id="hostname" v-model="config.hostname" placeholder="e.g., hyperbian">
+      </div>
+
+      <div class="form-group checkbox-group">
+        <input type="checkbox" id="use_timezone" v-model="useTimezone">
+        <label for="use_timezone">Set Timezone</label>
+        <div v-if="useTimezone" class="sub-form-group">
+          <select id="timezone" v-model="config.timezone">
+            <option v-for="tz in timezones" :key="tz" :value="tz">
+              {{ tz }}
+            </option>
+          </select>
+        </div>
+      </div>
+
+      <div class="form-group checkbox-group">
+        <input type="checkbox" id="use_locale" v-model="useLocale">
+        <label for="use_locale">Set Locale</label>
+        <div v-if="useLocale" class="sub-form-group">
+          <input type="text" id="locale" v-model="config.locale" placeholder="e.g., de_DE.UTF-8">
+        </div>
+      </div>
+
+      <div class="form-group checkbox-group">
+        <input type="checkbox" id="use_keyboard" v-model="useKeyboard">
+        <label for="use_keyboard">Set Keyboard Layout</label>
+        <div v-if="useKeyboard" class="sub-form-group">
+          <input type="text" id="keyboard_layout" v-model="config.keyboard_layout" placeholder="e.g., de">
+        </div>
+      </div>
+
+      <div class="form-group checkbox-group">
+        <input type="checkbox" id="enable_spi" v-model="config.enable_spi">
+        <label for="enable_spi">Enable SPI Interface</label>
+      </div>
+
+      <div class="form-group checkbox-group">
+        <input type="checkbox" id="enable_ssh" v-model="config.enable_ssh">
+        <label for="enable_ssh">Enable SSH Access</label>
+      </div>      
+
+      <div>
+      <button type="submit" class="generate-btn">Save Configuration</button>
+      </div>
+    </form>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive } from 'vue';
+import { sha512crypt } from 'sha512crypt-node';
+import { timezones } from '../data/timezones';
+
+const config = reactive({
+  username: 'hyperion',
+  password: 'ambientlight',
+  enable_ssh: false,
+  hostname: 'hyperbian',
+  timezone: 'Europe/Berlin',
+  locale: 'de_DE.UTF-8',
+  keyboard_layout: 'de',
+  enable_spi: true,
+});
+
+const useTimezone = ref(false);
+const useLocale = ref(false);
+const useKeyboard = ref(false);
+const showPassword = ref(true);
+
+const togglePasswordVisibility = () => {
+  showPassword.value = !showPassword.value;
+};
+
+const generateConfig = () => {
+  const escape = (str) => str.replaceAll('\\', '\\\\').replaceAll('"', String.raw`\"`);
+  const passwdPassword = sha512crypt(config.password, Math.random().toString(36).substring(2, 10));
+
+  let template = `## template: jinja
+#cloud-config
+
+# This is the user-data configuration file for cloud-init. By default this sets
+# up an initial user called "ubuntu" with password "ubuntu", which must be
+# changed at first login. However, many additional actions can be initiated on
+# first boot from this file. The cloud-init documentation has more details:
+#
+# https://cloudinit.readthedocs.io/
+#
+# Please note that the YAML format employed by this file is sensitive to
+# differences in whitespace; if you are editing this file in an editor (like
+# Notepad) which uses literal tabs, take care to only use spaces for
+# indentation. See the following link for more details:
+#
+# https://en.wikipedia.org/wiki/YAML
+#
+
+##################################################################
+## Configure your initial HyperBian system to your needs below ###
+## Uncomment and edit the relevant sections as needed.         ###
+##################################################################
+
+# 1. Define the Hyperion user name (optional)
+{% set HYPERION_USER = "${escape(config.username)}" %}
+
+# 2. Define, if ssh access should be enabled (optional)
+{% set ENABLE_SSH = ${config.enable_ssh} %}
+
+# 3. Set the system's hostname (optional)
+hostname: "${escape(config.hostname)}"
+`;
+
+  if (useTimezone.value) {
+    template += `
+# 4. Set the timezone for this instance (optional)
+# the value of 'timezone' must exist in /usr/share/zoneinfo
+timezone: "${escape(config.timezone)}"
+`;
+  } else {
+    template += `
+# 4. Set the timezone for this instance (optional)
+# the value of 'timezone' must exist in /usr/share/zoneinfo
+
+## Sample for Berlin timezone
+#timezone: Europe/Berlin
+`;
+  }
+
+  if (useLocale.value) {
+    template += `
+# 5. Set the locale to a given locale; default: en_GB.UTF-8 (optional)
+locale: "${escape(config.locale)}"
+`;
+  } else {
+    template += `
+# 5. Set the locale to a given locale; default: en_GB.UTF-8 (optional)
+
+## Sample for German locale
+#locale: de_DE.UTF-8
+`;
+  }
+
+  if (useKeyboard.value) {
+    template += `
+# 6. Set up the keyboard layout (optional)
+# See localectl(1), in particular the various list-x11-* sub-commands, 
+# to determine the available models, layouts, variants, and options
+keyboard:
+  layout: "${escape(config.keyboard_layout)}"
+`;
+  } else {
+    template += `
+# 6. Set up the keyboard layout (optional)
+# See localectl(1), in particular the various list-x11-* sub-commands, 
+# to determine the available models, layouts, variants, and options
+
+## Sample for German keyboard layout
+#keyboard:
+#  layout: de
+`;
+  }
+
+  template += `
+# 7. Enable the SPI interface (optional)
+rpi:
+  interfaces:
+    spi: ${config.enable_spi}
+
+###############################
+### DO NOT CHANGE THE BELOW ###
+###############################
+
+users:
+- name: {{ HYPERION_USER }}
+  gecos: Hyperion user
+  groups: users, dialout, sudo, video, audio, gpio, spi, i2c
+  sudo: ["ALL=(ALL) NOPASSWD:ALL"]
+  lock_passwd: false
+  passwd: ${passwdPassword}
+  shell: /bin/bash
+ 
+ssh_pwauth: {{ ENABLE_SSH }}
+
+runcmd:
+  - |
+    echo "Running setup for Hyperion user: {{ HYPERION_USER }}"
+    /usr/share/hyperion/scripts/updateHyperionUser.sh -u "{{ HYPERION_USER }}"
+    
+{% if ENABLE_SSH %}
+  - systemctl unmask ssh
+  - systemctl enable ssh
+  - systemctl start ssh
+{% else %}
+  - echo "SSH is disabled in config"
+{% endif %}
+`;
+  const blob = new Blob([template.trim()], { type: 'application/octet-stream' });
+  const link = document.createElement('a');
+  link.href = URL.createObjectURL(blob);
+  link.download = 'user-data';
+  link.click();
+  URL.revokeObjectURL(link.href);
+};
+</script>
+
+<style scoped>
+.system-config-generator {
+  max-width: 800px;
+  margin: 0;
+  padding: 0;
+}
+
+h2 {
+  margin-top: 0;
+  margin-bottom: 10px;
+}
+
+.config-form {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.form-group {
+  display: flex;
+  flex-direction: column;
+}
+
+.form-group label {
+  font-weight: 600;
+  margin-bottom: 0.5rem;
+  color: var(--vp-c-text-1);
+}
+
+.form-group input[type="text"],
+.form-group input[type="password"] {
+  padding: 0.75rem 1rem;
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 4px;
+  background-color: var(--vp-c-bg);
+  color: var(--vp-c-text-1);
+  transition: border-color 0.25s;
+  width: 100%;
+}
+
+.form-group input:focus {
+  outline: none;
+  border-color: var(--vp-c-brand-1);
+}
+
+.password-wrapper {
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+
+.password-wrapper input {
+  padding-right: 2.5rem;
+}
+
+.password-toggle-icon {
+  position: absolute;
+  right: 0.75rem;
+  cursor: pointer;
+  color: var(--vp-c-text-2);
+}
+
+.generate-btn {
+  background: var(--vp-c-brand-1);
+  color: white;
+  border: none;
+  padding: 12px 24px;
+  border-radius: 4px;
+  font-size: 16px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.generate-btn:hover {
+  background-color: var(--vp-c-brand-2);
+}
+
+.checkbox-group {
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.checkbox-group label {
+  margin-bottom: 0;
+  margin-left: 0.5rem;
+}
+
+.sub-form-group {
+  margin-top: 0.5rem;
+  width: 100%;
+}
+</style>
diff --git a/docs/.vitepress/theme/components/WifiConfigGenerator.vue b/docs/.vitepress/theme/components/WifiConfigGenerator.vue
index 9cbc5a02..d166a19b 100644
--- a/docs/.vitepress/theme/components/WifiConfigGenerator.vue
+++ b/docs/.vitepress/theme/components/WifiConfigGenerator.vue
@@ -34,19 +34,14 @@
       
       <div class="form-group">
         <label for="country">Country Code:</label>
-        <input 
-          type="text" 
-          id="country" 
-          v-model="country" 
-          placeholder="e.g., DE, US, GB"
-          pattern="[A-Z]{2}"
-          title="Two uppercase letters (e.g., DE, US, GB)"
-          maxlength="2"
-          required
-        />
+        <select id="country" v-model="country" required>
+          <option v-for="c in countries" :key="c.code" :value="c.code">
+            {{ c.name }} ({{ c.code }})
+          </option>
+        </select>
       </div>
       
-      <button type="submit" class="generate-btn">Save WiFi Config</button>
+      <button type="submit" class="generate-btn">Save Configuration</button>
     </form>
     
   </div>
@@ -54,6 +49,7 @@
 
 <script setup>
 import { ref } from 'vue'
+import { countries } from '../data/countries'
 
 const ssid = ref('')
 const password = ref('')
@@ -64,7 +60,11 @@ const togglePasswordVisibility = () => {
   showPassword.value = !showPassword.value;
 };
 
-const configTemplate = `####################################################################################
+const generateConfig = () => {
+  // Escape special characters for YAML
+  const escape = (str) => str.replaceAll('\\', '\\\\').replaceAll('"', String.raw`\"`);
+
+  const template = `####################################################################################
 ## Configure your initial HyperBian WiFi connectivity to your needs below.
 ## Uncomment and edit the relevant sections as needed.
 ##
@@ -83,21 +83,11 @@ network:
       dhcp4: true
       optional: true
       access-points:
-        "SSID":
-          password: "PASSWORD"
-      regulatory-domain: COUNTRY`
-
-const generateConfig = () => {
-  // Escape special characters for YAML
-  const escape = (str) => str.replace(/\\/g, '\\\\').replace(/"/g, '\\"');
-
-  // Replace placeholders with user input (escaped for YAML)  
-  const config = configTemplate
-    .replace('"SSID"', `"${escape(ssid.value)}"`)
-    .replace('"PASSWORD"', `"${escape(password.value)}"`)
-    .replace('COUNTRY', country.value.toUpperCase());
+        "${escape(ssid.value)}":
+          password: "${escape(password.value)}"
+      regulatory-domain: ${country.value.toUpperCase()}`;
 
-  const blob = new Blob([config], { type: 'application/octet-stream' });
+  const blob = new Blob([template], { type: 'application/octet-stream' });
   const link = document.createElement('a');
   link.href = URL.createObjectURL(blob);
   link.download = 'network-config';
diff --git a/docs/.vitepress/theme/data/countries.ts b/docs/.vitepress/theme/data/countries.ts
new file mode 100644
index 00000000..a255333f
--- /dev/null
+++ b/docs/.vitepress/theme/data/countries.ts
@@ -0,0 +1,251 @@
+export const countries = [
+  { code: 'AD', name: 'Andorra' },
+  { code: 'AE', name: 'United Arab Emirates' },
+  { code: 'AF', name: 'Afghanistan' },
+  { code: 'AG', name: 'Antigua and Barbuda' },
+  { code: 'AI', name: 'Anguilla' },
+  { code: 'AL', name: 'Albania' },
+  { code: 'AM', name: 'Armenia' },
+  { code: 'AO', name: 'Angola' },
+  { code: 'AQ', name: 'Antarctica' },
+  { code: 'AR', name: 'Argentina' },
+  { code: 'AS', name: 'American Samoa' },
+  { code: 'AT', name: 'Austria' },
+  { code: 'AU', name: 'Australia' },
+  { code: 'AW', name: 'Aruba' },
+  { code: 'AX', name: 'Åland Islands' },
+  { code: 'AZ', name: 'Azerbaijan' },
+  { code: 'BA', name: 'Bosnia and Herzegovina' },
+  { code: 'BB', name: 'Barbados' },
+  { code: 'BD', name: 'Bangladesh' },
+  { code: 'BE', name: 'Belgium' },
+  { code: 'BF', name: 'Burkina Faso' },
+  { code: 'BG', name: 'Bulgaria' },
+  { code: 'BH', name: 'Bahrain' },
+  { code: 'BI', name: 'Burundi' },
+  { code: 'BJ', name: 'Benin' },
+  { code: 'BL', name: 'Saint Barthélemy' },
+  { code: 'BM', name: 'Bermuda' },
+  { code: 'BN', name: 'Brunei Darussalam' },
+  { code: 'BO', name: 'Bolivia, Plurinational State of' },
+  { code: 'BQ', name: 'Bonaire, Sint Eustatius and Saba' },
+  { code: 'BR', name: 'Brazil' },
+  { code: 'BS', name: 'Bahamas' },
+  { code: 'BT', name: 'Bhutan' },
+  { code: 'BV', name: 'Bouvet Island' },
+  { code: 'BW', name: 'Botswana' },
+  { code: 'BY', name: 'Belarus' },
+  { code: 'BZ', name: 'Belize' },
+  { code: 'CA', name: 'Canada' },
+  { code: 'CC', name: 'Cocos (Keeling) Islands' },
+  { code: 'CD', name: 'Congo, Democratic Republic of the' },
+  { code: 'CF', name: 'Central African Republic' },
+  { code: 'CG', name: 'Congo' },
+  { code: 'CH', name: 'Switzerland' },
+  { code: 'CI', name: 'Côte d\'Ivoire' },
+  { code: 'CK', name: 'Cook Islands' },
+  { code: 'CL', name: 'Chile' },
+  { code: 'CM', name: 'Cameroon' },
+  { code: 'CN', name: 'China' },
+  { code: 'CO', name: 'Colombia' },
+  { code: 'CR', name: 'Costa Rica' },
+  { code: 'CU', name: 'Cuba' },
+  { code: 'CV', name: 'Cabo Verde' },
+  { code: 'CW', name: 'Curaçao' },
+  { code: 'CX', name: 'Christmas Island' },
+  { code: 'CY', name: 'Cyprus' },
+  { code: 'CZ', name: 'Czechia' },
+  { code: 'DE', name: 'Germany' },
+  { code: 'DJ', name: 'Djibouti' },
+  { code: 'DK', name: 'Denmark' },
+  { code: 'DM', name: 'Dominica' },
+  { code: 'DO', name: 'Dominican Republic' },
+  { code: 'DZ', name: 'Algeria' },
+  { code: 'EC', name: 'Ecuador' },
+  { code: 'EE', name: 'Estonia' },
+  { code: 'EG', name: 'Egypt' },
+  { code: 'EH', name: 'Western Sahara' },
+  { code: 'ER', name: 'Eritrea' },
+  { code: 'ES', name: 'Spain' },
+  { code: 'ET', name: 'Ethiopia' },
+  { code: 'FI', name: 'Finland' },
+  { code: 'FJ', name: 'Fiji' },
+  { code: 'FK', name: 'Falkland Islands (Malvinas)' },
+  { code: 'FM', name: 'Micronesia, Federated States of' },
+  { code: 'FO', name: 'Faroe Islands' },
+  { code: 'FR', name: 'France' },
+  { code: 'GA', name: 'Gabon' },
+  { code: 'GB', name: 'United Kingdom of Great Britain and Northern Ireland' },
+  { code: 'GD', name: 'Grenada' },
+  { code: 'GE', name: 'Georgia' },
+  { code: 'GF', name: 'French Guiana' },
+  { code: 'GG', name: 'Guernsey' },
+  { code: 'GH', name: 'Ghana' },
+  { code: 'GI', name: 'Gibraltar' },
+  { code: 'GL', name: 'Greenland' },
+  { code: 'GM', name: 'Gambia' },
+  { code: 'GN', name: 'Guinea' },
+  { code: 'GP', name: 'Guadeloupe' },
+  { code: 'GQ', name: 'Equatorial Guinea' },
+  { code: 'GR', name: 'Greece' },
+  { code: 'GS', name: 'South Georgia and the South Sandwich Islands' },
+  { code: 'GT', name: 'Guatemala' },
+  { code: 'GU', name: 'Guam' },
+  { code: 'GW', name: 'Guinea-Bissau' },
+  { code: 'GY', name: 'Guyana' },
+  { code: 'HK', name: 'Hong Kong' },
+  { code: 'HM', name: 'Heard Island and McDonald Islands' },
+  { code: 'HN', name: 'Honduras' },
+  { code: 'HR', name: 'Croatia' },
+  { code: 'HT', name: 'Haiti' },
+  { code: 'HU', name: 'Hungary' },
+  { code: 'ID', name: 'Indonesia' },
+  { code: 'IE', name: 'Ireland' },
+  { code: 'IL', name: 'Israel' },
+  { code: 'IM', name: 'Isle of Man' },
+  { code: 'IN', name: 'India' },
+  { code: 'IO', name: 'British Indian Ocean Territory' },
+  { code: 'IQ', name: 'Iraq' },
+  { code: 'IR', name: 'Iran, Islamic Republic of' },
+  { code: 'IS', name: 'Iceland' },
+  { code: 'IT', name: 'Italy' },
+  { code: 'JE', name: 'Jersey' },
+  { code: 'JM', name: 'Jamaica' },
+  { code: 'JO', name: 'Jordan' },
+  { code: 'JP', name: 'Japan' },
+  { code: 'KE', name: 'Kenya' },
+  { code: 'KG', name: 'Kyrgyzstan' },
+  { code: 'KH', name: 'Cambodia' },
+  { code: 'KI', name: 'Kiribati' },
+  { code: 'KM', name: 'Comoros' },
+  { code: 'KN', name: 'Saint Kitts and Nevis' },
+  { code: 'KP', name: 'Korea, Democratic People\'s Republic of' },
+  { code: 'KR', name: 'Korea, Republic of' },
+  { code: 'KW', name: 'Kuwait' },
+  { code: 'KY', name: 'Cayman Islands' },
+  { code: 'KZ', name: 'Kazakhstan' },
+  { code: 'LA', name: 'Lao People\'s Democratic Republic' },
+  { code: 'LB', name: 'Lebanon' },
+  { code: 'LC', name: 'Saint Lucia' },
+  { code: 'LI', name: 'Liechtenstein' },
+  { code: 'LK', name: 'Sri Lanka' },
+  { code: 'LR', name: 'Liberia' },
+  { code: 'LS', name: 'Lesotho' },
+  { code: 'LT', name: 'Lithuania' },
+  { code: 'LU', name: 'Luxembourg' },
+  { code: 'LV', name: 'Latvia' },
+  { code: 'LY', name: 'Libya' },
+  { code: 'MA', name: 'Morocco' },
+  { code: 'MC', name: 'Monaco' },
+  { code: 'MD', name: 'Moldova, Republic of' },
+  { code: 'ME', name: 'Montenegro' },
+  { code: 'MF', name: 'Saint Martin (French part)' },
+  { code: 'MG', name: 'Madagascar' },
+  { code: 'MH', name: 'Marshall Islands' },
+  { code: 'MK', name: 'North Macedonia' },
+  { code: 'ML', name: 'Mali' },
+  { code: 'MM', name: 'Myanmar' },
+  { code: 'MN', name: 'Mongolia' },
+  { code: 'MO', name: 'Macao' },
+  { code: 'MP', name: 'Northern Mariana Islands' },
+  { code: 'MQ', name: 'Martinique' },
+  { code: 'MR', name: 'Mauritania' },
+  { code: 'MS', name: 'Montserrat' },
+  { code: 'MT', name: 'Malta' },
+  { code: 'MU', name: 'Mauritius' },
+  { code: 'MV', name: 'Maldives' },
+  { code: 'MW', name: 'Malawi' },
+  { code: 'MX', name: 'Mexico' },
+  { code: 'MY', name: 'Malaysia' },
+  { code: 'MZ', name: 'Mozambique' },
+  { code: 'NA', name: 'Namibia' },
+  { code: 'NC', name: 'New Caledonia' },
+  { code: 'NE', name: 'Niger' },
+  { code: 'NF', name: 'Norfolk Island' },
+  { code: 'NG', name: 'Nigeria' },
+  { code: 'NI', name: 'Nicaragua' },
+  { code: 'NL', name: 'Netherlands, Kingdom of the' },
+  { code: 'NO', name: 'Norway' },
+  { code: 'NP', name: 'Nepal' },
+  { code: 'NR', name: 'Nauru' },
+  { code: 'NU', name: 'Niue' },
+  { code: 'NZ', name: 'New Zealand' },
+  { code: 'OM', name: 'Oman' },
+  { code: 'PA', name: 'Panama' },
+  { code: 'PE', name: 'Peru' },
+  { code: 'PF', name: 'French Polynesia' },
+  { code: 'PG', name: 'Papua New Guinea' },
+  { code: 'PH', name: 'Philippines' },
+  { code: 'PK', name: 'Pakistan' },
+  { code: 'PL', name: 'Poland' },
+  { code: 'PM', name: 'Saint Pierre and Miquelon' },
+  { code: 'PN', name: 'Pitcairn' },
+  { code: 'PR', name: 'Puerto Rico' },
+  { code: 'PS', name: 'Palestine, State of' },
+  { code: 'PT', name: 'Portugal' },
+  { code: 'PW', name: 'Palau' },
+  { code: 'PY', name: 'Paraguay' },
+  { code: 'QA', name: 'Qatar' },
+  { code: 'RE', name: 'Réunion' },
+  { code: 'RO', name: 'Romania' },
+  { code: 'RS', name: 'Serbia' },
+  { code: 'RU', name: 'Russian Federation' },
+  { code: 'RW', name: 'Rwanda' },
+  { code: 'SA', name: 'Saudi Arabia' },
+  { code: 'SB', name: 'Solomon Islands' },
+  { code: 'SC', name: 'Seychelles' },
+  { code: 'SD', name: 'Sudan' },
+  { code: 'SE', name: 'Sweden' },
+  { code: 'SG', name: 'Singapore' },
+  { code: 'SH', name: 'Saint Helena, Ascension and Tristan da Cunha' },
+  { code: 'SI', name: 'Slovenia' },
+  { code: 'SJ', name: 'Svalbard and Jan Mayen' },
+  { code: 'SK', name: 'Slovakia' },
+  { code: 'SL', name: 'Sierra Leone' },
+  { code: 'SM', name: 'San Marino' },
+  { code: 'SN', name: 'Senegal' },
+  { code: 'SO', name: 'Somalia' },
+  { code: 'SR', name: 'Suriname' },
+  { code: 'SS', name: 'South Sudan' },
+  { code: 'ST', name: 'Sao Tome and Principe' },
+  { code: 'SV', name: 'El Salvador' },
+  { code: 'SX', name: 'Sint Maarten (Dutch part)' },
+  { code: 'SY', name: 'Syrian Arab Republic' },
+  { code: 'SZ', name: 'Eswatini' },
+  { code: 'TC', name: 'Turks and Caicos Islands' },
+  { code: 'TD', name: 'Chad' },
+  { code: 'TF', name: 'French Southern Territories' },
+  { code: 'TG', name: 'Togo' },
+  { code: 'TH', name: 'Thailand' },
+  { code: 'TJ', name: 'Tajikistan' },
+  { code: 'TK', name: 'Tokelau' },
+  { code: 'TL', name: 'Timor-Leste' },
+  { code: 'TM', name: 'Turkmenistan' },
+  { code: 'TN', name: 'Tunisia' },
+  { code: 'TO', name: 'Tonga' },
+  { code: 'TR', name: 'Türkiye' },
+  { code: 'TT', name: 'Trinidad and Tobago' },
+  { code: 'TV', name: 'Tuvalu' },
+  { code: 'TW', name: 'Taiwan, Province of China' },
+  { code: 'TZ', name: 'Tanzania, United Republic of' },
+  { code: 'UA', name: 'Ukraine' },
+  { code: 'UG', name: 'Uganda' },
+  { code: 'UM', name: 'United States Minor Outlying Islands' },
+  { code: 'US', name: 'United States of America' },
+  { code: 'UY', name: 'Uruguay' },
+  { code: 'UZ', name: 'Uzbekistan' },
+  { code: 'VA', name: 'Holy See' },
+  { code: 'VC', name: 'Saint Vincent and the Grenadines' },
+  { code: 'VE', name: 'Venezuela, Bolivarian Republic of' },
+  { code: 'VG', name: 'Virgin Islands (British)' },
+  { code: 'VI', name: 'Virgin Islands (U.S.)' },
+  { code: 'VN', name: 'Viet Nam' },
+  { code: 'VU', name: 'Vanuatu' },
+  { code: 'WF', name: 'Wallis and Futuna' },
+  { code: 'WS', name: 'Samoa' },
+  { code: 'YE', name: 'Yemen' },
+  { code: 'YT', name: 'Mayotte' },
+  { code: 'ZA', name: 'South Africa' },
+  { code: 'ZM', name: 'Zambia' },
+  { code: 'ZW', name: 'Zimbabwe' },
+];
diff --git a/docs/.vitepress/theme/data/timezones.ts b/docs/.vitepress/theme/data/timezones.ts
new file mode 100644
index 00000000..0ff725b6
--- /dev/null
+++ b/docs/.vitepress/theme/data/timezones.ts
@@ -0,0 +1,342 @@
+export const timezones = [
+  'Africa/Abidjan',
+  'Africa/Algiers',
+  'Africa/Bissau',
+  'Africa/Cairo',
+  'Africa/Casablanca',
+  'Africa/Ceuta',
+  'Africa/El_Aaiun',
+  'Africa/Johannesburg',
+  'Africa/Juba',
+  'Africa/Khartoum',
+  'Africa/Lagos',
+  'Africa/Maputo',
+  'Africa/Monrovia',
+  'Africa/Nairobi',
+  'Africa/Ndjamena',
+  'Africa/Sao_Tome',
+  'Africa/Tripoli',
+  'Africa/Tunis',
+  'Africa/Windhoek',
+  'America/Adak',
+  'America/Anchorage',
+  'America/Araguaina',
+  'America/Argentina/Buenos_Aires',
+  'America/Argentina/Catamarca',
+  'America/Argentina/Cordoba',
+  'America/Argentina/Jujuy',
+  'America/Argentina/La_Rioja',
+  'America/Argentina/Mendoza',
+  'America/Argentina/Rio_Gallegos',
+  'America/Argentina/Salta',
+  'America/Argentina/San_Juan',
+  'America/Argentina/San_Luis',
+  'America/Argentina/Tucuman',
+  'America/Argentina/Ushuaia',
+  'America/Asuncion',
+  'America/Bahia',
+  'America/Bahia_Banderas',
+  'America/Barbados',
+  'America/Belem',
+  'America/Belize',
+  'America/Boa_Vista',
+  'America/Bogota',
+  'America/Boise',
+  'America/Cambridge_Bay',
+  'America/Campo_Grande',
+  'America/Cancun',
+  'America/Caracas',
+  'America/Cayenne',
+  'America/Chicago',
+  'America/Chihuahua',
+  'America/Ciudad_Juarez',
+  'America/Costa_Rica',
+  'America/Cuiaba',
+  'America/Danmarkshavn',
+  'America/Dawson',
+  'America/Dawson_Creek',
+  'America/Denver',
+  'America/Detroit',
+  'America/Edmonton',
+  'America/Eirunepe',
+  'America/El_Salvador',
+  'America/Fort_Nelson',
+  'America/Fortaleza',
+  'America/Glace_Bay',
+  'America/Goose_Bay',
+  'America/Grand_Turk',
+  'America/Guatemala',
+  'America/Guayaquil',
+  'America/Guyana',
+  'America/Halifax',
+  'America/Havana',
+  'America/Hermosillo',
+  'America/Indiana/Indianapolis',
+  'America/Indiana/Knox',
+  'America/Indiana/Marengo',
+  'America/Indiana/Petersburg',
+  'America/Indiana/Tell_City',
+  'America/Indiana/Vevay',
+  'America/Indiana/Vincennes',
+  'America/Indiana/Winamac',
+  'America/Inuvik',
+  'America/Iqaluit',
+  'America/Jamaica',
+  'America/Juneau',
+  'America/Kentucky/Louisville',
+  'America/Kentucky/Monticello',
+  'America/La_Paz',
+  'America/Lima',
+  'America/Los_Angeles',
+  'America/Maceio',
+  'America/Managua',
+  'America/Manaus',
+  'America/Martinique',
+  'America/Matamoros',
+  'America/Mazatlan',
+  'America/Menominee',
+  'America/Merida',
+  'America/Metlakatla',
+  'America/Mexico_City',
+  'America/Miquelon',
+  'America/Moncton',
+  'America/Monterrey',
+  'America/Montevideo',
+  'America/New_York',
+  'America/Nome',
+  'America/Noronha',
+  'America/North_Dakota/Beulah',
+  'America/North_Dakota/Center',
+  'America/North_Dakota/New_Salem',
+  'America/Nuuk',
+  'America/Ojinaga',
+  'America/Panama',
+  'America/Paramaribo',
+  'America/Phoenix',
+  'America/Port-au-Prince',
+  'America/Porto_Velho',
+  'America/Puerto_Rico',
+  'America/Punta_Arenas',
+  'America/Rankin_Inlet',
+  'America/Recife',
+  'America/Regina',
+  'America/Resolute',
+  'America/Rio_Branco',
+  'America/Santarem',
+  'America/Santiago',
+  'America/Santo_Domingo',
+  'America/Sao_Paulo',
+  'America/Scoresbysund',
+  'America/Sitka',
+  'America/St_Johns',
+  'America/Swift_Current',
+  'America/Tegucigalpa',
+  'America/Thule',
+  'America/Tijuana',
+  'America/Toronto',
+  'America/Vancouver',
+  'America/Whitehorse',
+  'America/Winnipeg',
+  'America/Yakutat',
+  'Antarctica/Casey',
+  'Antarctica/Davis',
+  'Antarctica/Macquarie',
+  'Antarctica/Mawson',
+  'Antarctica/Palmer',
+  'Antarctica/Rothera',
+  'Antarctica/Troll',
+  'Antarctica/Vostok',
+  'Asia/Almaty',
+  'Asia/Amman',
+  'Asia/Anadyr',
+  'Asia/Aqtau',
+  'Asia/Aqtobe',
+  'Asia/Ashgabat',
+  'Asia/Atyrau',
+  'Asia/Baghdad',
+  'Asia/Baku',
+  'Asia/Bangkok',
+  'Asia/Barnaul',
+  'Asia/Beirut',
+  'Asia/Bishkek',
+  'Asia/Chita',
+  'Asia/Colombo',
+  'Asia/Damascus',
+  'Asia/Dhaka',
+  'Asia/Dili',
+  'Asia/Dubai',
+  'Asia/Dushanbe',
+  'Asia/Famagusta',
+  'Asia/Gaza',
+  'Asia/Hebron',
+  'Asia/Ho_Chi_Minh',
+  'Asia/Hong_Kong',
+  'Asia/Hovd',
+  'Asia/Irkutsk',
+  'Asia/Jakarta',
+  'Asia/Jayapura',
+  'Asia/Jerusalem',
+  'Asia/Kabul',
+  'Asia/Kamchatka',
+  'Asia/Karachi',
+  'Asia/Kathmandu',
+  'Asia/Khandyga',
+  'Asia/Kolkata',
+  'Asia/Krasnoyarsk',
+  'Asia/Kuching',
+  'Asia/Macau',
+  'Asia/Magadan',
+  'Asia/Makassar',
+  'Asia/Manila',
+  'Asia/Nicosia',
+  'Asia/Novokuznetsk',
+  'Asia/Novosibirsk',
+  'Asia/Omsk',
+  'Asia/Oral',
+  'Asia/Pontianak',
+  'Asia/Pyongyang',
+  'Asia/Qatar',
+  'Asia/Qostanay',
+  'Asia/Qyzylorda',
+  'Asia/Riyadh',
+  'Asia/Sakhalin',
+  'Asia/Samarkand',
+  'Asia/Seoul',
+  'Asia/Shanghai',
+  'Asia/Singapore',
+  'Asia/Srednekolymsk',
+  'Asia/Taipei',
+  'Asia/Tashkent',
+  'Asia/Tbilisi',
+  'Asia/Tehran',
+  'Asia/Thimphu',
+  'Asia/Tokyo',
+  'Asia/Tomsk',
+  'Asia/Ulaanbaatar',
+  'Asia/Urumqi',
+  'Asia/Ust-Nera',
+  'Asia/Vladivostok',
+  'Asia/Yakutsk',
+  'Asia/Yangon',
+  'Asia/Yekaterinburg',
+  'Asia/Yerevan',
+  'Atlantic/Azores',
+  'Atlantic/Bermuda',
+  'Atlantic/Canary',
+  'Atlantic/Cape_Verde',
+  'Atlantic/Faroe',
+  'Atlantic/Madeira',
+  'Atlantic/South_Georgia',
+  'Atlantic/Stanley',
+  'Australia/Adelaide',
+  'Australia/Brisbane',
+  'Australia/Broken_Hill',
+  'Australia/Darwin',
+  'Australia/Eucla',
+  'Australia/Hobart',
+  'Australia/Lindeman',
+  'Australia/Lord_Howe',
+  'Australia/Melbourne',
+  'Australia/Perth',
+  'Australia/Sydney',
+  'Etc/GMT',
+  'Etc/GMT+1',
+  'Etc/GMT+10',
+  'Etc/GMT+11',
+  'Etc/GMT+12',
+  'Etc/GMT+2',
+  'Etc/GMT+3',
+  'Etc/GMT+4',
+  'Etc/GMT+5',
+  'Etc/GMT+6',
+  'Etc/GMT+7',
+  'Etc/GMT+8',
+  'Etc/GMT+9',
+  'Etc/GMT-1',
+  'Etc/GMT-10',
+  'Etc/GMT-11',
+  'Etc/GMT-12',
+  'Etc/GMT-13',
+  'Etc/GMT-14',
+  'Etc/GMT-2',
+  'Etc/GMT-3',
+  'Etc/GMT-4',
+  'Etc/GMT-5',
+  'Etc/GMT-6',
+  'Etc/GMT-7',
+  'Etc/GMT-8',
+  'Etc/GMT-9',
+  'Etc/UTC',
+  'Europe/Andorra',
+  'Europe/Astrakhan',
+  'Europe/Athens',
+  'Europe/Belgrade',
+  'Europe/Berlin',
+  'Europe/Brussels',
+  'Europe/Bucharest',
+  'Europe/Budapest',
+  'Europe/Chisinau',
+  'Europe/Dublin',
+  'Europe/Gibraltar',
+  'Europe/Helsinki',
+  'Europe/Istanbul',
+  'Europe/Kaliningrad',
+  'Europe/Kirov',
+  'Europe/Kyiv',
+  'Europe/Lisbon',
+  'Europe/London',
+  'Europe/Madrid',
+  'Europe/Malta',
+  'Europe/Minsk',
+  'Europe/Moscow',
+  'Europe/Paris',
+  'Europe/Prague',
+  'Europe/Riga',
+  'Europe/Rome',
+  'Europe/Samara',
+  'Europe/Saratov',
+  'Europe/Simferopol',
+  'Europe/Sofia',
+  'Europe/Tallinn',
+  'Europe/Tirane',
+  'Europe/Ulyanovsk',
+  'Europe/Vienna',
+  'Europe/Vilnius',
+  'Europe/Volgograd',
+  'Europe/Warsaw',
+  'Europe/Zurich',
+  'Factory',
+  'Indian/Chagos',
+  'Indian/Maldives',
+  'Indian/Mauritius',
+  'Pacific/Apia',
+  'Pacific/Auckland',
+  'Pacific/Bougainville',
+  'Pacific/Chatham',
+  'Pacific/Easter',
+  'Pacific/Efate',
+  'Pacific/Fakaofo',
+  'Pacific/Fiji',
+  'Pacific/Galapagos',
+  'Pacific/Gambier',
+  'Pacific/Guadalcanal',
+  'Pacific/Guam',
+  'Pacific/Honolulu',
+  'Pacific/Kanton',
+  'Pacific/Kiritimati',
+  'Pacific/Kosrae',
+  'Pacific/Kwajalein',
+  'Pacific/Marquesas',
+  'Pacific/Nauru',
+  'Pacific/Niue',
+  'Pacific/Norfolk',
+  'Pacific/Noumea',
+  'Pacific/Pago_Pago',
+  'Pacific/Palau',
+  'Pacific/Pitcairn',
+  'Pacific/Port_Moresby',
+  'Pacific/Rarotonga',
+  'Pacific/Tahiti',
+  'Pacific/Tarawa',
+  'Pacific/Tongatapu',
+];
diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts
index 0843dc24..54e14519 100644
--- a/docs/.vitepress/theme/index.ts
+++ b/docs/.vitepress/theme/index.ts
@@ -6,6 +6,7 @@ import ImageWrap from './components/ImageWrap.vue'
 import Contributors from './components/Contributors.vue'
 import FloatingVue from 'floating-vue'
 import WifiConfigGenerator from './components/WifiConfigGenerator.vue'
+import SystemConfigGenerator from './components/SystemConfigGenerator.vue'
 
 import 'floating-vue/dist/style.css'
 import '@red-asuka/vitepress-plugin-tabs/dist/style.css'
@@ -22,6 +23,7 @@ export default {
     app.component('ImageWrap', ImageWrap)
     app.component('Contributors', Contributors)
     app.use(FloatingVue)
-    app.component('WifiConfigGenerator', WifiConfigGenerator)    
+    app.component('WifiConfigGenerator', WifiConfigGenerator)
+    app.component('SystemConfigGenerator', SystemConfigGenerator)    
   }
 }
diff --git a/docs/user/HyperBian.md b/docs/user/HyperBian.md
index 3d686f82..795e048a 100644
--- a/docs/user/HyperBian.md
+++ b/docs/user/HyperBian.md
@@ -16,19 +16,19 @@ Is a ready to use image for your Raspberry Pi. Based on the original Raspberry P
 
 :::::: tabs :cache-lifetime="0" :options="{ useUrlFragment: false, disableScrollBehavior: true }"
 ::::: tab name="Pi Imager"
-  3. Install the [Raspberry Pi Imager](https://www.raspberrypi.com/documentation/computers/getting-started.html#raspberry-pi-imager) 
-  4. Start the Pi Imager
-  5. Select your Raspberry Pi device + Click "Next" to continue
-  6. As operating system choose "Use Custom" at the bottom of the list
-  7. Select the downloaded HyperBian image file, click "Open" and "Next" to continue
-  8. Choose your storage device, i.e. your SD-Card and click "Next" to continue
-  9. Click "Write" to begin writing the image to the SD card
-  10. Wait until the image is written to the SD card
+  3. Install the [Raspberry Pi Imager](https://www.raspberrypi.com/documentation/computers/getting-started.html#raspberry-pi-imager).
+  4. Start the Pi Imager.
+  5. Select your Raspberry Pi device + Click "Next" to continue.
+  6. As operating system choose "Use Custom" at the bottom of the list.
+  7. Select the downloaded HyperBian image file, click "Open" and "Next" to continue.
+  8. Choose your storage device, i.e. your SD-Card and click "Next" to continue.
+  9. Click "Write" to begin writing the image to the SD card.
+  10. Wait until the image is written to the SD card.
 
 :::::
 ::::: tab name="Etcher"
 
-  3. Install [balenaEtcher](https://www.balena.io/etcher/)
+  3. Install [balenaEtcher](https://www.balena.io/etcher/).
   4. Start Etcher.
   5. Select "Flash from file" and choose the downloaded HyperBian image file.
   6. Select "Target" and choose your SD card.
@@ -37,12 +37,11 @@ Is a ready to use image for your Raspberry Pi. Based on the original Raspberry P
 :::::
 
 ::::: tab name="Windows"
-  On Windows, you can also use the `win32diskimager`.
-
-  3. Install and start [Win32 Disk Imager](https://sourceforge.net/projects/win32diskimager/).
-  4. Select the downloaded HyperBian image file.
-  5. Select your SD card device.
-  6. Click "Write" to burn the image to the SD card.
+  3. Install [Win32 Disk Imager](https://sourceforge.net/projects/win32diskimager/).
+  4. Start Win32 Disk Imager.
+  5. Select the downloaded HyperBian image file.
+  6. Select your SD card device.
+  7. Click "Write" to burn the image to the SD card.
 :::::
 ::::::
 
@@ -65,7 +64,7 @@ Simply enter your network details below and click "Generate Config" to create a
    - **Password**: Your WiFi password
    - **Country**: Your two-letter country code (e.g., DE, US, GB, FR)
 
-2. Click "Save WiFi Config" to save your customized `network-config` configuration file.
+2. Click "Save Configuration" to save your customized `network-config` file.
 
 3. The generated configuration file will be saved in your downloads folder
 
@@ -113,11 +112,136 @@ For a list of country codes, refer to the [ISO 3166-1 alpha-2 standard](https://
 
 ::::::
 
-::: details Prepare a System configuration file
-:::
+:::::: details Prepare a System configuration
+
+This tool helps you generate a system configuration file for your HyperBian installation.
+Simply enter your system details below and click "Generate Config" to create a customized configuration file.
 
+<SystemConfigGenerator />
 
--> Now, put the SD-Card into your Raspberry Pi and start up the system
+#### How to Use
+
+1. Fill out the form with your desired system settings:
+ - **Username / Password**
+ - **Hostname**
+ - **Timezone**: - Timezones must be valid IANA time zone identifiers
+ - **Locale**: must follow glibc locale naming and be supported by the system
+ - **Keyboard layout**: Layouts must be valid XKB layout names 
+ - **SPI**: Enable/Disable the SPI interface
+ - **SSH**: Enable/Disable SSH access
+2. Click "Save Configuration" to save your customized `user-data` file.
+3. The generated configuration file will be saved in your downloads folder
+4. Copy the `user-data` file into the boot partition of your HyperBian SD-Card.
+
+
+#### What is the user-data file?
+
+The `user_data` file is used by HyperBian during the first boot to configure your Raspberry Pi's setup. By placing this file in the boot partition, you can pre-configure settings like username, password, hostname, and more.
+
+:::: details Manual Configuration
+
+If you prefer to manually edit the configuration file, you can use the following template. Replace the placeholder or sample values with your desired configuration. You might need to uncomment selections to get them to work.
+Note: You must generate an encryted password, e.g. via `openssl passwd -6 "YOUR_PASSWORD"` and replace YOUR_HYPERION_USERNAME_PASSWORD_ENCRYPTED by output.
+
+```yaml
+## template: jinja
+#cloud-config
+
+# This is the user-data configuration file for cloud-init. By default this sets
+# up an initial user called "ubuntu" with password "ubuntu", which must be
+# changed at first login. However, many additional actions can be initiated on
+# first boot from this file. The cloud-init documentation has more details:
+#
+# https://cloudinit.readthedocs.io/
+#
+# Please note that the YAML format employed by this file is sensitive to
+# differences in whitespace; if you are editing this file in an editor (like
+# Notepad) which uses literal tabs, take care to only use spaces for
+# indentation. See the following link for more details:
+#
+# https://en.wikipedia.org/wiki/YAML
+#
+
+##################################################################
+## Configure your initial HyperBian system to your needs below ###
+## Uncomment and edit the relevant sections as needed.         ###
+##################################################################
+
+# 1. Define the Hyperion user name (optional)
+{% set HYPERION_USER = "YOUR_HYPERION_USERNAME" %}
+
+# 2. Define, if ssh access should be enabled (optional)
+{% set ENABLE_SSH = false %}
+
+# 3. Set the system's hostname (optional)
+hostname: YOUR_HYPERBIAN_HOSTNAME
+
+# 4. Set the timezone for this instance (optional)
+# the value of 'timezone' must exist in /usr/share/zoneinfo
+# Run: timedatectl list-timezones
+
+## Sample for Berlin timezone
+#timezone: Europe/Berlin
+
+# 5. Set the locale to a given locale; default: en_GB.UTF-8 (optional)
+# Run: locale -a
+
+## Sample for German locale
+#locale: de_DE.UTF-8
+
+# 6. Set up the keyboard layout (optional)
+# See localectl(1), in particular the various list-x11-* sub-commands, 
+# to determine the available models, layouts, variants, and options
+# Run: localectl list-x11-keymap-layouts
+
+## Sample for German keyboard layout
+#keyboard:
+#  layout: de
+
+# 7. Enable the SPI interface (optional)
+rpi:
+  interfaces:
+    spi: true
+
+###############################
+### DO NOT CHANGE THE BELOW ###
+###############################
+
+users:
+- name: {{ HYPERION_USER }}
+  gecos: Hyperion user
+  groups: users, dialout, sudo, video, audio, gpio, spi, i2c
+  sudo: ["ALL=(ALL) NOPASSWD:ALL"]
+  lock_passwd: false
+  passwd: "YOUR_HYPERION_USERNAME_PASSWORD_ENCRYPTED"
+  shell: /bin/bash
+ 
+ssh_pwauth: {{ ENABLE_SSH }}
+
+runcmd:
+  - |
+    echo "Running setup for Hyperion user: {{ HYPERION_USER }}"
+    /usr/share/hyperion/scripts/updateHyperionUser.sh -u "{{ HYPERION_USER }}"
+    
+{% if ENABLE_SSH %}
+  - systemctl unmask ssh
+  - systemctl enable ssh
+  - systemctl start ssh
+{% else %}
+  - echo "SSH is disabled in config"
+{% endif %}
+```
+> [!NOTE]
+> The `passwd` field requires a SHA-512 encrypted password hash. The generator tool handles this for you.
+
+::::
+::::::
+
+-> Now, put the SD-Card into your Raspberry Pi and start up the system.
+
+::: info
+The Raspberry Pi might boot in between while configurating the system.
+:::
 
 ### Default Configuration
 ... unless changed by custom configuration files
diff --git a/package.json b/package.json
index 431f1e38..0a14e82c 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
     "floating-vue": "latest",
     "markdown-it": "^14.1.0",
     "markdown-it-github-alerts": "^1.0.0",
-    "medium-zoom": "latest"
+    "medium-zoom": "latest",
+    "sha512crypt-node": "^1.0.2"
   }
 }

From 8cc2011323874ee1c251bfe07ebf99fc055dc33f Mon Sep 17 00:00:00 2001
From: Lord-Grey <lordgrey.emmel@gmail.com>
Date: Tue, 6 Jan 2026 14:29:13 +0100
Subject: [PATCH 3/4] Add German translations

---
 .../components/SystemConfigGenerator.vue      |  90 ++++--
 .../theme/components/WifiConfigGenerator.vue  |  57 +++-
 docs/.vitepress/theme/data/keyboardLayouts.ts | 127 ++++++++
 docs/.vitepress/theme/data/locales.ts         | 154 +++++++++
 docs/de/user/HyperBian.md                     | 299 ++++++++++++++----
 5 files changed, 631 insertions(+), 96 deletions(-)
 create mode 100644 docs/.vitepress/theme/data/keyboardLayouts.ts
 create mode 100644 docs/.vitepress/theme/data/locales.ts

diff --git a/docs/.vitepress/theme/components/SystemConfigGenerator.vue b/docs/.vitepress/theme/components/SystemConfigGenerator.vue
index de0d61da..40aa4636 100644
--- a/docs/.vitepress/theme/components/SystemConfigGenerator.vue
+++ b/docs/.vitepress/theme/components/SystemConfigGenerator.vue
@@ -1,22 +1,22 @@
 <template>
   <div class="system-config-generator">
-    <h2>System Configuration Generator</h2>
-    <p>Generate a customized system configuration for your HyperBian system.</p>
+    <h2>{{ texts.title }}</h2>
+    <p>{{ texts.description }}</p>
 
     <form @submit.prevent="generateConfig" class="config-form">
       <div class="form-group">
-        <label for="username">Username:</label>
-        <input type="text" id="username" v-model="config.username" placeholder="e.g., hyperion">
+        <label for="username">{{ texts.usernameLabel }}:</label>
+        <input type="text" id="username" v-model="config.username" :placeholder="texts.usernamePlaceholder">
       </div>
 
       <div class="form-group">
-        <label for="password">Password:</label>
+        <label for="password">{{ texts.passwordLabel }}:</label>
         <div class="password-wrapper">
           <input 
             :type="showPassword ? 'text' : 'password'" 
             id="password" 
             v-model="config.password" 
-            placeholder="Enter the user's password"
+            :placeholder="texts.passwordPlaceholder"
           />
           <span @click="togglePasswordVisibility" class="password-toggle-icon">
             <svg v-if="showPassword" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>
@@ -26,13 +26,13 @@
       </div>
 
       <div class="form-group">
-        <label for="hostname">Hostname:</label>
-        <input type="text" id="hostname" v-model="config.hostname" placeholder="e.g., hyperbian">
+        <label for="hostname">{{ texts.hostnameLabel }}:</label>
+        <input type="text" id="hostname" v-model="config.hostname" :placeholder="texts.hostnamePlaceholder">
       </div>
 
       <div class="form-group checkbox-group">
         <input type="checkbox" id="use_timezone" v-model="useTimezone">
-        <label for="use_timezone">Set Timezone</label>
+        <label for="use_timezone">{{ texts.setTimezoneLabel }}</label>
         <div v-if="useTimezone" class="sub-form-group">
           <select id="timezone" v-model="config.timezone">
             <option v-for="tz in timezones" :key="tz" :value="tz">
@@ -44,41 +44,91 @@
 
       <div class="form-group checkbox-group">
         <input type="checkbox" id="use_locale" v-model="useLocale">
-        <label for="use_locale">Set Locale</label>
+        <label for="use_locale">{{ texts.setLocaleLabel }}</label>
         <div v-if="useLocale" class="sub-form-group">
-          <input type="text" id="locale" v-model="config.locale" placeholder="e.g., de_DE.UTF-8">
+          <select id="locale" v-model="config.locale">
+            <option v-for="loc in locales" :key="loc" :value="loc">
+              {{ loc }}
+            </option>
+          </select>
         </div>
       </div>
 
       <div class="form-group checkbox-group">
         <input type="checkbox" id="use_keyboard" v-model="useKeyboard">
-        <label for="use_keyboard">Set Keyboard Layout</label>
+        <label for="use_keyboard">{{ texts.setKeyboardLayoutLabel }}</label>
         <div v-if="useKeyboard" class="sub-form-group">
-          <input type="text" id="keyboard_layout" v-model="config.keyboard_layout" placeholder="e.g., de">
+          <select id="keyboard_layout" v-model="config.keyboard_layout">
+            <option v-for="layout in keyboardLayouts" :key="layout" :value="layout">
+              {{ layout }}
+            </option>
+          </select>
         </div>
       </div>
 
       <div class="form-group checkbox-group">
         <input type="checkbox" id="enable_spi" v-model="config.enable_spi">
-        <label for="enable_spi">Enable SPI Interface</label>
+        <label for="enable_spi">{{ texts.enableSpiLabel }}</label>
       </div>
 
       <div class="form-group checkbox-group">
         <input type="checkbox" id="enable_ssh" v-model="config.enable_ssh">
-        <label for="enable_ssh">Enable SSH Access</label>
+        <label for="enable_ssh">{{ texts.enableSshLabel }}</label>
       </div>      
 
       <div>
-      <button type="submit" class="generate-btn">Save Configuration</button>
+      <button type="submit" class="generate-btn">{{ texts.buttonText }}</button>
       </div>
     </form>
   </div>
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue';
+import { ref, reactive, computed } from 'vue';
+import { useData } from 'vitepress';
 import { sha512crypt } from 'sha512crypt-node';
 import { timezones } from '../data/timezones';
+import { locales } from '../data/locales';
+import { keyboardLayouts } from '../data/keyboardLayouts';
+
+const { lang } = useData();
+
+const texts = computed(() => {
+  if (lang.value.startsWith('de')) {
+    return {
+      title: 'Systemkonfigurationsgenerator',
+      description: 'Erstelle eine angepasste Systemkonfiguration für dein HyperBian-System.',
+      usernameLabel: 'Benutzername',
+      usernamePlaceholder: 'z.B. hyperion',
+      passwordLabel: 'Passwort',
+      passwordPlaceholder: 'Gib das Passwort des Benutzers ein',
+      hostnameLabel: 'Hostname',
+      hostnamePlaceholder: 'z.B. hyperbian',
+      setTimezoneLabel: 'Zeitzone festlegen',
+      setLocaleLabel: 'Locale festlegen',
+      setKeyboardLayoutLabel: 'Tastaturlayout festlegen',
+      enableSpiLabel: 'SPI-Schnittstelle aktivieren',
+      enableSshLabel: 'SSH-Zugang aktivieren',
+      buttonText: 'Konfiguration speichern'
+    };
+  }
+  return {
+    title: 'System Configuration Generator',
+    description: 'Generate a customized system configuration for your HyperBian system.',
+    usernameLabel: 'Username',
+    usernamePlaceholder: 'e.g., hyperion',
+    passwordLabel: 'Password',
+    passwordPlaceholder: "Enter the user's password",
+    hostnameLabel: 'Hostname',
+    hostnamePlaceholder: 'e.g., hyperbian',
+    setTimezoneLabel: 'Set Timezone',
+    setLocaleLabel: 'Set Locale',
+    setKeyboardLayoutLabel: 'Set Keyboard Layout',
+    enableSpiLabel: 'Enable SPI Interface',
+    enableSshLabel: 'Enable SSH Access',
+    buttonText: 'Save Configuration'
+  };
+});
 
 const config = reactive({
   username: 'hyperion',
@@ -260,7 +310,8 @@ h2 {
 }
 
 .form-group input[type="text"],
-.form-group input[type="password"] {
+.form-group input[type="password"],
+.form-group select {
   padding: 0.75rem 1rem;
   border: 1px solid var(--vp-c-divider);
   border-radius: 4px;
@@ -270,7 +321,8 @@ h2 {
   width: 100%;
 }
 
-.form-group input:focus {
+.form-group input:focus,
+.form-group select:focus {
   outline: none;
   border-color: var(--vp-c-brand-1);
 }
diff --git a/docs/.vitepress/theme/components/WifiConfigGenerator.vue b/docs/.vitepress/theme/components/WifiConfigGenerator.vue
index d166a19b..ac15cd24 100644
--- a/docs/.vitepress/theme/components/WifiConfigGenerator.vue
+++ b/docs/.vitepress/theme/components/WifiConfigGenerator.vue
@@ -1,28 +1,28 @@
 <template>
   <div class="wifi-config-generator">
-    <h2>WiFi Configuration Generator</h2>
-    <p>Generate a customized WiFi configuration for your HyperBian system.</p>
+    <h2>{{ texts.title }}</h2>
+    <p>{{ texts.description }}</p>
     
     <form @submit.prevent="generateConfig" class="config-form">
       <div class="form-group">
-        <label for="ssid">SSID (Network Name):</label>
+        <label for="ssid">{{ texts.ssidLabel }}:</label>
         <input 
           type="text" 
           id="ssid" 
           v-model="ssid" 
-          placeholder="Enter your WiFi network name"
+          :placeholder="texts.ssidPlaceholder"
           required
         />
       </div>
       
       <div class="form-group">
-        <label for="password">Password:</label>
+        <label for="password">{{ texts.passwordLabel }}:</label>
         <div class="password-wrapper">
           <input 
             :type="showPassword ? 'text' : 'password'" 
             id="password" 
             v-model="password" 
-            placeholder="Enter your WiFi password"
+            :placeholder="texts.passwordPlaceholder"
             required
           />
           <span @click="togglePasswordVisibility" class="password-toggle-icon">
@@ -33,7 +33,7 @@
       </div>
       
       <div class="form-group">
-        <label for="country">Country Code:</label>
+        <label for="country">{{ texts.countryLabel }}:</label>
         <select id="country" v-model="country" required>
           <option v-for="c in countries" :key="c.code" :value="c.code">
             {{ c.name }} ({{ c.code }})
@@ -41,16 +41,44 @@
         </select>
       </div>
       
-      <button type="submit" class="generate-btn">Save Configuration</button>
+      <button type="submit" class="generate-btn">{{ texts.buttonText }}</button>
     </form>
     
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
+import { useData } from 'vitepress'
 import { countries } from '../data/countries'
 
+const { lang } = useData()
+
+const texts = computed(() => {
+  if (lang.value.startsWith('de')) {
+    return {
+      title: 'WLAN-Konfigurationsgenerator',
+      description: 'Erstelle eine angepasste WLAN-Konfiguration für dein HyperBian-System.',
+      ssidLabel: 'SSID (Netzwerkname)',
+      ssidPlaceholder: 'Gib deinen WLAN-Netzwerknamen ein',
+      passwordLabel: 'Passwort',
+      passwordPlaceholder: 'Gib dein WLAN-Passwort ein',
+      countryLabel: 'Ländercode',
+      buttonText: 'Konfiguration speichern'
+    }
+  }
+  return {
+    title: 'WiFi Configuration Generator',
+    description: 'Generate a customized WiFi configuration for your HyperBian system.',
+    ssidLabel: 'SSID (Network Name)',
+    ssidPlaceholder: 'Enter your WiFi network name',
+    passwordLabel: 'Password',
+    passwordPlaceholder: 'Enter your WiFi password',
+    countryLabel: 'Country Code',
+    buttonText: 'Save Configuration'
+  }
+})
+
 const ssid = ref('')
 const password = ref('')
 const country = ref('DE')
@@ -145,10 +173,10 @@ network:
   color: var(--vp-c-text-1);
 }
 
-.form-group input {
+.form-group input,
+.form-group select {
   width: 100%;
   padding: 10px;
-  padding-right: 40px; /* Make space for the icon */
   border: 1px solid var(--vp-c-divider);
   border-radius: 4px;
   font-size: 14px;
@@ -157,7 +185,12 @@ network:
   box-sizing: border-box;
 }
 
-.form-group input:focus {
+.form-group input {
+  padding-right: 40px; /* Make space for the icon */
+}
+
+.form-group input:focus,
+.form-group select:focus {
   outline: none;
   border-color: var(--vp-c-brand-1);
 }
diff --git a/docs/.vitepress/theme/data/keyboardLayouts.ts b/docs/.vitepress/theme/data/keyboardLayouts.ts
new file mode 100644
index 00000000..1781f5fb
--- /dev/null
+++ b/docs/.vitepress/theme/data/keyboardLayouts.ts
@@ -0,0 +1,127 @@
+export const keyboardLayouts = [
+  'ara',
+  'by',
+  'bd',
+  'be',
+  'br',
+  'bg',
+  'ma',
+  'mm',
+  'ca',
+  'cn',
+  'hr',
+  'cz',
+  'dk',
+  'nl',
+  'bt',
+  'ee',
+  'ir',
+  'iq',
+  'fo',
+  'fi',
+  'fr',
+  'ge',
+  'de',
+  'gr',
+  'hu',
+  'is',
+  'in',
+  'il',
+  'it',
+  'jp',
+  'kg',
+  'la',
+  'lt',
+  'lv',
+  'mk',
+  'mt',
+  'mn',
+  'no',
+  'pl',
+  'pt',
+  'ro',
+  'ru',
+  'rs',
+  'si',
+  'sk',
+  'es',
+  'se',
+  'ch',
+  'sy',
+  'tj',
+  'lk',
+  'th',
+  'tr',
+  'gb',
+  'ua',
+  'us',
+  'uz',
+  'vn',
+  'pk',
+  'ke',
+  'za',
+  'kr',
+  'kz',
+  'me',
+  'al',
+  'am',
+  'at',
+  'az',
+  'ba',
+  'brai',
+  'cd',
+  'cz_qwerty',
+  'dev',
+  'dvorak',
+  'dz',
+  'epo',
+  'et',
+  'fi_classic',
+  'fr_bepo',
+  'fr_classic',
+  'gb_dvorak',
+  'ge_alt',
+  'gh',
+  'gn',
+  'ie',
+  'il_phonetic',
+  'in_ben',
+  'in_dev',
+  'in_guj',
+  'in_guru',
+  'in_kan',
+  'in_mal',
+  'in_ori',
+  'in_tam',
+  'in_tel',
+  'in_urd',
+  'jp_dvorak',
+  'kh',
+  'latam',
+  'lk_us',
+  'mao',
+  'md',
+  'ml',
+  'ng',
+  'np',
+  'pl_dvorak',
+  'pt_BR',
+  'ro_std',
+  'ru_phonetic',
+  'sd',
+  'sn',
+  'tg',
+  'tm',
+  'tr_f',
+  'tw',
+  'us_altgr-intl',
+  'us_dvorak',
+  'us_dvorak-intl',
+  'us_dvorak-l',
+  'us_dvorak-r',
+  'us_intl',
+  'us_workman',
+  'us_workman-intl',
+  'uz_cyrillic',
+  'za',
+];
diff --git a/docs/.vitepress/theme/data/locales.ts b/docs/.vitepress/theme/data/locales.ts
new file mode 100644
index 00000000..27f9e9a3
--- /dev/null
+++ b/docs/.vitepress/theme/data/locales.ts
@@ -0,0 +1,154 @@
+export const locales = [
+  'af_ZA.UTF-8',
+  'am_ET.UTF-8',
+  'ar_AE.UTF-8',
+  'ar_BH.UTF-8',
+  'ar_DZ.UTF-8',
+  'ar_EG.UTF-8',
+  'ar_IQ.UTF-8',
+  'ar_JO.UTF-8',
+  'ar_KW.UTF-8',
+  'ar_LB.UTF-8',
+  'ar_LY.UTF-8',
+  'ar_MA.UTF-8',
+  'ar_OM.UTF-8',
+  'ar_QA.UTF-8',
+  'ar_SA.UTF-8',
+  'ar_SD.UTF-8',
+  'ar_SY.UTF-8',
+  'ar_TN.UTF-8',
+  'ar_YE.UTF-8',
+  'as_IN.UTF-8',
+  'az_AZ.UTF-8',
+  'be_BY.UTF-8',
+  'bg_BG.UTF-8',
+  'bn_BD.UTF-8',
+  'bn_IN.UTF-8',
+  'bs_BA.UTF-8',
+  'ca_AD.UTF-8',
+  'ca_ES.UTF-8',
+  'ca_FR.UTF-8',
+  'ca_IT.UTF-8',
+  'cs_CZ.UTF-8',
+  'cy_GB.UTF-8',
+  'da_DK.UTF-8',
+  'de_AT.UTF-8',
+  'de_BE.UTF-8',
+  'de_CH.UTF-8',
+  'de_DE.UTF-8',
+  'de_IT.UTF-8',
+  'de_LI.UTF-8',
+  'de_LU.UTF-8',
+  'el_CY.UTF-8',
+  'el_GR.UTF-8',
+  'en_AU.UTF-8',
+  'en_BW.UTF-8',
+  'en_CA.UTF-8',
+  'en_DK.UTF-8',
+  'en_GB.UTF-8',
+  'en_HK.UTF-8',
+  'en_IE.UTF-8',
+  'en_IN.UTF-8',
+  'en_NG.UTF-8',
+  'en_NZ.UTF-8',
+  'en_PH.UTF-8',
+  'en_SG.UTF-8',
+  'en_US.UTF-8',
+  'en_ZA.UTF-8',
+  'en_ZM.UTF-8',
+  'en_ZW.UTF-8',
+  'es_AR.UTF-8',
+  'es_BO.UTF-8',
+  'es_CL.UTF-8',
+  'es_CO.UTF-8',
+  'es_CR.UTF-8',
+  'es_CU.UTF-8',
+  'es_DO.UTF-8',
+  'es_EC.UTF-8',
+  'es_ES.UTF-8',
+  'es_GT.UTF-8',
+  'es_HN.UTF-8',
+  'es_MX.UTF-8',
+  'es_NI.UTF-8',
+  'es_PA.UTF-8',
+  'es_PE.UTF-8',
+  'es_PR.UTF-8',
+  'es_PY.UTF-8',
+  'es_SV.UTF-8',
+  'es_US.UTF-8',
+  'es_UY.UTF-8',
+  'es_VE.UTF-8',
+  'et_EE.UTF-8',
+  'eu_ES.UTF-8',
+  'fa_IR.UTF-8',
+  'fi_FI.UTF-8',
+  'fo_FO.UTF-8',
+  'fr_BE.UTF-8',
+  'fr_CA.UTF-8',
+  'fr_CH.UTF-8',
+  'fr_FR.UTF-8',
+  'fr_LU.UTF-8',
+  'ga_IE.UTF-8',
+  'gd_GB.UTF-8',
+  'gl_ES.UTF-8',
+  'gu_IN.UTF-8',
+  'he_IL.UTF-8',
+  'hi_IN.UTF-8',
+  'hr_HR.UTF-8',
+  'hu_HU.UTF-8',
+  'hy_AM.UTF-8',
+  'id_ID.UTF-8',
+  'is_IS.UTF-8',
+  'it_CH.UTF-8',
+  'it_IT.UTF-8',
+  'ja_JP.UTF-8',
+  'ka_GE.UTF-8',
+  'kk_KZ.UTF-8',
+  'kl_GL.UTF-8',
+  'km_KH.UTF-8',
+  'kn_IN.UTF-8',
+  'ko_KR.UTF-8',
+  'kok_IN.UTF-8',
+  'lt_LT.UTF-8',
+  'lv_LV.UTF-8',
+  'mi_NZ.UTF-8',
+  'mk_MK.UTF-8',
+  'ml_IN.UTF-8',
+  'mr_IN.UTF-8',
+  'ms_MY.UTF-8',
+  'mt_MT.UTF-8',
+  'nb_NO.UTF-8',
+  'ne_NP.UTF-8',
+  'nl_BE.UTF-8',
+  'nl_NL.UTF-8',
+  'nn_NO.UTF-8',
+  'or_IN.UTF-8',
+  'pa_IN.UTF-8',
+  'pl_PL.UTF-8',
+  'pt_BR.UTF-8',
+  'pt_PT.UTF-8',
+  'ro_RO.UTF-8',
+  'ru_RU.UTF-8',
+  'ru_UA.UTF-8',
+  'sa_IN.UTF-8',
+  'sk_SK.UTF-8',
+  'sl_SI.UTF-8',
+  'sq_AL.UTF-8',
+  'sr_RS.UTF-8',
+  'sv_FI.UTF-8',
+  'sv_SE.UTF-8',
+  'sw_KE.UTF-8',
+  'ta_IN.UTF-8',
+  'te_IN.UTF-8',
+  'th_TH.UTF-8',
+  'tr_CY.UTF-8',
+  'tr_TR.UTF-8',
+  'uk_UA.UTF-8',
+  'ur_PK.UTF-8',
+  'uz_UZ.UTF-8',
+  'vi_VN.UTF-8',
+  'zh_CN.UTF-8',
+  'zh_HK.UTF-8',
+  'zh_SG.UTF-8',
+  'zh_TW.UTF-8',
+];
diff --git a/docs/de/user/HyperBian.md b/docs/de/user/HyperBian.md
index 9b1c1464..e3c643fc 100644
--- a/docs/de/user/HyperBian.md
+++ b/docs/de/user/HyperBian.md
@@ -1,92 +1,261 @@
 # HyperBian
-Ist ein einsatzbereites (Ready-to-use) Image für Deinen Raspberry Pi. Es basiert auf dem originalen Raspberry Pi Foundation Image "Raspberry Pi OS Lite". Hyperion ist bereits vorinstalliert. Einfacher geht es nicht.
+Ist ein gebrauchsfertiges Image für deinen Raspberry Pi und basiert auf dem originalen Image der Raspberry Pi Foundation "Raspberry Pi OS Lite". Hyperion ist bereits vorinstalliert. Einfacher geht es nicht.
 1. [Herunterladen](https://github.com/Hyperion-Project/HyperBian/releases)
-2. Image auf SD brennen 
-3. Raspberry Pi einschalten
-4. Zum Konfigurieren mit Deinem Browser die Adresse `http://IpAdresseDeinesRPi:8090` aufrufen
+2. Image auf eine SD-Karte brennen
+3. Deinen Pi einschalten
+4. Die Seite `http://IpDeinesPi:8090` über deinen Browser aufrufen, um die Hyperion Konfiguration zu starten
 
 ## Anforderungen
-  * SD-Karte mit mindestens 4 GB Größe
+  * SD-Karte mit mindestens 4GB Speicherplatz
   * Raspberry Pi
-  * Linux/Mac/Windows + SD Kartenleser/-schreiber
+  * Linux/Mac/Windows + SD-Kartenleser/-schreiber
 
 ## Installation
   1. Lade das fertige [HyperBian Image](https://github.com/Hyperion-Project/HyperBian/releases) herunter
-  2. Installiere den [Raspberry Pi Imager](https://www.raspberrypi.com/documentation/computers/getting-started.html#raspberry-pi-imager), um das Image auf eine SD-Karte zu brennen.
-  3. Starte den Pi Imager
-  4. Wähle als Betriebssystem "Custom OS" und wähle das heruntergeladene HyperBian-XXXX-Paket aus
-  5. Wähle das Ziel, d.h. die SD-Karte
-  6. Klicken auf "Next" und wähle "No" für keine zusätzlichen Anpassungen
-  7. Das HyperBian-Image sollte nun auf die SD-Karte geschrieben werden
-  8. Stecke die SD-Karte in den Raspberry Pi und starte das System
-
-### WiFi, Zeitzone & ssh-Zugang
-Falls der Raspberry Pi mit WLAN genutzt werden soll oder die Zeitzone bzw. andere OS-bezogene Konfigurationen aktualisiert werden sollen, kann das Pi Imager OS-Customization Menü verwendet werden.
-Im Installationsschritt 6. wähle "Edit Settings" und gib dann z.B. die WLAN SSID, das Passwort und das Land an.
-Sichere die die Einstellungen mit "Save" und fahre mit "Yes" fort, um den Imager-Prozess zu starten.
-
-::: tip Verwenden den Standardbenutzer (und das Passwort) von HyperBian, falls diese angegeben werden müssen.
- - Benutzer: `hyperion`
- - Kennwort: `ambientlight`
- 
-Es kann auch ein anderer Benutzernamen gewählt werden, allerdings muss dann der vorkonfigurierte Dienst von Hyperion später aktualisieren werden-
-Aktualisierung des Dienstes auf den [aktuellen Benutzer](/de/user/GettingStarted.md#andern-des-benutzer-des-dienstes-auf-den-aktuellen-benutzer)
-:::
+  2. Lade dein bevorzugtes Tool zum Brennen des Images auf eine SD-Karte herunter
+
+:::::: tabs :cache-lifetime="0" :options="{ useUrlFragment: false, disableScrollBehavior: true }"
+::::: tab name="Pi Imager"
+  3. Installiere den [Raspberry Pi Imager](https://www.raspberrypi.com/documentation/computers/getting-started.html#raspberry-pi-imager).
+  4. Starte den Pi Imager.
+  5. Wähle dein Raspberry Pi-Gerät aus + klicke auf "Weiter", um fortzufahren.
+  6. Wähle als Betriebssystem "Eigenes Image verwenden" am Ende der Liste.
+  7. Wähle die heruntergeladene HyperBian-Imagedatei aus, klicke auf "Öffnen" und "Weiter", um fortzufahren.
+  8. Wähle dein Speichergerät, d.h. deine SD-Karte, und klicke auf "Weiter", um fortzufahren.
+  9. Klicke auf "Schreiben", um das Schreiben des Images auf die SD-Karte zu beginnen.
+  10. Warte, bis das Image auf die SD-Karte geschrieben ist.
+
+:::::
+::::: tab name="Etcher"
+
+  3. Installiere [balenaEtcher](https://www.balena.io/etcher/).
+  4. Starte Etcher.
+  5. Wähle "Flash from file" und wähle die heruntergeladene HyperBian-Imagedatei aus.
+  6. Wähle "Target" und wähle deine SD-Karte.
+  7. Klicke auf "Flash!", um das Schreiben des Images zu beginnen.
+  8. Warte, bis das Image auf die SD-Karte geschrieben ist.
+:::::
+
+::::: tab name="Windows"
+  3. Installiere den [Win32 Disk Imager](https://sourceforge.net/projects/win32diskimager/).
+  4. Starte den Win32 Disk Imager.
+  5. Wähle die heruntergeladene HyperBian-Imagedatei aus.
+  6. Wähle dein SD-Kartengerät aus.
+  7. Klicke auf "Write", um das Image auf die SD-Karte zu brennen.
+:::::
+::::::
 
-Die Konfiguration wird während des ersten Starts durchgeführt.
+Wenn die SD-Karte erfolgreich vorbereitet wurde, kannst du optional zusätzliche Konfigurationsdateien vorbereiten.
+> [!IMPORTANT]
+> Speichere die Konfigurationsdatei(en) in der Boot-Partition deiner SD-Karte.
+Die Konfiguration wird dann während des ersten Starts durchgeführt.
 
-::: details Alternative Methode
+:::::: details Eine WLAN-Konfiguration vorbereiten
 
-Falls der PI Imager nicht verwende wird oder die Details nicht das OS-Customization Menü angegeben werden sollen, 
-kann man die Einrichtung auch per Datei vornehmen.
+Dieses Tool hilft dir, eine WLAN-Konfigurationsdatei für deine HyperBian-Installation zu erstellen.
+Gib einfach unten deine Netzwerkdetails ein und klicke auf "Konfiguration generieren", um eine angepasste Konfigurationsdatei zu erstellen.
 
-Erstelle eine Datei namens `custom.toml`.
-Passe die Datei mit den gewünschten Einstellungen an. Kommentiere alle die Elemente aus, die nicht geändert werden sollen.
+<WifiConfigGenerator />
 
-Speicher die Datei in der Boot Partion der SD-Karte.
+#### Wie man es benutzt
 
-**Beispiel - custom.toml**
+1. Gib deine Netzwerkdetails ein:
+   - **SSID**: Dein WLAN-Netzwerkname
+   - **Passwort**: Dein WLAN-Passwort
+   - **Land**: Dein zweistelliger Ländercode (z.B. DE, US, GB, FR)
 
-``` toml
-# Required:
-config_version = 1
+2. Klicke auf "Konfiguration speichern", um deine angepasste `network-config`-Datei zu speichern.
 
-[system]
-hostname = "HyperBian"
+3. Die generierte Konfigurationsdatei wird in deinem Download-Ordner gespeichert.
 
-[user]
-name = "hyperion"
-# The password can be encrypted or plain. To encrypt, we can use "openssl passwd -5 raspberry"
-password = "ambientlight"
-password_encrypted = false
+4. Kopiere die `network-config`-Datei in die Boot-Partition deiner HyperBian-SD-Karte.
 
-[ssh]
-# ssh_import_id = "gh:user" # import public keys from github
-enabled = false
-password_authentication = true
-# We can also seed the ssh public keys configured for the default user:
-# authorized_keys = [ "ssh-rsa ... user@host", ... ]
+#### Was ist die network-config-Datei?
 
-[wlan]
-ssid = "myWifi"
-password = "myWifiPassword"
-password_encrypted = false
-hidden = false
-# The country is written to /etc/default/crda
-# Reference: https://wireless.wiki.kernel.org/en/developers/Regulatory
-country = "DE"
+Die `network-config`-Datei wird von HyperBian während des ersten Starts verwendet, um die WLAN-Verbindung deines Raspberry Pi zu konfigurieren. Indem du diese Datei vor dem ersten Start in der Boot-Partition platzierst, verbindet sich dein Gerät automatisch mit deinem WLAN-Netzwerk.
 
-[locale]
-keymap = "de"
-timezone = "Europe/Berlin"
+:::: details Manuelle Konfiguration
+
+Wenn du die Konfigurationsdatei lieber manuell bearbeiten möchtest, kannst du die folgende Vorlage verwenden:
+
+```yaml
+####################################################################################
+## Configure your initial HyperBian Wifi connectivity to your needs below.
+## Uncomment and edit the relevant sections as needed.
+##
+## If you have additional needs refer to the cloud-init documentation 
+## and the netplan reference for full details:
+##
+## https://netplan.io/reference
+## https://cloudinit.readthedocs.io/en/latest/topics/network-config.html
+## https://cloudinit.readthedocs.io/en/latest/topics/network-config-format-v2.html
+####################################################################################
+
+network:
+  version: 2 
+  wifis:
+    wlan0:
+      dhcp4: true
+      optional: true
+      access-points:
+        "YOUR_SSID":
+          password: "YOUR_PASSWORD"
+      regulatory-domain: YOUR_COUNTRY_CODE
 ```
+
+Ersetze `YOUR_SSID`, `YOUR_PASSWORD` und `YOUR_COUNTRY_CODE` durch deine tatsächlichen Werte.
+::::
+
+:::: tip
+Eine Liste der Ländercodes findest du im [ISO 3166-1 alpha-2 Standard](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2).
+::::
+
+::::::
+
+:::::: details Eine Systemkonfiguration vorbereiten
+
+Dieses Tool hilft dir, eine Systemkonfigurationsdatei für deine HyperBian-Installation zu erstellen.
+Gib einfach unten deine Systemdetails ein und klicke auf "Konfiguration generieren", um eine angepasste Konfigurationsdatei zu erstellen.
+
+<SystemConfigGenerator />
+
+#### Wie man es benutzt
+
+1. Fülle das Formular mit deinen gewünschten Systemeinstellungen aus:
+ - **Benutzername / Passwort**
+ - **Hostname**
+ - **Zeitzone**: Zeitzonen müssen gültige IANA-Zeitzonenbezeichner sein
+ - **Locale**: Muss der glibc-Locale-Benennung folgen und vom System unterstützt werden
+ - **Tastaturlayout**: Layouts müssen gültige XKB-Layoutnamen sein
+ - **SPI**: Aktiviere/Deaktiviere die SPI-Schnittstelle
+ - **SSH**: Aktiviere/Deaktiviere den SSH-Zugang
+2. Klicke auf "Konfiguration speichern", um deine angepasste `user-data`-Datei zu speichern.
+3. Die generierte Konfigurationsdatei wird in deinem Download-Ordner gespeichert.
+4. Kopiere die `user-data`-Datei in die Boot-Partition deiner HyperBian-SD-Karte.
+
+
+#### Was ist die user-data-Datei?
+
+Die `user-data`-Datei wird von HyperBian während des ersten Starts verwendet, um das Setup deines Raspberry Pi zu konfigurieren. Indem du diese Datei in der Boot-Partition platzierst, kannst du Einstellungen wie Benutzername, Passwort, Hostname und mehr vorkonfigurieren.
+
+:::: details Manuelle Konfiguration
+
+Wenn du die Konfigurationsdatei lieber manuell bearbeiten möchtest, kannst du die folgende Vorlage verwenden. Ersetze die Platzhalter- oder Beispielwerte durch deine gewünschte Konfiguration. Möglicherweise musst du Auswahlen auskommentieren, damit sie funktionieren.
+Hinweis: Du musst ein verschlüsseltes Passwort generieren, z.B. über `openssl passwd -6 "DEIN_PASSWORT"` und YOUR_HYPERION_USERNAME_PASSWORD_ENCRYPTED durch die Ausgabe ersetzen.
+
+```yaml
+## template: jinja
+#cloud-config
+
+# This is the user-data configuration file for cloud-init. By default this sets
+# up an initial user called "ubuntu" with password "ubuntu", which must be
+# changed at first login. However, many additional actions can be initiated on
+# first boot from this file. The cloud-init documentation has more details:
+#
+# https://cloudinit.readthedocs.io/
+#
+# Please note that the YAML format employed by this file is sensitive to
+# differences in whitespace; if you are editing this file in an editor (like
+# Notepad) which uses literal tabs, take care to only use spaces for
+# indentation. See the following link for more details:
+#
+# https://en.wikipedia.org/wiki/YAML
+#
+
+##################################################################
+## Configure your initial HyperBian system to your needs below ###
+## Uncomment and edit the relevant sections as needed.         ###
+##################################################################
+
+# 1. Define the Hyperion user name (optional)
+{% set HYPERION_USER = "YOUR_HYPERION_USERNAME" %}
+
+# 2. Define, if ssh access should be enabled (optional)
+{% set ENABLE_SSH = false %}
+
+# 3. Set the system's hostname (optional)
+hostname: YOUR_HYPERBIAN_HOSTNAME
+
+# 4. Set the timezone for this instance (optional)
+# the value of 'timezone' must exist in /usr/share/zoneinfo
+# Run: timedatectl list-timezones
+
+## Sample for Berlin timezone
+#timezone: Europe/Berlin
+
+# 5. Set the locale to a given locale; default: en_GB.UTF-8 (optional)
+# Run: locale -a
+
+## Sample for German locale
+#locale: de_DE.UTF-8
+
+# 6. Set up the keyboard layout (optional)
+# See localectl(1), in particular the various list-x11-* sub-commands, 
+# to determine the available models, layouts, variants, and options
+# Run: localectl list-x11-keymap-layouts
+
+## Sample for German keyboard layout
+#keyboard:
+#  layout: de
+
+# 7. Enable the SPI interface (optional)
+rpi:
+  interfaces:
+    spi: true
+
+###############################
+### DO NOT CHANGE THE BELOW ###
+###############################
+
+users:
+- name: {{ HYPERION_USER }}
+  gecos: Hyperion user
+  groups: users, dialout, sudo, video, audio, gpio, spi, i2c
+  sudo: ["ALL=(ALL) NOPASSWD:ALL"]
+  lock_passwd: false
+  passwd: "YOUR_HYPERION_USERNAME_PASSWORD_ENCRYPTED"
+  shell: /bin/bash
+ 
+ssh_pwauth: {{ ENABLE_SSH }}
+
+runcmd:
+  - |
+    echo "Running setup for Hyperion user: {{ HYPERION_USER }}"
+    /usr/share/hyperion/scripts/updateHyperionUser.sh -u "{{ HYPERION_USER }}"
+    
+{% if ENABLE_SSH %}
+  - systemctl unmask ssh
+  - systemctl enable ssh
+  - systemctl start ssh
+{% else %}
+  - echo "SSH is disabled in config"
+{% endif %}
+```
+> [!NOTE]
+> Das `passwd`-Feld erfordert einen SHA-512-verschlüsselten Passwort-Hash. Das Generator-Tool erledigt dies für dich.
+
+::::
+::::::
+
+-> Lege nun die SD-Karte in deinen Raspberry Pi ein und starte das System.
+
+::: info
+Der Raspberry Pi kann während der Konfiguration des Systems zwischendurch neu starten.
 :::
 
-#### Standard SSH LOGIN
- - Benutzername: `hyperion`
+### Standardkonfiguration
+... es sei denn, sie wird durch benutzerdefinierte Konfigurationsdateien geändert
+
+::: tip HyperBians Standardbenutzer und -passwort
+ - Benutzer: `hyperion`
  - Passwort: `ambientlight`
+:::
+
+::: tip
+Standardmäßig wird HyperBian mit einer englischen Tastaturbelegung ausgeliefert. Wenn du keine englische Tastatur besitzt, könnten einige Tasten an einer anderen Stelle zu finden sein. Es sind z.B. die Zeichen 'y' und 'z' vertauscht. Für den Benutzernamen musst Du also zuerstmal `hzperion` tippen; danach kannst Du das Tataturlayout per `sudo raspi-config` ändern.
+:::
 
-::: tip Tip
-  HyperBian wird mit einer englischen Tastatur-Konfiguration ausgeliefert. Dort sind die Zeichen 'y' und 'z' vertauscht. Für den Benutzernamen musst Du also zuerstmal `hzperion` tippen; danach kannst Du das Tataturlayout per `sudo raspi-config` ändern.
+::: tip
+Nach erfolgreicher Anmeldung kannst du jede Konfiguration auch über `sudo raspi-config` aktualisieren.
 :::
 

From d5c50efd1961d955f0f16321adc7336edab758c0 Mon Sep 17 00:00:00 2001
From: Lord-Grey <lordgrey.emmel@gmail.com>
Date: Mon, 19 Jan 2026 20:01:06 +0100
Subject: [PATCH 4/4] Clarify that default configs file can be edited too

---
 docs/de/user/HyperBian.md | 5 ++++-
 docs/user/HyperBian.md    | 4 +++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/docs/de/user/HyperBian.md b/docs/de/user/HyperBian.md
index e3c643fc..99d927b6 100644
--- a/docs/de/user/HyperBian.md
+++ b/docs/de/user/HyperBian.md
@@ -45,7 +45,10 @@ Ist ein gebrauchsfertiges Image für deinen Raspberry Pi und basiert auf dem ori
 :::::
 ::::::
 
-Wenn die SD-Karte erfolgreich vorbereitet wurde, kannst du optional zusätzliche Konfigurationsdateien vorbereiten.
+Wenn die SD-Karte erfolgreich vorbereitet wurde, kannst du optional zusätzliche Konfigurationsdateien mit den unten stehenden Assistenten vorbereiten.
+
+Alternativ kannst du die mit dem Image gelieferten Konfigurationsdateien bearbeiten. Der Abschnitt "Manuelle Konfiguration" der nachfolgenden WLAN- und Systemkonfigurationsanleitung unterstützt dich bei der Aktualisierung der Konfiguration.
+
 > [!IMPORTANT]
 > Speichere die Konfigurationsdatei(en) in der Boot-Partition deiner SD-Karte.
 Die Konfiguration wird dann während des ersten Starts durchgeführt.
diff --git a/docs/user/HyperBian.md b/docs/user/HyperBian.md
index 795e048a..85554e22 100644
--- a/docs/user/HyperBian.md
+++ b/docs/user/HyperBian.md
@@ -45,7 +45,9 @@ Is a ready to use image for your Raspberry Pi. Based on the original Raspberry P
 :::::
 ::::::
 
-When the SD-Card was prepared sucessfully, you can optionally prepare additional configuration files.
+When the SD-Card was prepared successfully, you can optionally prepare additional configuration files via the configuration wizards below.
+
+Alternatively, you can edit the default ones provided along with the image. The Manual Configuration section of the Wifi- and System Configuration guide below supports you with the details on how to edit the content.
 > [!IMPORTANT]
 > Save the configuration file(s) in the boot partition of your SD-Card.
 The configuration will then happen during the first boot.