suchen

Heim  >  Fragen und Antworten  >  Hauptteil

Autofill-Eingabe im Dunkelmodus mit Tailwind

<p>Nachdem ich den Dunkelmodus zum Ausfüllen gespeicherter Passwörter verwendet hatte, stieß ich auf ein Problem mit hässlichen Eingabefarben. Im Lichtmodus ist es gelb, was nicht schlecht ist. </p> <p>Ich habe hier einige Antworten mit <code>webkit-autofill</code> gefunden, aber ich habe Probleme mit tailwind <code>dark: </code> Ich habe Probleme, es in der Codedatei in sass zu implementieren. </p>
P粉745412116P粉745412116484 Tage vor588

Antworte allen(1)Ich werde antworten

  • P粉998100648

    P粉9981006482023-08-29 00:49:23

    解决方案是将其添加到 global.scss 文件中:

    @layer components {
      .inputDarkModeOverride {
        &:-webkit-autofill {
          box-shadow: 0 0 0 30px #1c1c1d inset;
        }
    
        &:-webkit-autofill:hover {
          box-shadow: 0 0 0 30px #1c1c1d inset;
        }
    
        &:-webkit-autofill:focus {
          box-shadow: 0 0 0 30px #1c1c1d inset;
        }
    
        &:-webkit-autofill:active {
          box-shadow: 0 0 0 30px #1c1c1d inset;
        }
      }
    }

    然后在输入属性中添加className={`${styles.input} dark:inputDarkModeOverride`}

    Antwort
    0
  • StornierenAntwort