zschock998
Apr 05, 2024
view1327
view13
0
Goto Top

Schriftfarbe im Formular zur Kundenneuanmeldung anpassen

GermansolvedQuestionCSS
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
comment-contentCommentShareShare
Share on Facebook Share on Twitter Share on Reddit Share on Linkedin

Content-Key: 42261017860

Url: https://administrator.de/contentid/42261017860

Printed on: May 1, 2024 at 08:05 o'clock

13 Comments
Latest comment
Goto Top
Member: MirkoKR
MirkoKR Apr 05, 2024 updated at 13:59:29 (UTC)
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 ...
heart1
Member: zschock998
zschock998 Apr 05, 2024 at 14:00:43 (UTC)
Goto Top
Hallo, ja, habe ich probiert und daher kommt auch der Code. Vielleicht einen Tip? Danke
Mitglied: 12168552861
Solution 12168552861 Apr 05, 2024 updated at 14:20:24 (UTC)
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ß
heart1
Member: zschock998
zschock998 Apr 05, 2024 at 14:31:03 (UTC)
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.
Mitglied: 12168552861
12168552861 Apr 05, 2024 updated at 14:41:18 (UTC)
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.
Member: MirkoKR
MirkoKR Apr 05, 2024 updated at 14:45:52 (UTC)
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)
Mitglied: 12168552861
12168552861 Apr 05, 2024 updated at 14:43:47 (UTC)
Goto Top
Btw. riecht doch bisschen nach verkappter Schleichwerbung am Freitag, erster Beitrag hier und gleich Link zu eigener Seite ....
Member: zschock998
zschock998 Apr 05, 2024 updated at 15:52:32 (UTC)
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
Member: zschock998
zschock998 Apr 05, 2024 at 15:22:17 (UTC)
Goto Top
@MirkoKR Danke
Member: cykes
cykes Apr 06, 2024 at 06:29:01 (UTC)
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
heart1
Member: StefanKittel
StefanKittel Apr 07, 2024 at 11:14:40 (UTC)
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
heart1
Mitglied: 12168552861
12168552861 Apr 07, 2024 updated at 12:27:47 (UTC)
Goto Top
Er hat's ja jetzt offensichtlich gefunden 🤪. Bleibt nur noch der Haken hinter das Voodoo Commerce Dingens und ab dafür.
heart1
Member: zschock998
zschock998 Apr 07, 2024 at 15:51:44 (UTC)
Goto Top
Danke an Alle. Problem gelöst.
GermansolvedQuestionCSS
Hotly discussed
DaniEnd of availability for classic Teams clientDani - 2 CommentsFrankUbuntu 24.04 LTS Noble Numbat availableFrankadmtechDeveloper diary: Release 6.1admtech