From b127bf5edfc4e00c38d457cdd5e0100ce8b066ca Mon Sep 17 00:00:00 2001
From: Aleksandr Gumroian <aleksandr.gumroian@nic.cz>
Date: Wed, 28 Aug 2024 17:10:36 +0200
Subject: [PATCH 1/4] Update icon color classes to use "text-secondary" instead
 of "text-dark"

---
 src/bootstrap/PasswordInput.js        | 2 +-
 src/common/WiFiSettings/WiFiQRCode.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/bootstrap/PasswordInput.js b/src/bootstrap/PasswordInput.js
index 510db1d..fb9c57a 100644
--- a/src/bootstrap/PasswordInput.js
+++ b/src/bootstrap/PasswordInput.js
@@ -49,7 +49,7 @@ function PasswordInput({ withEye, newPass, ...props }) {
                     <FontAwesomeIcon
                         icon={isHidden ? faEye : faEyeSlash}
                         style={{ width: "1.25rem" }}
-                        className="text-dark"
+                        className="text-secondary"
                     />
                 </button>
             )}
diff --git a/src/common/WiFiSettings/WiFiQRCode.js b/src/common/WiFiSettings/WiFiQRCode.js
index 08bffdd..8816009 100644
--- a/src/common/WiFiSettings/WiFiQRCode.js
+++ b/src/common/WiFiSettings/WiFiQRCode.js
@@ -42,7 +42,7 @@ export default function WiFiQRCode({ SSID, password }) {
                     icon="fa-solid fa-qrcode"
                     title={_("Show QR code")}
                     aria-label={_("Show QR code")}
-                    className="text-dark"
+                    className="text-secondary"
                 />
             </button>
             {modal ? (

From ea590e443cf4fa6572256ad370908884abc924cb Mon Sep 17 00:00:00 2001
From: Aleksandr Gumroian <aleksandr.gumroian@nic.cz>
Date: Fri, 30 Aug 2024 15:19:19 +0200
Subject: [PATCH 2/4] Refactor WiFiGuestForm component to get rid of obsolete
 "input-group-append" div element

---
 src/common/WiFiSettings/WiFiGuestForm.js | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/common/WiFiSettings/WiFiGuestForm.js b/src/common/WiFiSettings/WiFiGuestForm.js
index 33dc153..49d34de 100644
--- a/src/common/WiFiSettings/WiFiGuestForm.js
+++ b/src/common/WiFiSettings/WiFiGuestForm.js
@@ -68,14 +68,11 @@ export default function WifiGuestForm({
                         }))}
                         {...props}
                     >
-                        <div className="input-group-append">
-                            <WiFiQRCode
-                                SSID={formData.SSID}
-                                password={formData.password}
-                            />
-                        </div>
+                        <WiFiQRCode
+                            SSID={formData.SSID}
+                            password={formData.password}
+                        />
                     </TextInput>
-
                     <PasswordInput
                         withEye
                         label={_("Password")}

From e7ec494bb247f48880ebd7dd997212fac47d7b83 Mon Sep 17 00:00:00 2001
From: Aleksandr Gumroian <aleksandr.gumroian@nic.cz>
Date: Fri, 30 Aug 2024 15:20:25 +0200
Subject: [PATCH 3/4] Update Wi-Fi QRCodeModal component to use new button
 styles & add close button

---
 src/common/WiFiSettings/WiFiQRCode.js | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/common/WiFiSettings/WiFiQRCode.js b/src/common/WiFiSettings/WiFiQRCode.js
index 8816009..e5e39b3 100644
--- a/src/common/WiFiSettings/WiFiQRCode.js
+++ b/src/common/WiFiSettings/WiFiQRCode.js
@@ -70,17 +70,26 @@ function QRCodeModal({ shown, setShown, SSID, password }) {
             <ModalHeader setShown={setShown} title={_("Wi-Fi QR Code")} />
             <ModalBody>
                 <QRCode
+                    className="d-block mx-auto img-logo-black"
                     renderAs="svg"
                     value={toQRCodeContent(SSID, password)}
                     level="M"
                     size={350}
                     includeMargin
-                    style={{ display: "block", margin: "auto" }}
                 />
             </ModalBody>
             <ModalFooter>
                 <Button
-                    className="btn-outline-primary"
+                    className="btn-secondary"
+                    onClick={(e) => {
+                        e.preventDefault();
+                        setShown(false);
+                    }}
+                >
+                    {_("Close")}
+                </Button>
+                <Button
+                    className="btn-primary"
                     onClick={(e) => {
                         e.preventDefault();
                         createAndDownloadPdf(SSID, password);

From cc19b4b293cfb2cf684b2f1ba95ed30f024b8619 Mon Sep 17 00:00:00 2001
From: Aleksandr Gumroian <aleksandr.gumroian@nic.cz>
Date: Fri, 30 Aug 2024 15:22:13 +0200
Subject: [PATCH 4/4] Update Snapshots

---
 .../__snapshots__/WiFiSettings.test.js.snap   | 22 ++++++++-----------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/src/common/WiFiSettings/__tests__/__snapshots__/WiFiSettings.test.js.snap b/src/common/WiFiSettings/__tests__/__snapshots__/WiFiSettings.test.js.snap
index cdfd252..8b14453 100644
--- a/src/common/WiFiSettings/__tests__/__snapshots__/WiFiSettings.test.js.snap
+++ b/src/common/WiFiSettings/__tests__/__snapshots__/WiFiSettings.test.js.snap
@@ -339,7 +339,7 @@ exports[`<WiFiSettings/> Snapshot guest network. 1`] = `
 - First value
 + Second value
 
-@@ -524,10 +524,91 @@
+@@ -524,10 +524,87 @@
             <small>
               Enables Wi-Fi for guests, which is separated from LAN network. Devices connected to this network are allowed to access the internet, but aren't allowed to access other devices and the configuration interface of the router. Parameters of the guest network can be set in the Guest network tab.
             </small>
@@ -363,18 +363,14 @@ exports[`<WiFiSettings/> Snapshot guest network. 1`] = `
 +             type="text"
 +             value="TestGuestSSID"
 +           />
-+           <div
-+             class="input-group-append"
++           <button
++             class="input-group-text"
++             type="button"
 +           >
-+             <button
-+               class="input-group-text"
-+               type="button"
-+             >
-+               <i
-+                 class="fa"
-+               />
-+             </button>
-+           </div>
++             <i
++               class="fa"
++             />
++           </button>
 +         </div>
 +         <div
 +           class="form-text"
@@ -431,7 +427,7 @@ exports[`<WiFiSettings/> Snapshot guest network. 1`] = `
           class="form-check form-switch mb-3 d-flex align-items-center"
         >
           <input
-@@ -550,10 +631,11 @@
+@@ -550,10 +627,11 @@
         <div
           class="text-end"
         >