Mörk scrollbar m.fl i Dark Mode

Permalänk
Ljusskygg

Mörk scrollbar m.fl i Dark Mode

Hej!

Jag försöker fortfarande vänja mig vid de starkare / vitare färgerna på text osv i det nya officiella Mörka läget, men en sak som sticker ut mycket är att scrollbaren är vit, då webbläsaren inte vet om att sidan ska vara mörk

En enkel fix för detta är en <meta> tag under <head>

Inte bara blir scrollbaren mörk, men även checkrutor m.fl. (Testat bl.a i Microsoft Edge)

Exempelvis:

<meta content="dark" name="color-scheme">

<meta content="light" name="color-scheme">

Kan även kompletteras i CSS, men bör helst göras i båda

Docs:

Visa signatur
Permalänk

Min scrollbar är mörkgrå utan trixande. Både hemma på firefox och i telefonen.

Vadå ljus text? Den är ju grå... Mörkare vill man ju inte ha den för då kommer den ju knappt synas...

Tycker den är rätt lagom bra kontrast mot bakgrunden men inte skrikvit.

Visa signatur

ASUS B550-f-Gaming, R9 5800X3D, HyperX 3200Mhz cl16 128Gb ram, rtx 3070ti.
[Lista] De bästa gratisprogrammen för Windows
[Diskussion] De bästa gratisprogrammen för Windows

Permalänk
Medlem
Skrivet av Rouge of Darkness:

Min scrollbar är mörkgrå utan trixande. Både hemma på firefox och i telefonen.

Vadå ljus text? Den är ju grå... Mörkare vill man ju inte ha den för då kommer den ju knappt synas...

Tycker den är rätt lagom bra kontrast mot bakgrunden men inte skrikvit.

Skillnaden är detta (i Edge):
Med fix i TS

Normalt:

Visa signatur

NZXT H510 Flow MSI B450 Tomahawk MAX
AMD Ryzen 5800X3D RX 7900XTX Kingston Fury 64GB

Permalänk
Skrivet av Pamudas:

Skillnaden är detta (i Edge):
Med fix i TS
<Uppladdad bildlänk>

Normalt:
<Uppladdad bildlänk>

Den jag har ser inte ut som någon av dem... Men kanske är en chromium grej.

Visa signatur

ASUS B550-f-Gaming, R9 5800X3D, HyperX 3200Mhz cl16 128Gb ram, rtx 3070ti.
[Lista] De bästa gratisprogrammen för Windows
[Diskussion] De bästa gratisprogrammen för Windows

Permalänk
Medlem
Skrivet av Rouge of Darkness:

Min scrollbar är mörkgrå utan trixande. Både hemma på firefox och i telefonen.

Den blir det i Firefox, men inte i Chrome eller Edge om jag testar på datorn. Sedan kan man ju ha en del synpunkter på att listen inte verkar bli mörk trots att man byter inställning i själva Chrome (eller Windows). Känns ju lite som ett Google-problem...

Permalänk
Ljusskygg
Skrivet av Rouge of Darkness:

Vadå ljus text? Den är ju grå... Mörkare vill man ju inte ha den för då kommer den ju knappt synas...

Tycker den är rätt lagom bra kontrast mot bakgrunden men inte skrikvit.

Headern till exempelvis "Nytt i forumet", den är ju kritvit, så vit det bara går, annars så är färgerna rätt bra

Och gällande scrollbaren så är det som Pamudas visade, den är vit utan fixen, Chromium

Visa signatur
Permalänk
Medlem

Att ändra titelraden som är helvit kan ju vara en idé, och att ändra meta-taggen. Men tycker inte om när när hemsidor ändrar scrollbaren med css.

@jreklund kan säkert lösa det.

Eller byta till Firefox

Visa signatur

7600X,Tomahawk B650,NH-U12A,32GB,RX6700,Black SN850 1TB,860Evo 1TB,RM850x, 27GL850,Torrent Compact

Permalänk
Ljusskygg
Skrivet av Lagers:

Men tycker inte om när när hemsidor ändrar scrollbaren med css.

Jag gjorde det i SweClockers-Dark innan det var ett alternativ att få det inbyggt, nu när webbläsaren stödjer mörk scrollbar så håller jag med att hålla till det

Visa signatur
Permalänk
Geeks
Jobbar med data

Hej! Det var en inställning jag inte visste existerade. Att lägga till en meta-tagg kommer dock inte fylla någon funktion då servern inte vet vad du som användare vill ha, så blir att bara ändra via CSS i detta fall.

Permalänk
Medlem
Skrivet av jreklund:

Att lägga till en meta-tagg kommer dock inte fylla någon funktion då servern inte vet vad du som användare vill ha, så blir att bara ändra via CSS i detta fall.

Servern vet väl ändå vad användaren hade vid senaste sidvisningen, lagrat i användarens profil eller i en kaka eller var ni nu sparar informationen?

Visa signatur

Mostly Harmless

Permalänk
Geeks
Jobbar med data
Skrivet av Mayhem SWE:

Servern vet väl ändå vad användaren hade vid senaste sidvisningen, lagrat i användarens profil eller i en kaka eller var ni nu sparar informationen?

Ditt val sparas i local storage för att alla besökare (inloggad som gäst) ska få sitt alternativ sparat. Denna information skickas inte vidare till servern, så vi vet inte vem eller hur många som använder ett specifikt tema.

EDIT: Vi kan därmed inte inkludera informationen vid server rendering utan den läggs till i efterhand via CSS eller JavaScript.

Permalänk
Ljusskygg
Skrivet av jreklund:

Hej! Det var en inställning jag inte visste existerade. Att lägga till en meta-tagg kommer dock inte fylla någon funktion då servern inte vet vad du som användare vill ha, så blir att bara ändra via CSS i detta fall.

Absolut, det funkar lika väl att lägga in exempelvis color-scheme: dark i :root för det mörka temat och/eller .dark

Går även lägga overrides på specifika ställen om det inte passar in överallt

Visa signatur
Permalänk
Geeks
Jobbar med data

I samband med dagens release har jag lagt till color-schema för det mörka temat.

Permalänk
Ljusskygg
Skrivet av jreklund:

I samband med dagens release har jag lagt till color-schema för det mörka temat.

Det blev riktigt bra, tack!

Visa signatur