Merge pull request ayush-that#2979 from ritiksingh-01/fix/dark-mode-t…

…oggle-trend Fix Dark Mode Toggle Issue on Trend Page
dipak2005 · Nov 7, 2024 · 50a7039 · 50a7039
2 parents 790fea1 + 58fe93b
commit 50a7039
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 21 deletions.
diff --git a/assets/css/trends.css b/assets/css/trends.css
@@ -1,8 +1,8 @@
 
 
 :root {
-  --bg-color-dark:white; /* Example dark color */
-  --text-color-dark: black; /* Example text color */
+  /* --bg-color-dark:white;  */
+  /* --text-color-dark: black;  */
 }
 
 

diff --git a/index.html b/index.html
@@ -54,13 +54,13 @@
   <link rel="stylesheet" href="./assets/css/font-awesome.min.css" />
   <link rel="stylesheet" href="./assets/css/bootstrap.min.css" />
   <link rel="stylesheet" href="./assets/css/default.css" />
-  <link rel="stylesheet" href="./assets/css/index.css">
   <link rel="stylesheet" href="./assets/css/style.css" />
   <link rel="stylesheet" href="./assets/css/quiz.css" />
   <link rel="stylesheet" href="./assets/css/popup.css" />
   <link rel="stylesheet" href="./assets/css/cookiepopup.css">
   <link rel="stylesheet" href="./assets\css\preloader.css" />
   <link rel="stylesheet" href="./assets/css/faq.css">
+  <link rel="stylesheet" href="./assets/css/index.css">
   <link rel="stylesheet" type="text/css" href="sipcalculatorCss.css">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" />
   <script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.7.13/lottie.min.js"></script>
@@ -2871,7 +2871,7 @@ <h2 class="subscribe-title">
             <div class="col-lg-6">
               <div class="subscribe-form mt-50">
                 <form id="unique-subscribe-form">
-                  <input type="email" id="unique-news-email" placeholder="Enter Email" required />
+                  <input type="email" id="unique-news-email" placeholder="Enter Email" required/>
                   <button class="unique-main-btn" id="unique-subscribe-btn" type="submit">Subscribe</button>
                 </form>
                 <div id="unique-message" class="unique-popup-message" style="display: none;">

diff --git a/trends.html b/trends.html
@@ -218,7 +218,7 @@
         if (currentTheme === 'dark') {
           body.classList.add('dark-mode');
           toggleButton.classList.add('dark');
-          toggleButton.querySelector('span').textContent = '🌙';
+          toggleButton.querySelector('span').textContent = '🌞';
         }
 
         toggleButton.addEventListener('click', function () {
@@ -227,10 +227,10 @@
 
           // Update button icon based on mode
           if (body.classList.contains('dark-mode')) {
-            toggleButton.querySelector('span').textContent = '🌞';  // Light mode icon
+            toggleButton.querySelector('span').textContent = '🌙';  // Light mode icon
             localStorage.setItem('theme', 'dark');
           } else {
-            toggleButton.querySelector('span').textContent = '🌙';  // Dark mode icon
+            toggleButton.querySelector('span').textContent = '🌞';  // Dark mode icon
             localStorage.setItem('theme', 'light');
           }
           loadShow();
@@ -270,28 +270,23 @@
                   font-size: 1.2rem;
                 }
 
-                body.dark-mode {
-                  background-color: #fefefe;
+                /* body.dark-mode {
+                  background-color: #000000;
                   color: #f1f1f1;
-                  /* Change text color to light for dark mode */
                 }
 
                 .dark-mode .para {
                   color: white;
-                  /* Change text color to white when dark mode class is applied */
                 }
 
                 .toggle-button.dark {
-                  background-color: #f1f1f1;
-                  /* Button background in dark mode */
+                  background-color: #000000;
                   color: #333;
-                  /* Button text color in dark mode */
                 }
 
                 .toggle-button.dark:hover {
-                  background-color: #ddd;
-                  /* Button hover color in dark mode */
-                }
+                  background-color: #000000;
+                } */
               </style>
 
             </nav>
@@ -399,7 +394,7 @@
 
     body {
       font-family: 'Space Grotesk', 'Arial', sans-serif;
-      background-color: var(--bg-dark);
+      /* background-color: var(--bg-dark); */
       color: var(--text-primary);
       line-height: 1.6;
       overflow-x: hidden;
@@ -410,9 +405,9 @@
       display: flex;
       flex-direction: column;
       padding: 2rem;
-      background:
-        radial-gradient(circle at top left, rgba(0, 255, 255, 0.1) 0%, transparent 50%),
-        radial-gradient(circle at bottom right, rgba(255, 107, 255, 0.1) 0%, transparent 50%);
+      background: #fff;
+        /* radial-gradient(circle at top left, rgba(0, 255, 255, 0.1) 0%, transparent 50%),
+        radial-gradient(circle at bottom right, rgba(255, 107, 255, 0.1) 0%, transparent 50%); */
     }
 
     .market-status-heading-unique {