Further updating dark / light mode toggle switch

TheWongLife · May 27, 2024 · 1e638c1 · 1e638c1
1 parent b8ad945
commit 1e638c1
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 8 deletions.
diff --git a/about.html b/about.html
@@ -20,7 +20,7 @@
                 <div class="mx-4">
                     <a class="navbar-brand" href="#"> 
                         <img src="Nicholas_Wong_Favicon.png" 
-                            height="25"> 
+                            height="40"> 
                     </a>
                 </div>
                 <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
@@ -40,8 +40,9 @@
                             <a class="nav-link" href="resume.html">Resume</a>
                         </li>
                         <div class="form-check form-switch">
+                            <p>Light 🌞</p>
                             <input class="form-check-input" type="checkbox" id="darkModeSwitch" checked>
-                            <label class="form-check-label" for="darkModeSwitch">Light / Dark</label>
+                            <p>Dark 🌑</p>
                         </div>
                     </ul>
                 </div>

diff --git a/contact.html b/contact.html
@@ -20,7 +20,7 @@
                 <div class="mx-4">
                     <a class="navbar-brand" href="#"> 
                         <img src="Nicholas_Wong_Favicon.png" 
-                            height="25"> 
+                            height="40"> 
                     </a>
                 </div>
                 <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
@@ -40,8 +40,9 @@
                             <a class="nav-link" href="resume.html">Resume</a>
                         </li>
                         <div class="form-check form-switch">
+                            <p>Light 🌞</p>
                             <input class="form-check-input" type="checkbox" id="darkModeSwitch" checked>
-                            <label class="form-check-label" for="darkModeSwitch">Light / Dark</label>
+                            <p>Dark 🌑</p>
                         </div>
                     </ul>
                 </div>

diff --git a/index.html b/index.html
@@ -20,7 +20,7 @@
                 <div class="mx-4">
                     <a class="navbar-brand" href="#"> 
                         <img src="Nicholas_Wong_Favicon.png" 
-                            height="25"> 
+                            height="40"> 
                     </a>
                 </div>
                 <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
@@ -40,8 +40,9 @@
                             <a class="nav-link" href="resume.html">Resume</a>
                         </li>
                         <div class="form-check form-switch">
+                            <p>Light 🌞</p>
                             <input class="form-check-input" type="checkbox" id="darkModeSwitch" checked>
-                            <label class="form-check-label" for="darkModeSwitch">Light / Dark</label>
+                            <p>Dark 🌑</p>
                         </div>
                     </ul>
                 </div>

diff --git a/resume.html b/resume.html
@@ -20,7 +20,7 @@
                 <div class="mx-4">
                     <a class="navbar-brand" href="#"> 
                         <img src="Nicholas_Wong_Favicon.png" 
-                            height="25"> 
+                            height="40"> 
                     </a>
                 </div>
                 <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
@@ -40,8 +40,9 @@
                             <a class="nav-link" href="resume.html">Resume</a>
                         </li>
                         <div class="form-check form-switch">
+                            <p>Light 🌞</p>
                             <input class="form-check-input" type="checkbox" id="darkModeSwitch" checked>
-                            <label class="form-check-label" for="darkModeSwitch">Light / Dark</label>
+                            <p>Dark 🌑</p>
                         </div>
                     </ul>
                 </div>