Update index.html

index.html

@@ -306,13 +306,17 @@ footer {
     <div class="container">
 <div class="toggle-switch" style="position: absolute; top: 10px; right: 10px;">
   <input type="checkbox" id="theme-switch">
-  <label for="theme-switch">
-    <div class="sun" style="background-color: #ff0; border-radius: 50%; width: 22px; height: 22px; text-align: center;">☀️</div>
-    <div class="moon" style="background-color: #bbb; border-radius: 50%; width: 22px; height: 22px; text-align: center;">🌙</div>
+  <label for="theme-switch" style="display: flex; align-items: center; justify-content: space-between; padding: 2px;">
+    <div class="sun" style="background-color: #ff0; border-radius: 50%; width: 22px; height: 22px;"></div>
+    <div class="slider" style="background-color: #ccc; border-radius: 34px; width: 50px; height: 26px; position: relative;">
+      <div class="dot" style="background-color: #fff; border-radius: 50%; width: 22px; height: 22px; position: absolute; top: 2px; left: 2px; transition: 0.3s;"></div>
+    </div>
+    <div class="moon" style="background-color: #bbb; border-radius: 50%; width: 22px; height: 22px;"></div>
   </label>
 </div>
 
 
+
         <div class="main">
             <h2>Introduction</h2>
             <p>This document provides a simple JavaScript client for interacting with the LuminAI API. The client allows you to send requests with various parameters and receive results from the API.</p>