Revert "Added toggle button"

Tejashri-Taral · Nov 5, 2024 · 844b762 · 844b762
1 parent 10ca861
commit 844b762
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 137 deletions.
diff --git a/about.html b/about.html
@@ -3,7 +3,6 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <!-- <title>CSS Toggle Button</title> -->
     <title>About Us - TrendTrove</title>
     <link rel="stylesheet" href="preloaderStyle.css">
     <link rel="stylesheet" href="style.css" />
@@ -13,65 +12,11 @@
     <link rel="stylesheet" href="styles.css">
     <link rel="stylesheet" herf="https://use.fontawesome.com/releases/v5.4.1/css/all.css">
     <!-- Link to your common CSS file -->
-
     <style>
       /* General Styles */
-  /* Toggle Button Style */
-
-  /* .toggle {
-    position: absolute;
-    display: inline-block;
-    width: 50px;
-    height: 26px;
-    /* position: absolute; 
-    top: 13px;
-    left: 13px;
-    right: 0;
-    bottom: 0;
-    background-color: #8e8989;
-    transition: 0.4s;
-    border-radius: 30px; ;
-  }
-
-  .toggle input {
-    opacity: 0;
-    width: 0;
-    height: 0;
-  }
-   .slider {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background-color: #e73636;
-    transition: 0.4s;
-    border-radius: 30px;
-    border-color:rgba(255, 244, 221, 0.7) ;
-  } 
-
-  .slider:before {
-    position: absolute;
-    content: "";
-    height: 20px;
-    width: 20px;
-    left: 3px;
-    bottom: 3px;
-    background-color: rgb(9, 9, 9);
-    transition: 0.4s;
-    border-radius: 50%;
-    border-color: #0e0e0e;
-  }
-
-  input:checked + .slider {
-    background-color: #4caf50;
-  } 
-
-  input:checked + .slider:before {
-    transform: translateX(24px);
-  }  */
-
       html,
+
+
       body {
         margin: 0;
         padding: 0;
@@ -115,7 +60,7 @@
         width: 80%;
         padding: 40px 0;
         margin: 0 auto; 
-        background: #eda2a2;
+        background: #ffffff;
       }
 
       .about-title {
@@ -573,15 +518,6 @@
     </nav>
 </header>
 
-<!-- <body class="light-theme">
-
-<h6>Toggle</h6> -->
-<!-- <p>Click the toggle to switch between light and dark themes.</p> -->
-
-<!-- <label class="toggle">
-  <input type="checkbox" id="theme-toggle">
-  <span class="slider"></span>
-</label> -->
 
     <!-- About Us Section -->
     <section class="about-section">
@@ -855,19 +791,6 @@ <h2>Subscription Successful!</h2>
   <script src="preloader.js"></script>
 
   <script>
-
-
-
-  // // JavaScript for Theme Toggle
-  // const toggleSwitch = document.getElementById('theme-toggle');
-  // const body = document.body;
-
-  // // Toggle theme when checkbox state changes
-  // toggleSwitch.addEventListener('change', () => {
-  //   body.classList.toggle('dark-theme', toggleSwitch.checked);
-  //   body.classList.toggle('light-theme', !toggleSwitch.checked);
-  // });
-
     document.getElementById("cart-icon").addEventListener("click", function() {
     window.location.href = "cart.html";
 });

diff --git a/index.html b/index.html
@@ -15,49 +15,6 @@
 
 </head>
 
-<body>
-    <label>
-        <div class="mode">
-          Toggle:             
-          <!-- <button class="change">OFF</button> -->
-          <button class="change">OFF</button>
-        </div>
-        </label>
-</body>
-<script src=
-  "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js">
-      </script>
-      <script>
-      $( ".change" ).on("click", function() {
-          if( $( "body" ).hasClass( "dark" )) {
-              $( "body" ).removeClass( "dark" );
-              $( ".change" ).text( "OFF" );
-          } else {
-              $( "body" ).addClass( "dark" );
-              $( ".change" ).text( "ON" );
-          }
-      });
-  </script>
-<style>
-    .mode {
-            float:right;
-            position: absolute;
-            top: 100px;
-        }
-        .change {
-            cursor: pointer;
-            border: 1px solid #555; 
-             border-radius: 40%;
-
-            text-align: center;
-            padding: 5px; 
-             margin-left: 8px;
-        }
-        .dark{
-            background-color: #222;
-            color: #e6e6e6;
-        }
-</style>
 <body>
      <!-- preloader -->
   <div id="preloader">
@@ -155,7 +112,7 @@
         position: absolute;
         top: 60px; /* Adjust this to position the search bar just below the icon */
         right: 20px; /* Align with the icon */
-        background-color: rgb(240, 131, 131);
+        background-color: white;
         padding: 10px;
         border-radius: 5px;
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

diff --git a/style.css b/style.css
@@ -135,7 +135,7 @@ html {
 .logo {
   width: 12%;
   height: 70px;
-  background-color: rgb(249, 249, 141);
+  /* background-color: yellow; */
   display: flex;
   justify-content: center;
   align-items: center;
@@ -169,18 +169,6 @@ html {
 .border > a:hover {
   color: white !important;
 }
-.toggle {
-  position: relative;
-  display: inline-block;
-  width: 50px;
-  height: 26px;
-}
-
-.toggle input {
-  opacity: 0;
-  width: 0;
-  height: 0;
-}
 
 .navigation {
   width: 45%;