Merge pull request #35033 from overleaf/mj-drop-dark-mode-components-opt-in

[web] Remove explicit dark mode component opt-in

GitOrigin-RevId: b28603a9989bd046039c247ee2cf9f740c9feac0

services/web/frontend/stylesheets/components/button.scss

@@ -94,11 +94,8 @@
   }
 
   @include theme('default') {
-    .ide-redesign-main,
-    .project-ds-nav-page {
-      .btn {
-        @include dark-buttons;
-      }
+    .btn {
+      @include dark-buttons;
     }
   }
 }

services/web/frontend/stylesheets/components/dropdown-menu.scss

@@ -37,14 +37,7 @@
 }
 
 @include theme('default') {
-  .ide-redesign-main,
-  .project-ds-nav-page,
-  // Codemirror tooltips are rendered outside of the main app container
-  .cm-tooltip .dropdown-menu,
-  .cm-tooltip .dropdown,
-  .cm-tooltip .editor-floating-menu {
-    @include dark-dropdown-menu;
-  }
+  @include dark-dropdown-menu;
 }
 
 $dropdown-item-min-height: 36px;

services/web/frontend/stylesheets/components/footer.scss

@@ -68,16 +68,14 @@ $footer-width-delta: 320px;
   }
 
   @include theme('default') {
-    .ide-redesign-main,
-    .project-ds-nav-page {
-      .cookie-banner {
-        @include cookie-banner-dark;
-      }
+    .cookie-banner {
+      @include cookie-banner-dark;
+    }
 
-      .fat-footer {
-        @include footer-dark;
-        @include socials-dark;
-      }
+    .website-redesign-fat-footer,
+    .website-redesign .fat-footer {
+      @include footer-dark;
+      @include socials-dark;
     }
   }
 }

services/web/frontend/stylesheets/components/form.scss

@@ -118,14 +118,11 @@
 }
 
 @include theme('default') {
-  .ide-redesign-main,
-  .project-ds-nav-page {
-    @include form-check-dark;
+  @include form-check-dark;
 
-    .form-control,
-    .form-control-wrapper {
-      @include dark-input;
-    }
+  .form-control,
+  .form-control-wrapper {
+    @include dark-input;
   }
 }
 

services/web/frontend/stylesheets/components/modal.scss

@@ -2,13 +2,22 @@
   --bs-heading-color: var(--content-primary);
 }
 
-.modal {
-  // Until we add a dark modal version, all core components in modals should use light theme
-  @include light-dropdown-menu;
-  @include form-check-light;
-  @include light-notification;
-  @include light-input;
-  @include light-buttons;
+@include theme('default') {
+  .modal {
+    // Until we add a dark modal version, all core components in modals should use light theme
+    @include light-dropdown-menu;
+    @include light-notification;
+    @include form-check-light;
+
+    .form-control,
+    .form-control-wrapper {
+      @include light-input;
+    }
+
+    .btn {
+      @include light-buttons;
+    }
+  }
 }
 
 @include media-breakpoint-up(sm) {

services/web/frontend/stylesheets/components/notifications.scss

@@ -53,17 +53,17 @@
 
   @include light-notification;
 
-  // Until we roll out dark mode notifications, make sure we show buttons in
-  // light mode even when the rest of the page is in dark mode
-  .ide-redesign-main .notification .btn {
-    @include light-buttons;
-  }
-
   @include theme('default') {
     --notification-ai-paywall-background: var(--bg-dark-secondary);
     --notification-ai-paywall-color: var(--content-primary-dark);
     --notification-ai-paywall-border-color: var(--blue-30);
 
+    // Until we roll out dark mode notifications, make sure we show buttons in
+    // light mode even when the rest of the page is in dark mode
+    .notification .btn {
+      @include light-buttons;
+    }
+
     .project-ds-nav-page {
       .notification {
         @include dark-notification;