Merge pull request #31873 from overleaf/mj-editor-dark-input

[web] Convert input fields to dark mode in editor

GitOrigin-RevId: 420e280d5e92f70f2d44798983cdb636f3efc659

services/web/frontend/js/features/pdf-preview/components/pdf-zoom-dropdown.tsx

@@ -90,6 +90,7 @@ function PdfZoomDropdown({
             <FormControl
               onFocus={event => event.target.select()}
               value={customZoomValue}
+              type="text"
               onKeyDown={event => {
                 if (event.key === 'Enter') {
                   const zoom = Number(customZoomValue.replace('%', '')) / 100

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

@@ -121,9 +121,7 @@
   .ide-redesign-main,
   .project-ds-nav-page {
     @include form-check-dark;
-  }
 
-  .project-ds-nav-page {
     .form-control,
     .form-control-wrapper {
       @include dark-input;
@@ -467,7 +465,8 @@ input[type='range'] {
   }
 }
 
-input.form-control[type='text'] {
+input.form-control[type='text'],
+input.form-control[type='search'] {
   color: var(--input-field-color);
   background-color: var(--input-field-bg);
   border-color: var(--input-field-border-color);
@@ -476,6 +475,13 @@ input.form-control[type='text'] {
     color: var(--input-placeholder-content);
   }
 
+  &[disabled],
+  &:disabled {
+    &::placeholder {
+      color: var(--input-field-content-disabled);
+    }
+  }
+
   &:focus,
   &:focus-visible {
     color: var(--input-field-color);