zschock998
Goto Top

Schriftfarbe im Formular zur Kundenneuanmeldung anpassen

Hallo, ich habe nun schon in den verschiedenen CSS gesucht. Auf der Webseite stellt sich folgender Code dar:

<h2>Anmelden</h2>
<form class="woocommerce-form woocommerce-form-login login" method="post">		  
<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">  
<label for="username">Benutzername oder E-Mail-Adresse&nbsp;<span class="required">*</span></label>  
<input type="text" class="woocommerce-Input woocommerce-Input--text input-text" name="username" id="username" autocomplete="username" value="" />	</p>  
<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">  
<label for="password">Passwort&nbsp;<span class="required">*</span></label>  
<input class="woocommerce-Input woocommerce-Input--text input-text" type="password" name="password" id="password" autocomplete="current-password" /></p>  

Problem:

Das Formular für die Neukundenanmeldung wird im Dark Modus ausgeführt und das Textfeld ist dabei weiß. Der Text, der eingegeben werden soll ist allerdings auch als weiß definiert. Dadurch kann der Benutzer leider seine Eingabe nicht sehen.

Lösungsversuche:

Ich habe versucht, ein separates CSS zu schreiben und zu integrieren, was leider keine Veränderung gebracht hat. Könnte sich das eventuell mal jemand ansehen (sportbrennstoff.com)?

Danke

Content-ID: 42261017860

Url: https://administrator.de/forum/schriftfarbe-im-formular-zur-kundenneuanmeldung-anpassen-42261017860.html

Ausgedruckt am: 22.12.2024 um 17:12 Uhr

MirkoKR
MirkoKR 05.04.2024 aktualisiert um 15:59:29 Uhr
Goto Top
Hi.

schon mal in einem Browser (Chrome, Edge, Firefox) die Developer Tools probiert?

Eine Registerkarte zeigt dabei, wo die effektiven CSS-Formatierung herkommen, bzw. welche wodurch überschrieben wurden ...
zschock998
zschock998 05.04.2024 um 16:00:43 Uhr
Goto Top
Hallo, ja, habe ich probiert und daher kommt auch der Code. Vielleicht einen Tip? Danke
12168552861
Lösung 12168552861 05.04.2024 aktualisiert um 16:20:24 Uhr
Goto Top
input.input-text {
    color:black !important;
}

An deiner Stelle solltest du dir aber mal das hier ansehen, denn man sollte dem User besser die Wahl lassen und anhand seiner Präferenz die Seite darstellen mittels CSS Media Query
https://kulturbanause.de/blog/dark-mode-und-farbschema-mit-css-abfragen- ...
@media (prefers-color-scheme: no-preference) {
  /* CSS Code wenn vom User keine Wahl getroffen wurde */ 
}
@media (prefers-color-scheme: dark) {
  /* CSS Code wenn Dark Mode aktiv */ 
}
@media (prefers-color-scheme: light) {
  /* CSS Code wenn Light Mode aktiv */ 
}

Gruß
zschock998
zschock998 05.04.2024 um 16:31:03 Uhr
Goto Top
Danke @12168552861. Der Eintrag in das CSS ist leider auch ohne Funktion. Keine Änderung. Im separaten Newsletteranmeldung Textfeld funktioniert das einwandfrei. Nur eben leider bei der Neukundenanmeldung nicht.
12168552861
12168552861 05.04.2024 aktualisiert um 16:41:18 Uhr
Goto Top
Zitat von @zschock998:

Danke @12168552861. Der Eintrag in das CSS ist leider auch ohne Funktion. Keine Änderung. Im separaten Newsletteranmeldung Textfeld funktioniert das einwandfrei. Nur eben leider bei der Neukundenanmeldung nicht.

Doch klappt hier einwandfrei ... Hast du es an der falschen Stelle eingetragen.

screenshot

Works as designed.
MirkoKR
MirkoKR 05.04.2024 aktualisiert um 16:45:52 Uhr
Goto Top
... ich spreche nicht vom Quellcode, sondern von "Computed" - hier grün umranded;

1000007224

Nachtrag: Bild von angezeigter Developer-Doku - bin unterwegs und kann dir das deshalb nicht amhand deiner Website darstellen (keine Dev Tools zur (hand)
12168552861
12168552861 05.04.2024 aktualisiert um 16:43:47 Uhr
Goto Top
Btw. riecht doch bisschen nach verkappter Schleichwerbung am Freitag, erster Beitrag hier und gleich Link zu eigener Seite ....
zschock998
zschock998 05.04.2024 aktualisiert um 17:52:32 Uhr
Goto Top
@12168552861 nee, ich bin wirklich ein wenig verzweifelt. Damit das funktioniert, müsste ich ja ein .css anpassen und ich finde leider nicht den richtigen Eintrag. Aber vielen Dank. Ich will Euch nicht auf die Nerven gehen.

Ich habe das übrigens im Debugger entsprechend eingetragen wie vorgeschlagen. Dort klappt das auch. Wenn ich es aber in der .css genau so eintrage, ändert sich nix. face-sad
zschock998
zschock998 05.04.2024 um 17:22:17 Uhr
Goto Top
@MirkoKR Danke
cykes
cykes 06.04.2024 um 08:29:01 Uhr
Goto Top
Moin,

bin zwar kein Web-Entwickler, habe es aber gerade mal mit jeweils aktuellem Edge, Chrome und Firefox auf Deiner Seite getestet (alle fest in den Dark Mode versetzt) und es funktioniert einwandfrei, Schrift ist schwarz und folglich lesbar.

Vielleicht mal Deinen Browser-Cache/Cookies löschen bzw. anderen Browser testen.

Gruß

cykes
StefanKittel
StefanKittel 07.04.2024 um 13:14:40 Uhr
Goto Top
Moin,
nur kurz am Rande wenn Du denkst dass Du zu blöd bist.
Sowohl CSS als auch JS im Browser sind der letzte Dreck. Über 20 Jahre kaputtgefummelt, unübersichtlich und unlogisch.

Ich warte auf den Tag wo Google für seine nächste Chrome-Version HTML-X² rausbringt und einmal (HTML, JS und CSS) neu macht.

Stefan
12168552861
12168552861 07.04.2024 aktualisiert um 14:27:47 Uhr
Goto Top
Er hat's ja jetzt offensichtlich gefunden 🤪. Bleibt nur noch der Haken hinter das Voodoo Commerce Dingens und ab dafür.
zschock998
zschock998 07.04.2024 um 17:51:44 Uhr
Goto Top
Danke an Alle. Problem gelöst.