diff --git a/web/kvm/index.html b/web/kvm/index.html
index 7ddd7659..caecddf0 100644
--- a/web/kvm/index.html
+++ b/web/kvm/index.html
@@ -62,9 +62,12 @@
-  |
- Raspberry Pi's health is at risk This is not a drill! A red icon indicates a current issue,
- a yellow one that was observed since the device booted up. |
+  |
+ Raspberry Pi's health is at risk |
+
+
+ This is not a drill! A red icon indicates a current issue,
+ a yellow one that was observed since the device booted up |
@@ -73,9 +76,12 @@
-  |
- Undervoltage detected Make sure your power supply and cabling are providing
- enough power to the Raspberry Pi (3A minimum). |
+  |
+ Undervoltage detected |
+
+
+ Make sure your power supply and cabling are providing
+ enough power to the Raspberry Pi (3A minimum) |
@@ -85,9 +91,12 @@
-  |
- Overheating detected Frequency capping due to overheating.
- Improve cooling of the Raspberry Pi. |
+  |
+ Overheating detected |
+
+
+ Frequency capping due to overheating,
+ improve cooling of the Raspberry Pi |
@@ -176,9 +185,8 @@
-  |
- Mass Storage Device is offline
- |
+  |
+ Mass Storage Device is offline |
@@ -188,9 +196,11 @@
-  |
- Current image is broken! Perhaps uploading was interrupted
- |
+  |
+ Current image is broken! |
+
+
+ Perhaps uploading was interrupted
|
@@ -200,9 +210,11 @@
-  |
- Current image is too big for CD-ROM! The device filesystem will be truncated to 2.2GiB
- |
+  |
+ Current image is too big for CD-ROM! |
+
+
+ | The device filesystem will be truncated to 2.2GiB |
@@ -212,9 +224,11 @@
-  |
- Current image is out of storag This image was connected manually using kvmd-otgmsd
- |
+  |
+ Current image is out of storag |
+
+
+ | This image was connected manually using kvmd-otgmsd |
@@ -224,9 +238,8 @@
-  |
- Another user uploads an image
- |
+  |
+ Another user uploads an image |
diff --git a/web/kvm/navbar.pug b/web/kvm/navbar.pug
index d7b5c0cc..33fb4d4f 100644
--- a/web/kvm/navbar.pug
+++ b/web/kvm/navbar.pug
@@ -1,28 +1,19 @@
mixin navbar_led(id, icon)
img(data-dont-hide-menu id=id, class="led-gray" src=`${svg_dir}/${icon}.svg`)
-mixin navbar_message(icon, short)
+mixin menu_message(icon, short, classes="")
div(class="text")
table
tr
- td #[img(class="sign" src=`${svg_dir}/${icon}.svg`)]
- td
+ td(rowspan="2") #[img(class=`sign ${classes}` src=`${svg_dir}/${icon}.svg`)]
+ td(style="line-height:1.5")
| #[b #{short}]
- if block
- br
- sup
+ if block
+ tr
+ td
+ sup(style="line-height:1")
block
-mixin navbar_health_message(icon, short, gray)
- div(class="text")
- table
- tr
- td #[img(class=`sign ${gray ? " led-gray" : ""}` src=`${svg_dir}/${icon}.svg`)]
- td
- | #[b #{short}] #[br] #[br]
- sup
- block
-
mixin switch(id)
div(class="switch-box")
input(checked type="checkbox" id=id class="switch-checkbox")
@@ -42,19 +33,19 @@ ul(id="navbar")
img(data-dont-hide-menu id="hw-health-overheating-led" class="hidden" src=`${svg_dir}/led-overheating.svg`)
| ↴
div(data-dont-hide-menu class="menu")
- +navbar_health_message("warning", "Raspberry Pi's health is at risk", false)
+ +menu_message("warning", "Raspberry Pi's health is at risk")
| This is not a drill! A red icon indicates a current issue,#[br]
- | a yellow one that was observed since the device booted up.
+ | a yellow one that was observed since the device booted up
div(id="hw-health-message-undervoltage" class="hidden")
hr
- +navbar_health_message("led-undervoltage", "Undervoltage detected", true)
+ +menu_message("led-undervoltage", "Undervoltage detected", "led-gray")
| Make sure your power supply and cabling are providing#[br]
- | enough power to the Raspberry Pi (3A minimum).
+ | enough power to the Raspberry Pi (3A minimum)
div(id="hw-health-message-overheating" class="hidden")
hr
- +navbar_health_message("led-overheating", "Overheating detected", true)
- | Frequency capping due to overheating.#[br]
- | Improve cooling of the Raspberry Pi.
+ +menu_message("led-overheating", "Overheating detected", "led-gray")
+ | Frequency capping due to overheating,#[br]
+ | improve cooling of the Raspberry Pi
li(class="right")
a(class="menu-button" href="#")
@@ -128,22 +119,22 @@ ul(id="navbar")
| Mass Storage ↴
div(data-dont-hide-menu id="msd-menu" class="menu")
div(id="msd-message-offline" class="hidden")
- +navbar_message("warning", "Mass Storage Device is offline")
+ +menu_message("warning", "Mass Storage Device is offline")
hr
div(id="msd-message-image-broken" class="hidden")
- +navbar_message("warning", "Current image is broken!")
- | Perhaps uploading was interrupted
+ +menu_message("warning", "Current image is broken!")
+ | Perhaps uploading was interrupted#[br]
hr
div(id="msd-message-too-big-for-cdrom" class="hidden")
- +navbar_message("warning", "Current image is too big for CD-ROM!")
+ +menu_message("warning", "Current image is too big for CD-ROM!")
| The device filesystem will be truncated to 2.2GiB
hr
div(id="msd-message-out-of-storage" class="hidden")
- +navbar_message("warning", "Current image is out of storag")
+ +menu_message("warning", "Current image is out of storag")
| This image was connected manually using #[b kvmd-otgmsd]
hr
div(id="msd-message-another-user-uploads" class="hidden")
- +navbar_message("info", "Another user uploads an image")
+ +menu_message("info", "Another user uploads an image")
hr
table(class="kv")
tr