From 47f6bb2062f7a1d25ac632e1906f72c9e4a3187a Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Thu, 2 Apr 2026 11:35:25 +0000
Subject: [PATCH] update display

---
 assets/js/main.js | 14 +++++++-------
 display.php       |  8 ++++----
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/assets/js/main.js b/assets/js/main.js
index e99f77b..d07a5dd 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -63,9 +63,10 @@ document.addEventListener('DOMContentLoaded', () => {
             fullscreenButton.title = isFullscreen
                 ? (fullscreenButton.dataset.labelExit || 'Exit full display')
                 : (fullscreenButton.dataset.labelEnter || 'Full display');
-            fullscreenButton.innerHTML = isFullscreen
-                ? '<i class="bi bi-fullscreen-exit"></i>'
-                : '<i class="bi bi-arrows-fullscreen"></i>';
+            const icon = fullscreenButton.querySelector('i');
+            if (icon) {
+                icon.className = isFullscreen ? 'bi bi-fullscreen-exit' : 'bi bi-arrows-fullscreen';
+            }
             fullscreenButton.setAttribute('aria-pressed', isFullscreen ? 'true' : 'false');
         };
 
@@ -139,10 +140,9 @@ document.addEventListener('DOMContentLoaded', () => {
         if (audioBtn) {
             const updateAudioBtnState = () => {
                 const isEnabled = window.localStorage.getItem('hospitalQueue:audioEnabled') === 'true';
-                if (isEnabled) {
-                    audioBtn.innerHTML = '<i class="bi bi-megaphone-fill"></i>';
-                } else {
-                    audioBtn.innerHTML = '<i class="bi bi-megaphone"></i>';
+                const icon = audioBtn.querySelector('i');
+                if (icon) {
+                    icon.className = isEnabled ? 'bi bi-megaphone-fill' : 'bi bi-megaphone';
                 }
                 audioBtn.setAttribute('aria-pressed', isEnabled.toString());
                 
diff --git a/display.php b/display.php
index 1ad1876..43c5439 100644
--- a/display.php
+++ b/display.php
@@ -59,10 +59,10 @@ qh_page_start(
     </div>
     <div class="d-flex align-items-center gap-3">
       <div class="fs-5 fw-bold text-dark js-live-clock"><?= qh_h(date('H:i')) ?></div>
-      <button type="button" class="btn btn-outline-secondary btn-sm shadow-sm me-2 js-audio-toggle" id="globalAudioToggle" title="<?= qh_h(qh_t('Toggle Audio', 'تبديل الصوت')) ?>">
-        <i class="bi bi-megaphone"></i>
-      </button>
-      <button type="button" class="btn btn-outline-secondary btn-sm shadow-sm js-fullscreen-toggle" aria-pressed="false" data-label-enter="<?= qh_h(qh_t('Fullscreen', 'ملء الشاشة')) ?>" data-label-exit="<?= qh_h(qh_t('Exit fullscreen', 'إنهاء ملء الشاشة')) ?>"><i class="bi bi-arrows-fullscreen"></i></button>
+        <button type="button" class="btn btn-outline-secondary btn-sm shadow-sm me-2 d-flex align-items-center gap-1 js-audio-toggle" id="globalAudioToggle" title="<?= qh_h(qh_t('Toggle Audio', 'تبديل الصوت')) ?>">
+          <i class="bi bi-megaphone"></i> <span class="d-none d-sm-inline"><?= qh_h(qh_t('Sound', 'الصوت')) ?></span>
+        </button>
+      <button type="button" class="btn btn-outline-secondary btn-sm shadow-sm d-flex align-items-center gap-1 js-fullscreen-toggle" aria-pressed="false" data-label-enter="<?= qh_h(qh_t('Fullscreen', 'ملء الشاشة')) ?>" data-label-exit="<?= qh_h(qh_t('Exit fullscreen', 'إنهاء ملء الشاشة')) ?>"><i class="bi bi-arrows-fullscreen"></i> <span class="d-none d-sm-inline"><?= qh_h(qh_t('Fullscreen', 'ملء الشاشة')) ?></span></button>
     </div>
   </header>