Feature Tweakers.net Nachtmodus.

[sypie]

Ik heb alles verwijderd wat je zei. Mijn aangepaste code laat dit zien:

code:

/*** Fix abbr tags on mobile ***/
abbr[title]:after {
    content: " (" attr(title) ")";
}
@media screen and (min-width: 1025px) {
    abbr[title]
    {
        cursor:help;
    }

    abbr[title]:after
    {
        content: "";
    }
}


/*******
 General
 ********/

Daar tussenin stond de nieuwe header-code.

Ik gooi de schermafbeelding van de quotes ook even online:

[Hero of Time]

Die had ik vanzelf gevonden, aangezien het een van de !important zaken is. Blijkbaar heb ik niet de selector specifiek genoeg opgegeven.

[sypie]

Ow, en "goede antwoord-posts" zijn ook onleesbaar:

[ikvanwinsum]

Ik ben ook even bezig geweest. De custom css van @Hero of Time maakt de boel wel donkerder, maar past nog een boel meer aan.

Ik heb dus geprobeerd een 'nachtmodus' te creeren die waar mogelijk alleen kleuren aanpast. Zo ziet 't er tot nu toe uit: (eerste opzetje)

[Hero of Time]

sypie schreef op woensdag 21 maart 2018 @ 20:35:
Ow, en "goede antwoord-posts" zijn ook onleesbaar:

[afbeelding]

Nogmaals, dat zijn zaken die komen door het ontbreken van de vele !important statements. Pak dan revisie 1.

ikvanwinsum schreef op woensdag 21 maart 2018 @ 21:09:
Ik ben ook even bezig geweest. De custom css van @Hero of Time maakt de boel wel donkerder, maar past nog een boel meer aan.

Ik heb dus geprobeerd een 'nachtmodus' te creeren die waar mogelijk alleen kleuren aanpast. Zo ziet 't er tot nu toe uit: (eerste opzetje)
[afbeelding]

Ik moet dat eigenlijk ook splitsen: alleen kleur zaken en de 'nice to have' dingen zoals Henk als logo e.d. Dat maakt het voor jou en anderen die mijn code willen gebruiken voor puur de kleuren makkelijker om over te nemen.

[ Voor 5% gewijzigd door Hero of Time op 05-06-2018 08:02 . Reden: repo bestaat niet meer. ]

[90710]

ikvanwinsum schreef op woensdag 21 maart 2018 @ 21:09:
Ik ben ook even bezig geweest. De custom css van @Hero of Time maakt de boel wel donkerder, maar past nog een boel meer aan.

Ik heb dus geprobeerd een 'nachtmodus' te creeren die waar mogelijk alleen kleuren aanpast. Zo ziet 't er tot nu toe uit: (eerste opzetje)
[afbeelding]

Dat lijkt meer op wat ik aan het maken ben

[Anonymoussaurus]

Is er over deze feature al wat meer bekend? Heel leuk hoor, al die custom CSS'jes en uitwisselingen, maar hoe zit het met de development voor alle gebruikers en desnoods leden? Is hier überhaupt al een keer op gereageerd door iemand van Tweakers zelf?

[ Voor 3% gewijzigd door Anonymoussaurus op 27-03-2018 14:57 ]

[crisp]

Anonymoussaurus schreef op dinsdag 27 maart 2018 @ 14:55:
Is er over deze feature al wat meer bekend? Heel leuk hoor, al die custom CSS'jes, maar hoe zit het met de development voor alle gebruikers en desnoods leden? Is hier überhaupt al een keer op gereageerd door iemand van Tweakers zelf?

iig door mij al eens: crisp in "Feature Tweakers.net Nachtmodus."

Ik vind nog steeds dat dit een browser-feature (al dan niet in de vorm van een extensie) moet zijn. Er zijn dan ook al browserfeatures en extensies die dit in meer of mindere mate realiseren zoals bijvoorbeeld de reader mode in Firefox en diverse dark/night mode extensies voor verschillende browsers.

[Anonymoussaurus]

crisp schreef op dinsdag 27 maart 2018 @ 15:00:
iig door mij al eens: crisp in "Feature Tweakers.net Nachtmodus."

Ik vind nog steeds dat dit een browser-feature (al dan niet in de vorm van een extensie) moet zijn. Er zijn dan ook al browserfeatures en extensies die dit in meer of mindere mate realiseren zoals bijvoorbeeld de reader mode in Firefox en diverse dark/night mode extensies voor verschillende browsers.

Dat is het probleem dus. Op telefoons heb je geen extensies, en al helemaal niet bij Chrome op Android. Dan is het dus: of Tweakers.net werkt aan een nachtmodus, of er komt een extensie. Dat is juist het probleem; beiden is geen optie.

[LankHoar]

crisp schreef op dinsdag 27 maart 2018 @ 15:00:
[...]

iig door mij al eens: crisp in "Feature Tweakers.net Nachtmodus."

Ik vind nog steeds dat dit een browser-feature (al dan niet in de vorm van een extensie) moet zijn. Er zijn dan ook al browserfeatures en extensies die dit in meer of mindere mate realiseren zoals bijvoorbeeld de reader mode in Firefox en diverse dark/night mode extensies voor verschillende browsers.

Uit de 161 upvotes en de lange discussies over CSS en extensies blijkt dat dit tot noch toe niet goed gerealiseerd kan worden door meerdere Tweakers. Ook op de frontpage bij .plans komt dit topic steeds vaker naar boven. Kan het dev team dit niet eens aan een (XL) communitypick toevoegen?

[crisp]

LankHoar schreef op dinsdag 27 maart 2018 @ 15:07:
[...]


Uit de 161 upvotes en de lange discussies over CSS en extensies blijkt dat dit tot noch toe niet goed gerealiseerd kan worden door meerdere Tweakers. Ook op de frontpage bij .plans komt dit topic steeds vaker naar boven. Kan het dev team dit niet eens aan een (XL) communitypick toevoegen?

Er is een reden dat het meerdere Tweakers niet goed lukt: het is namelijk niet simpel, ook voor ons zelf niet En daarbij is het bijzonder onderhoudsgevoelig, en dus een nogal 'dure' feature die behoorlijk in de weg kan gaan zitten bij het verder ontwikkelen van de site.

Als we iets dergelijks als een night-mode zouden overwegen dan denk ik dat dat een heel uitgeklede versie zal zijn, bijvoorbeeld alleen voor artikelen met een los knopje om te activeren. Maar dan zijn we feitelijk al functionaliteit aan het bouwen die sommige browsers al van zichzelf hebben (geen idee hoe dat op mobile zit, maar dat zal denk ik ook een kwestie van tijd zijn).

[90710]

crisp schreef op dinsdag 27 maart 2018 @ 15:13:
[...]

Er is een reden dat het meerdere Tweakers niet goed lukt: het is namelijk niet simpel, ook voor ons zelf niet En daarbij is het bijzonder onderhoudsgevoelig, en dus een nogal 'dure' feature die behoorlijk in de weg kan gaan zitten bij het verder ontwikkelen van de site.

Opzich valt de moeilijkheidsgraat mee. Alleen is de CSS van Tweakers zelf redelijk willekeurig met het toekennen van klassen en het al dan niet overschrijven van kleuren.

Ik werk bv. als een webdeveloper en in onze grootste applicatie heb ik nog niet zo lang geleden een volledige "pallet swap" nachtmodus geïntroduceerd. Maw. alle kleuren op de site zijn gedefinieerd in één "kleuren.less" bestand als variabelen waarbij de site.less deze standaard overneemt. Ook is er een site_dark.less die de kleuren allemaal overschrijft en dan de site.less importeert.

In de HTML code worden beide css (site.css, site_dark.css) bestanden gepreload waarna via cookies / javascript de juiste wordt getoond. En natuurlijk zit er in de ViewContext (gezien het een ASP.NET applicatie is) welke er op dat moment actief is. In de UI heb ik een schakeling ingebouwd die instantaan de cookie omzet en zo (zonder refresh, etc) de nachtmodus aan / uit kan zetten.

[crisp]

90710 schreef op dinsdag 27 maart 2018 @ 15:36:
[...]


Opzich valt de moeilijkheidsgraat mee. Alleen is de CSS van Tweakers zelf redelijk willekeurig met het toekennen van klassen en het al dan niet overschrijven van kleuren.

[...]

Wij torsen dan ook anderhalf decenium legacy met ons mee, buiten het feit dat onze site gewoon heel groot en uitgebreid is. De hele site even opnieuw opzetten en stylen is simpelweg ondoenlijk. Daarom denk ik ook dat alleen een beperkte night-mode enige kans van slagen zal hebben, al ben ik er dan nog steeds geen voorstander van

[ Voor 5% gewijzigd door crisp op 27-03-2018 15:42 ]

[GieltjE]

crisp schreef op dinsdag 27 maart 2018 @ 15:40:
[...]

Wij torsen dan ook anderhalf decenium legacy met ons mee. De hele site even opnieuw opzetten en stylen is simpelweg ondoenlijk. Daarom denk ik ook dat alleen een beperkte night-mode enige kans van slagen zal hebben, al ben ik er dan nog steeds geen voorstander van

Misschien een url aanleveren/beheren die b.v. in een css include gezet kan worden (of een vinkje bij de custom css)? Dan kunnen verbeteringen gewoon gemeld worden in een topic, zo word iedereen er beter van.

Verwacht niet dat hij perfect is, maar zoveel wit op een site is voor mij persoonlijk een reden om veel apps/sites niet meer te openen zodra het donkerder word buiten (krijgt helaas behoorlijk snel last van mijn ogen).
De NOS app heeft sinds kort een nacht modus, en dat is echt erg prettig (google maps is helaas niet meer forceerbaar sinds een tijd).

[SilentDecode]

Ik heb er een CSS ding inzitten die de achtergrond donker maakt. Daarbij betaal ik Tweakers, zodat ik die stomme reclame tenminste niet zie.

[90710]

Ik heb toch maar eens mijn code op GitHub gezet. Hij is verre van af, maar ik denk dat veel mensen er al baat van kunnen hebben.

In de submap Style vind je gathering_tweakers.css en tweakers_main_page.css dit zijn de twee bestanden die je moet gebruiken icm. Stylish. en ze aan de juiste urls toekennen.

Url: https://github.com/sanderevers84/TweakersNachtModus

Mijn doel is om énkel de kleuren te veranderen en niet om er een hele andere layout van te maken.

@crisp Idd. Legacy code kan een groot probleem geven, en ik weet niet precies hoe groot de Tweakers CSS bibliotheek is (al kan ik me indenken dat die niet klein is). Maar opzich moet het niet al te veel werk zijn om in een CSS bestand alle kleur toekenningen te vinden en die waar nodig te vervangen door variabelen. Want #fff op .puntA .kolomB .regelX is net zo wit als #fff op textarea background-color

[ Voor 49% gewijzigd door 90710 op 27-03-2018 16:16 ]

[Hero of Time]

@sanderev66, kijk eens in de broncode van een willekeurige pagina, daar zie je welke CSS bestanden er allemaal gekoppeld worden. O.a. main.css bevat kleurdefinities en heeft al zo'n 1140 regels code, waarbij de definities op een enkele rij staan (dus "color: #000; background-color: #fff" is een enkele regel).

En zoals ik vorige week al zei, ik ga mijn code een flinke overhaul geven vanaf vrijdag. Ik wil dan alle kleurdefinities netjes in m'n darktweakers.css zetten, alle andere aanpassingen zoals badges weg, henk als logo, zoekbalk in de menubalk, etc. in een apart bestand. Daarna wil ik er een less-achtige situatie van maken waarbij ik bovenaan alle kleuren opgeef als waarde van een variabele, zodat je die met S&R snel kan vervangen voor je eigen doeleinden.

[ikvanwinsum]

90710 schreef op dinsdag 27 maart 2018 @ 16:04:
@crisp Idd. Legacy code kan een groot probleem geven, en ik weet niet precies hoe groot de Tweakers CSS bibliotheek is (al kan ik me indenken dat die niet klein is). Maar opzich moet het niet al te veel werk zijn om in een CSS bestand alle kleur toekenningen te vinden en die waar nodig te vervangen door variabelen. Want #fff op .puntA .kolomB .regelX is net zo wit als #fff op textarea background-color

De kans is groot dat ze al iets als SASS gebruiken, hoor. De vraag is alleen of je de #fff op plaats A dezelfde variabele wil geven als op plaats B, simpelweg omdat het dezelfde kleur is. Soms wel, maar vaak genoeg ook niet.

90710 schreef op dinsdag 27 maart 2018 @ 16:04:
Ik heb toch maar eens mijn code op GitHub gezet. Hij is verre van af, maar ik denk dat veel mensen er al baat van kunnen hebben.

In de submap Style vind je gathering_tweakers.css en tweakers_main_page.css dit zijn de twee bestanden die je moet gebruiken icm. Stylish. en ze aan de juiste urls toekennen.

Url: https://github.com/sanderevers84/TweakersNachtModus

Leuk! Inmiddels zijn er al meerdere Tweakers die hun nachtmodus-css op GitHub hebben gezet. Ik heb ook m'n eigen css, en van @Hero of Time weet ik ook dat hij nachtmodus-css heeft.

Het lijkt mij een goed/leuk idee om een gezamenlijke GitHub-repo te maken voor custom CSS. Op deze manier kan ook de kwaliteit van de CSS omhoog omdat er meer mensen zijn die bugs kunnen pletten. Nog meer animo? Hier kunnen dan eventueel ook andere leuke features zoals een Henk-logo een plekje vinden. Ik dacht aan zoiets.

Ik wil dan eventueel wel voor een soort 'buildserver' zorgen, zodat mensen gemakkelijk de custom CSS kunnen gebruiken.

[90710]

Ik was eerder van plan die van mij later tot een (Chrome-)extensie om te zetten, zodat je nog wat post-processing kan doen op wat instellingen.

[ikvanwinsum]

Zou ook kunnen. Wat voor dingen zou je willen post-processen dan?

[Hero of Time]

@ikvanwinsum, heb je mijn Github repo niet gezien? Ik heb daar ook Henk in verwerkt namelijk, als vervanger voor het Tweakers logo linksboven in de menubalk.

[ikvanwinsum]

Zeker heb ik die gezien, dat bedoelde ik juist ook.
Het was meer als voorbeeld bedoeld, dat je het modulair kunt houden.

[90710]

ikvanwinsum schreef op dinsdag 27 maart 2018 @ 17:49:
Zou ook kunnen. Wat voor dingen zou je willen post-processen dan?

Dat weet ik nog niet precies, maar iig een makkelijke manier om het in en uit te schakelen.

[Zeror]

crisp schreef op dinsdag 27 maart 2018 @ 15:13:
[...]

Er is een reden dat het meerdere Tweakers niet goed lukt: het is namelijk niet simpel, ook voor ons zelf niet En daarbij is het bijzonder onderhoudsgevoelig, en dus een nogal 'dure' feature die behoorlijk in de weg kan gaan zitten bij het verder ontwikkelen van de site.

Zoals ik al eerder in dit topic weleens aangegeven heb: Kan er niet op basis van tijd een extra class aan de body worden toegevoegd? Bijv. body.day en body.night
Of misschien zelfs iets uitgebreider zoals bijv.: body.0uur, body.1uur, body.2uur ...... t/m body.23uur.

Dat moet toch wel met een simpel scriptje te realiseren zijn? Dan kunnen we met Custom CSS zelf een nachtmodus maken.

[ Voor 5% gewijzigd door Zeror op 27-03-2018 22:54 ]

[ikvanwinsum]

Zeror schreef op dinsdag 27 maart 2018 @ 22:52:
[...]

Zoals ik al eerder in dit topic weleens aangegeven heb: Kan er niet op basis van tijd een extra class aan de body worden toegevoegd? Bijv. body.day en body.night
Of misschien zelfs iets uitgebreider zoals bijv.: body.0uur, body.1uur, body.2uur ...... t/m body.23uur.

Dat moet toch wel met een simpel scriptje te realiseren zijn? Dan kunnen we met Custom CSS zelf een nachtmodus maken.

Je kunt met een @include je CSS ook zelf hosten. Dan heb je de mogelijkheid om op een ander tijdstip andere CSS door te geven.

[ikvanwinsum]

Ik ben dus wat aan het knutselen geweest. Ik heb mijn CSS (wat ik tot nu toe heb) op GitHub gezet. De custom CSS is geschreven m.b.v. SASS.

Verder heb ik een servertje opgetuigd die (als het goed is, heb het nog niet uitgebreid kunnen testen) bij een nieuwe commit op de GitHub repo automatisch een pull doet. De website is hier te vinden: https://cssgenerator.anneheijink.com/

Het werkt heel gemakkelijk: je vinkt de opties aan die je wilt gebruiken en kopieert de regel die verschijnt naar je custom CSS. Ik beloof niet dat ik 'm voor eeuwig op deze plek zal laten draaien, maar voor nu staat hij hier prima.

En last but not least: je kunt de nachtmodus-CSS ook alleen laten toepassen wanneer het donker is, gebaseerd op een gewenste locatie!

Ik ben vooral benieuwd wat jullie ervan vinden. En of er mensen zijn die willen helpen betere/beter dekkende/mooiere CSS te schrijven.

[sypie]

Meteen toegepast.

Ziet er netjes uit, hoewel blauwe koppen van mij niet beslist hoeven, lichtgrijs op zwart doet het ook prima.

Wat me wel opvalt: de achtergrond van de site is nog steeds wit, zorgt voor een opvallende witte lijn tussen de linker zijbalk en de news-container.

[ikvanwinsum]

Oh dat is vreemd. Bij mij is het niet zo. Is dit de enige custom CSS die je hebt toegepast? De header is aan de linkerkant ook wat lichter dan de rest (Ik heb 'm namelijk wat donkerder gemaakt.) Welk element is het dat nog een witte achtergrondkleur heeft?

[ Voor 25% gewijzigd door ikvanwinsum op 31-03-2018 12:34 . Reden: header ]

[Hero of Time]

Zo te zien de scrollbalk. En de lichtere header boven de Tracker komt door #fakeTop.

Ik heb mijn aanpassingen net gecommit op GH. Eigenlijk alleen de afsplitsing van tweaks naar een apart bestand. Mensen die mijn code nu overnemen zouden geen aangepaste menubalk meer moeten krijgen. Alleen zit je dus nog wel met het grijze deel waar de zoekbalk in zit.

[ Voor 8% gewijzigd door Hero of Time op 31-03-2018 12:37 ]

[sypie]

ikvanwinsum schreef op zaterdag 31 maart 2018 @ 12:32:
Oh dat is vreemd. Bij mij is het niet zo. Is dit de enige custom CSS die je hebt toegepast? De header is aan de linkerkant ook wat lichter dan de rest (Ik heb 'm namelijk wat donkerder gemaakt.) Welk element is het dat nog een witte achtergrondkleur heeft?

Ik heb al een vermoeden hoe het komt... Ik het met AdBlocker een hele zooi meuk geblokkeerd. Zo heb ik ook geen footer meer met "populaire items", geen Poll meer en ook geen andere randzaken. De frontpage is voor mij alleen maar voor het lezen van nieuws en het kijken welke topics actief zijn. De rest laat ik aan mij voorbijgaan.

[ikvanwinsum]

@sypie Hmm, oke. Zijn het inderdaad de scrollbars? Anders moet je even laten weten welk element er een kleurtje krijgt, dan kan ik het even voor je fixen.

[sypie]

Ik zie 'm nu niet meer. Alleen het witte lijntje net onder de zoekbalk maar die lijkt wel functioneel. Wat mij betreft een prima CSS.

[Playa del C.]

Misschien al ergens genoemd, maar 's nachts in bed gebruik ik een screendimmer app op mijn telefoon.

[Hero of Time]

@Playa del C., dat is al genoemd, maar het neemt niet weg dat er alsnog enorm veel wit/lichte kleuren gebruikt wordt. Zelfs op de laagste helderheid van je mobiel kan het nog te licht zijn om prettig bij te lezen. Dan liever donkere kleuren en de helderheid iets hoger.

[Playa del C.]

Hero of Time schreef op zaterdag 31 maart 2018 @ 14:17:
@Playa del C., dat is al genoemd, maar het neemt niet weg dat er alsnog enorm veel wit/lichte kleuren gebruikt wordt. Zelfs op de laagste helderheid van je mobiel kan het nog te licht zijn om prettig bij te lezen. Dan liever donkere kleuren en de helderheid iets hoger.

De app die ik gebruik, kan ik instellen van 0 tot 100% 'donkerheid'. Dus eigenlijk tot zo donker als zwart. Bevalt mij prima en werkt voor elke site en app. Iedereen mag het zelf weten verder, maar ik zie geen enkel nadeel van een goede screendim-app. Alsnog is een nachtversie van Tweakers natuurlijk ook goed, een extra optie en past wel bij 'tweakers'.

[Hero of Time]

@sypie, hoe is de huidige versie van m'n code? Ik heb de afgelopen paar dagen redelijk wat fixes doorgevoerd. Beste antwoord en eigen replies moet ik nog fixen voor lagere resoluties. Daar kwam ik vandaag achter toen ik op m'n mobiel keek.

[Tralapo]

ikvanwinsum schreef op zaterdag 31 maart 2018 @ 12:01:
Ik ben dus wat aan het knutselen geweest. Ik heb mijn CSS (wat ik tot nu toe heb) op GitHub gezet. De custom CSS is geschreven m.b.v. SASS.

Verder heb ik een servertje opgetuigd die (als het goed is, heb het nog niet uitgebreid kunnen testen) bij een nieuwe commit op de GitHub repo automatisch een pull doet. De website is hier te vinden: https://cssgenerator.anneheijink.com/

Het werkt heel gemakkelijk: je vinkt de opties aan die je wilt gebruiken en kopieert de regel die verschijnt naar je custom CSS. Ik beloof niet dat ik 'm voor eeuwig op deze plek zal laten draaien, maar voor nu staat hij hier prima.

En last but not least: je kunt de nachtmodus-CSS ook alleen laten toepassen wanneer het donker is, gebaseerd op een gewenste locatie!

Ik ben vooral benieuwd wat jullie ervan vinden. En of er mensen zijn die willen helpen betere/beter dekkende/mooiere CSS te schrijven.

Het werkt, mooi gedaan!

Nachtmodus ziet er over het algemeen goed uit, het contrast tussen de donker achtergrond en de felblauwe links doet mij eerlijk gezegd vooral op de homepage wel pijn aan de ogen.

De horizontale scrollbalk onder de drie artikelen met foto's bovenaan de homepage is bij mij op mobiel ook wit. Maar heb eigenlijk geen idee of dat iets is wat je kunt aanpassen met CSS of dat die kleur gewoon van de browser is.

[ Voor 8% gewijzigd door Tralapo op 01-04-2018 23:34 ]

[ikvanwinsum]

Tralapo schreef op zondag 1 april 2018 @ 23:29:
[...]
Nachtmodus ziet er over het algemeen goed uit, het contrast tussen de donker achtergrond en de felblauwe links doet mij eerlijk gezegd vooral op de homepage wel pijn aan de ogen.

Ergens wel he... Ik heb ze nu eerst grijs gemaakt. Van sommige linkjes heb ik het blauw wat lichter gemaakt om ze beter leesbaar te maken. Ik weet alleen niet wat mooier is: blauw of grijs/wit.

Tralapo schreef op zondag 1 april 2018 @ 23:29:
De horizontale scrollbalk onder de drie artikelen met foto's bovenaan de homepage is bij mij op mobiel ook wit. Maar heb eigenlijk geen idee of dat iets is wat je kunt aanpassen met CSS of dat die kleur gewoon van de browser is.

Dat bleek een witte achtergrondkleur te zijn. Is nu ook donker.

[sypie]

Hero of Time schreef op zondag 1 april 2018 @ 23:12:
@sypie, hoe is de huidige versie van m'n code? Ik heb de afgelopen paar dagen redelijk wat fixes doorgevoerd. Beste antwoord en eigen replies moet ik nog fixen voor lagere resoluties. Daar kwam ik vandaag achter toen ik op m'n mobiel keek.

Wat nog een punt van aandacht is: in de reacties onder nieuwsitems, die nog niet gemod zijn of die ingeklapt zijn, is de auteur zwart. Dit is op de donkere achtergrond niet te lezen.

[Tralapo]

ikvanwinsum schreef op maandag 2 april 2018 @ 00:04:
[...]

Ergens wel he... Ik heb ze nu eerst grijs gemaakt. Van sommige linkjes heb ik het blauw wat lichter gemaakt om ze beter leesbaar te maken. Ik weet alleen niet wat mooier is: blauw of grijs/wit.

[...]

Dat bleek een witte achtergrondkleur te zijn. Is nu ook donker.

Top. Het switchen naar de originele CSS overdag werkt ook goed.

[sypie]

Ow, vanochtend kwam ik nog tegen dat op V&A dat de tijdsaanduiding voor een object niet zichtbaar is i.v.m. zwarte tekst. (bijvoorbeeld: 3 minuten geleden - )

[Hero of Time]

sypie schreef op maandag 2 april 2018 @ 00:04:
[...]

Wat nog een punt van aandacht is: in de reacties onder nieuwsitems, die nog niet gemod zijn of die ingeklapt zijn, is de auteur zwart. Dit is op de donkere achtergrond niet te lezen.

[afbeelding]

Ah, dat had ik niet door omdat ik alle reacties laat weergeven. Ga ik vandaag fixen.

sypie schreef op maandag 2 april 2018 @ 10:05:
Ow, vanochtend kwam ik nog tegen dat op V&A dat de tijdsaanduiding voor een object niet zichtbaar is i.v.m. zwarte tekst. (bijvoorbeeld: 3 minuten geleden - )

Er zullen meer plekken zijn waar ik niet kom en daardoor nog wat bugs bevatten. Ook elementen die ik normaal gesproken verberg zien er niet uit, zoals it banen onder bepaalde artikelen.

Als je een github account hebt, kan je issues aanmaken bij mijn repo. Dan krijg je ook een mailtje als ik het heb opgelost.

[sypie]

Ah, excuses. Ik gebruik nu die van @ikvanwinsum, via zijn generator.

[Hero of Time]

Dat dacht ik al te zien aan de meer zwarte achtergrond.

[sypie]

@ikvanwinsum Ik zie dat je de plaatsingstijd van een advertentie hebt aangepast, netjes. Als je op dezelfde pagina in V&A de woonplaats ook wilt doen (kan ook wit-achtig) dan heb je volgens mij het V&A overzicht compleet.

[Oekol]

Nog langer tweakers kunnen rondstruinen in bed op m'n amoled scherm voordat de batterij leeg is. Hell yeah

Dit gaan we eens even goed in de gaten houden. Heb het liefst alles zwart op m'n mobiel vanwege verlengen accuduur.

[Tralapo]

ikvanwinsum schreef op maandag 2 april 2018 @ 00:04:
[...]

Ergens wel he... Ik heb ze nu eerst grijs gemaakt. Van sommige linkjes heb ik het blauw wat lichter gemaakt om ze beter leesbaar te maken. Ik weet alleen niet wat mooier is: blauw of grijs/wit.

[...]

Dat bleek een witte achtergrondkleur te zijn. Is nu ook donker.

Producten uit de pricewatch die als onderwerp gekoppeld zijn aan een topic worden nog weergegeven op een witte achtergrond, bovenaan het topic.

[sypie]

@ikvanwinsum Zou je de Modbreak aan kunnen passen in de CSS? Dit is wit op lichtroze, onleesbaar dus.

Een post met een Modbreak: Yorinn in "Misleidingspraktijken webshops, kun je er wat tegen doen?"

[ Voor 15% gewijzigd door sypie op 05-04-2018 20:26 ]

[Hero of Time]

@sypie is mijn variatie daarvoor goed genoeg of moet het donkerder? Maakt het voor @ikvanwinsum het wat makkelijker om het aan te passen door gewoon mijn stukje code over te nemen.

Is trouwens de kleur voor een mbr ook duidelijk genoeg voor je? Als het niet verandert is, kan het blauw net te weinig contrast bieden, wat mijn rood wat meer doet.

[AlxRoelofs]

@Hero of Time Kan je ook iets zeggen over het moment dat er gewoon een simpel knopje komt om nachtmodus aan of uit te zetten?

Dit topic bestaat nu bijna een jaar en heeft dubbel zo veel 'likes' als de 2de future in deze lijst; https://gathering.tweakers.net/forum/list_messages/1744311. Lijkt me toch wel zeker dat je hier heel veel mensen blij mee gaat maken.

[ikvanwinsum]

Dat duurt waarschijnlijk nog wel even, als het er uberhaupt komt. Als je dit draadje wat verder terugleest is het volgens @crisp best wel wat werk om te implementeren en te onderhouden.

@sypie Ik kijk er morgen even naar, heb op het moment daar geen tijd voor.

[Hero of Time]

AlxRoelofs schreef op donderdag 5 april 2018 @ 20:55:
@Hero of Time Kan je ook iets zeggen over het moment dat er gewoon een simpel knopje komt om nachtmodus aan of uit te zetten?

Dit topic bestaat nu bijna een jaar en heeft dubbel zo veel 'likes' als de 2de future in deze lijst; https://gathering.tweakers.net/forum/list_messages/1744311. Lijkt me toch wel zeker dat je hier heel veel mensen blij mee gaat maken.

Ik ben gewoon vrijwilliger hier en heb geen inzage in de roadmap of inspraak op wat de ontwikkelaars bouwen. Er is wel een reactie in dit topic geweest van een ontwikkelaar en die was kort gezegd "gaat niet gebeuren, huidige code is al complex genoeg". Zie o.a. crisp in "Feature Tweakers.net Nachtmodus.".

Voor nu zit je dus met community-based oplossingen. En die zijn dus niet 100% feilloos. Zorg dat je genoeg karma verdient, of neem een abbo, dan kan je in de Karmastore de Custom CSS feature 'kopen'.

[AlxRoelofs]

Hero of Time schreef op donderdag 5 april 2018 @ 21:05:
Ik ben gewoon vrijwilliger hier en heb geen inzage in de roadmap of inspraak op wat de ontwikkelaars bouwen.

Ah, sorry. Ik zag je zo vaak reageren hier, ik dacht; die moet er verstand van hebben.

Hero of Time schreef op donderdag 5 april 2018 @ 21:05:
Er is wel een reactie in dit topic geweest van een ontwikkelaar en die was kort gezegd "gaat niet gebeuren, huidige code is al complex genoeg". Zie o.a. crisp in "Feature Tweakers.net Nachtmodus.".

Voor nu zit je dus met community-based oplossingen. En die zijn dus niet 100% feilloos. Zorg dat je genoeg karma verdient, of neem een abbo, dan kan je in de Karmastore de Custom CSS feature 'kopen'.

Helaas pindakaas, dan wachten we nog wel even op de karma.

[Hero of Time]

AlxRoelofs schreef op donderdag 5 april 2018 @ 21:11:
[...]

Ah, sorry. Ik zag je zo vaak reageren hier, ik dacht; die moet er verstand van hebben.

Ik heb aardig wat verstand van het aanpassen van de site middels CSS, maar niet wat er allemaal op kantoor wordt besproken.

[...]

Helaas pindakaas, dan wachten we nog wel even op de karma.

Je kan o.a. mijn code op Github in Stylish gooien en aangeven dat het voor dit domein moet worden toegepast. Totdat je genoeg karma hebt. Alleen heb je het dan niet voor op je mobiel of tablet.

[AlxRoelofs]

Hero of Time schreef op donderdag 5 april 2018 @ 21:16:
Je kan o.a. mijn code op Github in Stylish gooien en aangeven dat het voor dit domein moet worden toegepast. Totdat je genoeg karma hebt. Alleen heb je het dan niet voor op je mobiel of tablet.

Het ging me eigenlijk vooral om mijn mobiel, maar toch bedankt!

[Hero of Time]

@AlxRoelofs, heb je al een blik geworpen op https://tweakers.net/my.tnet/karmastore/ om te zien of je al genoeg karma hebt om te spenderen eraan?

[AlxRoelofs]

Hero of Time schreef op donderdag 5 april 2018 @ 21:28:
@AlxRoelofs, heb je al een blik geworpen op https://tweakers.net/my.tnet/karmastore/ om te zien of je al genoeg karma hebt om te spenderen eraan?

Bijna. Nog 53 'punten', dus ik kom er wel!

[LocK_Out]

ikvanwinsum schreef op zaterdag 31 maart 2018 @ 12:01:
Verder heb ik een servertje opgetuigd die (als het goed is, heb het nog niet uitgebreid kunnen testen) bij een nieuwe commit op de GitHub repo automatisch een pull doet. De website is hier te vinden: https://cssgenerator.anneheijink.com/

Super dit, Thanks! Het werkt alleen niet op mijn (android) smartphone (Opera als browser). Als ik op preview klik geeft 'ie ´m goed weer, maar bij het opslaan & herladen van de pagina krijg ik enkel de normale kleuren.

Ik probeerde tevens de CSS code van @Hero of Time maar deze gooit helaas de hele header & search bar in de war.

[Hero of Time]

@LocK_Out, klopt, ik heb dat later opgesplitst. Dat stond op GH. Ik zal eens een nieuwe op Gdrive zetten.

[ikvanwinsum]

LocK_Out schreef op zondag 15 juli 2018 @ 06:01:
[...]
Super dit, Thanks! Het werkt alleen niet op mijn (android) smartphone (Opera als browser). Als ik op preview klik geeft 'ie ´m goed weer, maar bij het opslaan & herladen van de pagina krijg ik enkel de normale kleuren.

Ik probeerde tevens de CSS code van @Hero of Time maar deze gooit helaas de hele header & search bar in de war.

Hmm vervelend. Misschien heb je het 1 en ander geblokkeerd? Je kunt ook proberen om rechtstreeks alle CSS in het custom css-veld te plakken (dus het resultaat van https://cssgenerator.anneheijink.com/stylesheet?darkMode=1) Doet ie het dan wel?

[LocK_Out]

@Hero of Time Dus ik begrijp het goed, dat het niet aan mij ligt?

@ikvanwinsum Baas! Bedankt man, met het kopiëren van de (complete) inhoud werkt het inderdaad wel.
Ik gok inderdaad dat m'n browser iets blokkeert, maar geen idee wat.
Ben een complete CSS n00b, dus had geen idee hoe ik het aan de praat moest krijgen.

Thanks! Beiden bedankt voor de snelle reactie.

[ Voor 10% gewijzigd door LocK_Out op 15-07-2018 14:56 ]

[Anonymoussaurus]

Heeft één van jullie er wel eens over nagedacht om jullie code te sharen voor anderen? Via bijvoorbeeld https://userstyles.org/. Ik gebruik nu deze, maar die werkt niet helemaal optimaal: https://userstyles.org/styles/158044/tweakers-dash-style

[Hero of Time]

Meerdere mensen hier hebben hun code of delen ervan gedeeld met anderen. Je bent dus niet de eerste die dit voorstelt.

[LocK_Out]

@Anonymoussaurus Huh, dat is het doel van heel dit topic, toch??

EDIT: @Anonymoussaurus Haha, nachtdienst hè, dan ben je niet zo scherp als normaal

[ Voor 41% gewijzigd door LocK_Out op 16-07-2018 00:19 ]

[Anonymoussaurus]

Hero of Time schreef op zondag 15 juli 2018 @ 19:43:
Meerdere mensen hier hebben hun code of delen ervan gedeeld met anderen. Je bent dus niet de eerste die dit voorstelt.

LocK_Out schreef op maandag 16 juli 2018 @ 00:16:
@Anonymoussaurus Huh, dat is het doel van heel dit topic, toch??

Zo'n klein vermoeden had ik al . Was een retorische vraag waarbij ik eigenlijk doelde op 'waar jullie je code hebben geshared' .

[ikvanwinsum]

Anonymoussaurus schreef op maandag 16 juli 2018 @ 00:17:
[...]


[...]

Zo'n klein vermoeden had ik al . Was een retorische vraag waarbij ik eigenlijk doelde op 'waar jullie je code hebben geshared' .

Dat staat als het goed is ook wel in dit topic. Anyway, mijn code is te vinden op mijn website en GitHub en @Hero of Time heeft zijn code op GitHub Drive staan.

[Anonymoussaurus]

ikvanwinsum schreef op maandag 16 juli 2018 @ 07:50:
[...]

Dat staat als het goed is ook wel in dit topic. Anyway, mijn code is te vinden op mijn website en GitHub en @Hero of Time heeft zijn code op GitHub Drive staan.

Thanks! Heb die van jou in gebruik. Heb het momenteel zo in Stylish staan:

Is dat voldoende zo? Want het werkt wel, alleen niet op gathering.tweakers.net (had al geprobeerd 'em op 'op het domein van' te zetten, maar dat werkt ook niet).

Also: update 'ie automatisch of moet ik om de zoveel tijd die link opnieuw genereren?

[ikvanwinsum]

Dat zou moeten werken. Misschien een aparte stijl voor gathering.tweakers.net maken? Ik gebruik zelf geen stylish, maar heb de @import gewoon in het custom css-veld staan. Dan werkt het ook op het forum.

Op deze manier haal je inderdaad automatisch eventuele updates binnen, omdat je elke keer de css van mijn website haalt.

[Anonymoussaurus]

ikvanwinsum schreef op dinsdag 17 juli 2018 @ 08:09:
Dat zou moeten werken. Misschien een aparte stijl voor gathering.tweakers.net maken? Ik gebruik zelf geen stylish, maar heb de @import gewoon in het custom css-veld staan. Dan werkt het ook op het forum.

Op deze manier haal je inderdaad automatisch eventuele updates binnen, omdat je elke keer de css van mijn website haalt.

Ehm, dus wat raad je aan om te doen? Ik heb die link importurl bla bla er ook gewoon in staan toch?

[ikvanwinsum]

Anonymoussaurus schreef op dinsdag 17 juli 2018 @ 20:50:
[...]

Ehm, dus wat raad je aan om te doen? Ik heb die link importurl bla bla er ook gewoon in staan toch?

Ik zou die @import gewoon in je custom css in je tweakers-instellingen zetten.
De @import zegt niks meer dan: 'Hey, kijk hier ook even voor wat extra CSS.'

Als je het via Stylish wilt doen:
Ik ken Stylish niet, maar als 'ie het wel op tweakers.net doet en niet op gathering.tweakers.net dan lijkt me dat je ook een stijl voor gathering.tweakers.net moet maken.

Mocht je het een vervelend idee vinden dat er ook elke keer een verzoek naar mijn server gaat, kun je natuurlijk ook de CSS achter het @import linkje kopieren.

[Hero of Time]

Voor de geïnteresseerden: Hero of Time in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'". M'n CSS staat weer op Gdrive en kan 'm nu wat makkelijker bijwerken zonder telkens de link te vernieuwen.

[Anonymoussaurus]

ikvanwinsum schreef op woensdag 18 juli 2018 @ 10:21:
[...]


Ik zou die @import gewoon in je custom css in je tweakers-instellingen zetten.
De @import zegt niks meer dan: 'Hey, kijk hier ook even voor wat extra CSS.'

Als je het via Stylish wilt doen:
Ik ken Stylish niet, maar als 'ie het wel op tweakers.net doet en niet op gathering.tweakers.net dan lijkt me dat je ook een stijl voor gathering.tweakers.net moet maken.

Mocht je het een vervelend idee vinden dat er ook elke keer een verzoek naar mijn server gaat, kun je natuurlijk ook de CSS achter het @import linkje kopieren.

Sorry voor m'n late reactie.

Dat is het probleem juist; ik heb geen Tweakers abonnement, dus dat zal helaas niet gaan. Daarom maak ik gewoon gebruik van Stylus. Enig idee hoe ik het dan kan toepassen op gathering.tweakers.net?

Ik lees dat ik ook een stijl daarvoor moet maken, maar moet ik dan gewoon op deze manier doen? Want dat werkt wel maar weet niet of je dat bedoelde .

[ikvanwinsum]

Heb je ook niet genoeg karma om 'm te kunnen kopen in de karmastore? Lijkt me stug, met een totaal van meer dan 100K.

En ja, zoiets bedoelde ik

[Anonymoussaurus]

@ikvanwinsum Hi, je nachtmodus werkt goed! Alleen af en toe wat problemen bij het laden van de pagina. Althans... daar lijkt het op:

[ikvanwinsum]

Anonymoussaurus schreef op donderdag 20 september 2018 @ 17:32:
@ikvanwinsum Hi, je nachtmodus werkt goed! Alleen af en toe wat problemen bij het laden van de pagina. Althans... daar lijkt het op: [Afbeelding]

Ik zie inderdaad dat die webpagina (een beetje) sloom is, rond de 150ms doet 'ie erover bij mij. Ik zie zo 123 niet waarom. Hij doet het alleen nog wel gewoon .

[Anonymoussaurus]

ikvanwinsum schreef op vrijdag 21 september 2018 @ 11:11:
[...]


Ik zie inderdaad dat die webpagina (een beetje) sloom is, rond de 150ms doet 'ie erover bij mij. Ik zie zo 123 niet waarom. Hij doet het alleen nog wel gewoon .

Ah, maar daardoor blijft de webpagina bij mij helemaal wit soms, in de zin van dat 'ie de content niet laad.

[ikvanwinsum]

Welke pagina blijft wit? De pagina van t.net of op mijn site?

[Anonymoussaurus]

ikvanwinsum schreef op vrijdag 21 september 2018 @ 11:12:
Welke pagina blijft wit? De pagina van t.net of op mijn site?

Tweakers, en dan staat er dus linksonder "wachten op [jouw site-URL]".

[ikvanwinsum]

Anonymoussaurus schreef op vrijdag 21 september 2018 @ 11:14:
[...]

Tweakers, en dan staat er dus linksonder "wachten op ~~~[jouw site-URL]".

Hmm dat is niet de bedoeling inderdaad. Als je er last van hebt kun je altijd de css-code achter dat @import linkje kopieren naar je css-veld. Dan ben je alleen wel kwijt dat 'ie schakelt tussen dag- en nachtmodus.

Achter de schermen is het een simpele Laravel-applicatie die om 1 of andere reden heel sloom is. Ik zal er eens naar kijken.

[Anonymoussaurus]

ikvanwinsum schreef op vrijdag 21 september 2018 @ 11:27:
[...]

Hmm dat is niet de bedoeling inderdaad. Als je er last van hebt kun je altijd de css-code achter dat @import linkje kopieren naar je css-veld. Dan ben je alleen wel kwijt dat 'ie schakelt tussen dag- en nachtmodus.

Achter de schermen is het een simpele Laravel-applicatie die om 1 of andere reden heel sloom is. Ik zal er eens naar kijken.

Ja klopt, maar dan haal ik ook niet meer de laatste versie op, toch? Als jij dus een aanpassing maakt, moet ik de CSS code vervangen.

[ikvanwinsum]

Dat is wel zo inderdaad. Alleen zo vaak update ik dat niet, gemiddeld eens in de paar maanden.

[GekkePrutser]

Ik zou dit ook erg prettig vinden.

Ik heb custom CSS en ik gebruik Stylus met verschillende themes, maar die zijn allemaal niet bepaald perfect.

Bijvoorbeeld, veel afbeeldingen op Tweakers hebben een witte in plaats van een transparante achtergrond. En de smileys zien er raar uit omdat deze geen alpha channel gebruiken (kan ook niet bij gifjes, maar er zitten witte randjes omheen vanwege de antialiasing, die zouden er af kunnen).

En hier met dit theme (van stylus) is deze invoerbox bijvoorbeeld wit. Een first-party darkmode zou dit helemaal verhelpen.

Ik gebruik OS-wide dark mode steeds vaker nu dit ook in macOS zit en ik zou het heel erg waarderen als het op Tweakers ook kon Liefst dat het automatisch de OS instelling volgt, maar ik weet niet of de browser deze aan de site doorgeeft.

Edit: Ik heb nu die van @ikvanwinsum in mijn custom stylesheet gezet en deze is inderdaad de beste vergeleken met al die die in stylus zitten. De invoerbox is nu ook gewoon donker. Bedankt! Maar een first-party oplossing zou nog steeds beter zijn want veel andere problemen zijn er nog steeds. En er is geen makkelijke manier om heen en weer te switchen zonder steeds mijn custom CSS te editten.

Ik snap ook zeker het probleem van het ontwikkelen en onderhouden maar je ziet wel dat het steeds belangrijker wordt. In het begin werd dit argument ook gebruikt voor HiDPI/"retina" compatibiliteit en waren we ook zelf met eigen CSSjes aan het rommelen, maar uiteindelijk werd dat ook netjes door Tweakers zelf gedaan omdat het gewoon gemeengoed is tegenwordig.

[ Voor 52% gewijzigd door GekkePrutser op 21-10-2018 00:15 ]

[DukeBox]

Heb er een aantal geprobeerd waarvan de link het nog deed maar zie eigenlijk geen veranderingen.
Iemand een tip welke het zou moeten doen ?

Werd getriggerd door die blauwe gloed die sinds vandaag (?) over alle topics zit. Heb een speciale beeldscherm bril om blauw licht te filteren (nogal gevoelig voor hoofdpijn) maar het is niet normaal meer te lezen met dat kleur verloop erin.

[ Voor 6% gewijzigd door DukeBox op 12-11-2018 12:02 ]

[Hero of Time]

Mijne op Google Drive doet het nog prima. Hier en daar mist nog wat, dat moet ik nog eens fixen.

Weet je zeker dat je het in je profiel hebt ingeschakeld en toegepast? Of hoe heb je het nu willen doen?

[ACM]

DukeBox schreef op maandag 12 november 2018 @ 12:01:
Werd getriggerd door die blauwe gloed die sinds vandaag (?) over alle topics zit. Heb een speciale beeldscherm bril om blauw licht te filteren (nogal gevoelig voor hoofdpijn) maar het is niet normaal meer te lezen met dat kleur verloop erin.

Bij mijn/ons weten is er geen release geweest die dit kan veroorzaken. En vooral ook niet vandaag.

In theorie kan zoiets ook met A/B-tests gedaan worden die buiten releases om gestart kunnen worden, maar die zouden ook niet bij forumtopics actief moeten zijn. Je kan evt nog de cookies van 'vwo' verwijderen om jezelf in een andere groep terecht te laten komen.

Vergeet niet ook nog te controleren of je niet zelf nog wat hebt aangepast; zoals nieuwe browser-versie, andere beeldscherminstellingen (of drivers), etc.

[DukeBox]

ACM schreef op maandag 12 november 2018 @ 15:36:
In theorie kan zoiets ook met A/B-tests gedaan worden die buiten releases om gestart kunnen worden, maar die zouden ook niet bij forumtopics actief moeten zijn. Je kan evt nog de cookies van 'vwo' verwijderen om jezelf in een andere groep terecht te laten komen.

Tnx voor je reply, heb _vwo_uuid_v2 en _vwo_uuid verwijderd (enige die ik kon vinden met vwo), maar helaas.

Vergeet niet ook nog te controleren of je niet zelf nog wat hebt aangepast; zoals nieuwe browser-versie, andere beeldscherminstellingen (of drivers), etc.

Uiteraard, zowel IE als chrome (in private) doen het, heb nog niet op een andere PC gekeken.

@Hero of Time tnx, zal die nog even doen, was met de laatste pagina begonnen en een stuk of 5 terug gegaan, meeste waren dead links.



Edit.. verdomt zeg.. ik dacht, plaats er ook ff een screenshot bij, gebruik ik die knipsel tool van windows en die geeft exact het zelfde effect. Lijkt dus een windows gerelateerd iets te zijn.




Edit2: Beetje lopen spelen met windows settings en dan met name kleurfilters (welke standaard uit stonden bij mij) op filter rood groen heb is de blauwe waas weer weg, het ziet er weer een beetje uit zoals het was op de extreem knallende kleur rood na).

Edit3: Grappige is dat als ik mijn eigen gemaakte screenshots hier boven nu bekijk met kleur filter rood, de eerste screenshot ook normaal is de 2e van de knipsel nog steeds dezelfde kleur blauw (wel iets minder).
Ok, het is wel dezelfde 'gloed' maar bij knipsel hoort dat dus blijkbaar..


Kan dus denk ik wel concluderen dat het iets op mijn eigen pc.. maar wat

Edit4: Yes, gevonden.. schaam me zowat het hier te moeten schrijven maar contrast van mijn monitor (Dell 2717H) was de oorzaak. Van 80 naar 60 gezet en zag direct de blauwe gloed weg trekken.
Natuurlijk is het nu wel makkelijk de schoonmakers de schuld te geven maar ik denk dat ik er zelf onbewust aan heb zitten klooien afgelopen vrijdag.

b.t.w. Omdat de kleur stelling zo erg leek op het oude GoT dacht ik in eerste instantie dat het iets met x jaar bestaan was of zo

Edit5: Toch nog even een update.. thuis inderdaad nergens last van. Sterker nog, ondanks dat ik het niet meer zag op mijn werk is het toch een wereld van verschil.

Ik vermoed toch dat mijn monitor niet helemaal lekker is op mijn werk. Misschien dat het kwaaltje steeds erger is geworden want ik heb ook steeds vaker hoofdpijn als ik een dag er achter heb gezeten terwijl ik daar thuis mijn mijn (ooit) gekalibreerde ccfl monitor nooit last van. Veel zachter aan mijn ogen al heb ik hier ook veel minder omgevingslicht. Hoe dan ook ga ik nog wel aan de slag met de dark css settings want die schuif voor de achtergrond tint kan je niet echt serieus nemen (nofi).

ACM, sorry én bedankt voor je tijd.

[ Voor 64% gewijzigd door DukeBox op 12-11-2018 20:16 ]

[iNFiNiTY-]

Voor rust aan mijn ogen- zeker als ik wat artikelen lees in de avond, gebruik ik de dark knight add-on van Firefox. Ver van perfect, maar doet wat het moet doen.

https://i.imgur.com/veoWNIB.png

https://i.imgur.com/KIk8Hap.png

[walterworld]

iNFiNiTY- schreef op donderdag 29 november 2018 @ 14:05:
Voor rust aan mijn ogen- zeker als ik wat artikelen lees in de avond, gebruik ik de dark knight add-on van Firefox. Ver van perfect, maar doet wat het moet doen.

https://i.imgur.com/veoWNIB.png

https://i.imgur.com/KIk8Hap.png

Mooi
Welke add-on is dat? Krijgt hem niet gevonden in Firefox

[iNFiNiTY-]

walterworld schreef op donderdag 29 november 2018 @ 16:47:
[...]


Mooi
Welke add-on is dat? Krijgt hem niet gevonden in Firefox

Sorry, ''dark night'' is het. Ik gebruik hem alleen op Tweakers, voor andere websites is hij best slecht, maar om hier artikelen te lezen en dergelijke voldoet het prima voor me.

[crisp]

Voor artikelen kan je natuurlijk ook gewoon de ingebouwde reader mode van Firefox gebruiken; die kan je ook instellen op een donker thema

[Caayn]

@Hero of Time dank voor je werk Hoewel niet perfect, maakt het Tweakers wel een stuk leesbaarder. Ga er een tijdje mee draaien.

Het is jammer dat Tweakers zelf geen dark theme wil ontwikkelen en het maar bij de gebruikers neer legt. Ik snap dat legacy een issue kan zijn, maar dan zou je dit moeten willen aanpakken. Je zou hier immers bij het introduceren van andere features ook tegen aan moeten lopen (uiteraard in andere mate).

[Hero of Time]

@Caayn, dank je. Ik moet er weer eens voor gaan zitten, want er zijn ondertussen aardig wat wijzigingen geweest en de eerste blokken op de FP moet ik ook nog steeds fixen. En dan kan ik ook eens gaan kijken naar het donker maken van de code blokken, want dat is nog steeds een doorn in het oog.

[LankHoar]

Al enige tijd gebruik het thema van @EotT en die bevalt me prima: https://userstyles.org/st.../tweakers-dark-v2-by-eott

Hij reageert ook vlot op vragen/opmerking op zijn CSS (en staat ook open voor suggesties)

_{Native ondersteuning zou uiteraard nog steeds beter zijn!}

[_Thanatos_]

Totdat T.net deze feature officieel wil aanbieden (ze hebben vast belangrijkere zaken om te fixen?) is het VEEEEL makkelijker om de addon Dark Reader te gebruiken. Die is vgs mij ook voor Chrome en Edge beschikbaar.

Het is niet perfect, maar 'at the flick of a switch' is een stuk makkelijker dan gaan lopen kutten met css die op elk mogelijk moment weer kapot kan gaan door een update.

[dec0de]

@_Thanatos_ Of je doet dit:
Je maakt 2 cssen, eentje moet je voor elk onderdeel .customColor zetten, en als je dan op het tandwiel drukt en je pas het ligt aan wisselt die.

Cascading Stylesheet:

@media only screen and (min-width: 1220px) {
body{
background: #474747;
}

/*######################################################################## 
                                          BORDERS WEGWERKEN
#######################################################################*/
.keywordSearch, #userbar li.icon.flag.nl::after, .keywordSearch:hover, #top, #categoryBrowser div, #categoryBrowser.sidebar div, #categoryBrowser, .galleryHeadingContainer, .galleryHeadingContainer div, 
#entity, #entity div, #search input.submit, table.pwListTable td, #contentArea {
border: none !important;

}


/*########################################################################
                            BOVENSTE GEDEELTE EN ZOEKBAR EN MENU
########################################################################*/
.keywordSearch{
background: #474747;
}

#menubar{
background-image: none;
background-color:#090909cc;
border-bottom: none;
box-shadow: inherit;
}

.menubottom span{
display: none;
}



.menubottom:after{
content:'wij hebben geen webdesigners in dienst, maar als je voldoende karma hebt mag je het fixen!';
}

#menubottombar .menubottom{
margin: 6px;
margin-left: 208px;
}

#menu, #search, #contentArea, #ticker, #about {
width: 80%;
}

/*################################
LELIJKE ICOONTJES VERANDEREN en social media
################################*/
#userbar li.notifications a {
background-position: 0 -25px;
background: url("https://tweakers.net/ext/f/fqKfrbeDGIEA5qj49Z2exz8J/full.png") no-repeat; 
background-position-y: 0%;
background-size: auto auto;
background-size: 20px;
background-position-y: 6.5px;
background-position-x: 4px
}

#menubottombar div.socialcount{
height: 0px;
width: 0px;
visibility: hidden;
left: 10000px;
}

#userbar li.icon.flag.nl::after{
height: 0px;
width: 0px;
background: none
left: 10000px;
}

#userbar li.messages a{
background: url("https://tweakers.net/ext/f/HpWcDHA5p7EbDAIzLBfrZvXg/full.png") no-repeat;
background-size: 20px;
background-position-y: 7.5px;
background-position-x: 5px;
}

.icon.compare.empty{
width: 0px !important;
height: 0px !important;
visibility: hidden;
left: 100000000px;
}
/*######################
EINDE LELIJKE ICOONTJES
######################*/





#mainSearch .submit{
border-bottom-right-radius: 15px;
border-top-right-radius: 15px;
}







#searchbar{
background: #474747;
}


.keyword .text{
border-bottom-left-radius: 15px !important;
border-top-left-radius: 15px !important;
}

/*########################################################################
                                             ALGEMENE DINGEN
########################################################################*/
#bottom div.hr {
background: #474747
}

h1, h2 {
color: #000;
}



#contentArea {
padding: 10px;
padding-right: 20px;
padding-left: 20px;
margin-bottom: 150px;
border-radius: 5px; 
margin-top: 50px;
width: 80%
}
 

 
#layout {
background: #474747
}



/*########################################################################
                                                   SETTINGS
########################################################################*/
.settingsContent{
width: 80%
}


#categoryBrowser div, #categoryBrowser.sidebar div{
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
backgound: #dedede !important;
}

#categoryBrowser div{
background-color: #dedede;
}



#categoryBrowser{
padding: inherit;
padding-left: 10px;
background: #dedede;
border-radius: 5px;
}


#categoryBrowser div ul{
border-radius: 5px;
}

#categoryBrowser ul{
background: #dedede;
}



/*##################################################################
                                          USER GALLERY
##################################################################*/

.galleryHeadingContainer, .galleryHeadingContainer div{
background: #474747;
}

.pageTabsContainer{
background: #474747;
}

.memberInfo h1, .memberInfo h2, .memberInfo h3 {
color: #fff;
}

.galleryHeading .karma{
color: #efefef;
}

.vaInfo .count a {
color: #000;
font-size: 15px;
font-weight: bolder;
}

/*#######################################################################
                                            PRICEWATCH
######################################################################*/


#entity, #entity div {
background: #474747;
}

#filterForm{
width: 210px;
}

.filterGroup .filters{
padding-left: 10px;
}



.entityHeader h1 {
color: white;
}

.sublist.images.no_scroll.large ul{
background-color: #fff !important;
}

#categoryBrowser .sublist{
top: 2px;
height: 380px;
}

/*########################################################################
                                                        FRONTPAGE
########################################################################*/


.fpaItemsWrapper, .fpaItems .fpaItem{
border: 0px;
}


#highlightedProducts .fpaItem{
border-top: none;
}

.mainColumn.frontpage{
width: 940px;
border-right: none;
margin-right: 50px;
}


.fpaItems{
margin: 0 auto;
}


#categoryBar h2{
padding-bottom: 10px;
font-size: 24px;
}


 #categoryBar{
text-align: center;
}


table.highlights .replies{
padding-right: 10px;
}


.publicationTime {
background: #dedede;
padding-right: 5px !important;
}

table.highlights .type{
background: #dedede
}


.secondColumn.frontpage{
width: 400px;
}


#highlightedProducts h2 {
text-align: center;
font-size: 24px;
}


table.highlights td, table.highlights{
border: none;
}


#jobs {
    width: 0px;
    height: 0px;
    padding: 0px;
    visibility: hidden;
    left: 10000px;
}

/*########################################################################
                                                             FORUM
########################################################################*/
h2.bar.question{
width: 0px;
height: 0px;
padding: inherit;
visibility: hidden;
left: 10000px;
background: inherit;
}
/*#######################################################################
                                             DARK MODE MET CUSTOM COLOR
#######################################################################*/

body.customColor #contentArea{
background: #575757;
}


body.customColor div.message{
background-color: #8d8d8d;
background-image: none;
border: none;
box-shadow: inherit;
}


body.customColor #searchbar, body.customColor{
background: #474747;
}

body.customColor form.form1{
background: #8d8d8d;
border: none;
box-shadow: inherit;
}

body.customColor #reageer{
background: #8d8d8d;
border: none;
}


/*#####################################################################
                                          TEXT COLOR  AANPASSEN VOOR DARKMODE
#####################################################################*/

body.customColor h1, body.customColor h2, body.customColor #header, body.customColor label{
color: white;
}

body.customColor a {
color: #cbcbcb;
}


.customColor p.edit a, .customColor .messagecontent p.edit, .customColor  .signature a {
color: #eee;
}


 body.customColor h3{
color: black;
}

background-color: #8d8d8d;


/*########################################################################
                                          EINDE DESKTOP LAYOUT
########################################################################*/
}
/*####################DIT BRACKET LATEN STAAN! !! !! !! !! !! !! !!###############*/
@media  only screen and (max-width: 1220px) {
@media only screen and (min-width: 1000px){
#menubar{
background-image: none;
background-color:#0004;
border-bottom: none;
box-shadow: inherit;
-webkit-backdrop-filter: blur(10px);
}


body.customColor #contentArea{
background: #575757;
}


body.customColor div.message{
background-color: #8d8d8d;
background-image: none;
border: none;
box-shadow: inherit;
}


body.customColor #searchbar, body.customColor{
background: #474747;
}

body.customColor form.form1{
background: #8d8d8d;
border: none;
box-shadow: inherit;
}

body.customColor #reageer{
background: #8d8d8d;
border: none;
}


/*#####################################################################
                                          TEXT COLOR  AANPASSEN VOOR DARKMODE
#####################################################################*/

body.customColor h1, body.customColor h2, body.customColor #header, body.customColor label{
color: white;
}

body.customColor a {
color: #cbcbcb;
}


.customColor p.edit a, .customColor .messagecontent p.edit, .customColor  .signature a {
color: #eee;
}


 body.customColor h3{
color: black;
}


/*#######################   DEZE BRACKETS LATEN STAAN##################*/
}
}
/*#######################   DEZE BRACKETS LATEN STAAN##################*/

#tracker .fakeTop{
background-image: none !important;
background-color: #474747;
}



@media  only screen and (max-width: 800px) {
@media only screen and (min-width: 80px){
#menubar{
background-image: none;
background-color:#0004;
border-bottom: none;
box-shadow: inherit;
-webkit-backdrop-filter: blur(10px);
}

Die blur in de menubalk is alleen op mobiel, en de lay-out is anders op desktop (voor mijn ultrawide)

Hier een showcase YouTube: Tweakers custom css darkmode (dit is een fake naam op YouTube

[ Voor 97% gewijzigd door dec0de op 29-01-2019 11:30 ]

[Steephh]

_Thanatos_ schreef op donderdag 17 januari 2019 @ 22:20:
Totdat T.net deze feature officieel wil aanbieden (ze hebben vast belangrijkere zaken om te fixen?) is het VEEEEL makkelijker om de addon Dark Reader te gebruiken. Die is vgs mij ook voor Chrome en Edge beschikbaar.

Het is niet perfect, maar 'at the flick of a switch' is een stuk makkelijker dan gaan lopen kutten met css die op elk mogelijk moment weer kapot kan gaan door een update.

Best een prettige addon, voor heel wat sites. Echter gaat oa. de menu balk compleet stuk.

Tot nog toe lijkt de Stylish plugin die hier bovenin ook genoemnd wordt best prima te werken. Op bepaalde tekst (waaronder wat ik nu aan het typen ben) na.

[ Voor 10% gewijzigd door Steephh op 02-04-2019 00:14 ]

[route99]

En deze extensie?
https://chrome.google.com...dpbpbibiknkcjamlkhoghieie
Heb zelf erg weinig ervaring met zo'n modus, dus jullie zien het wrs het verschil met andere extensies sneller?
Zag hem nog niet getest staan hier.

[ Voor 7% gewijzigd door route99 op 02-04-2019 04:22 ]

[_Thanatos_]

Steephh schreef op dinsdag 2 april 2019 @ 00:04:
[...]


Best een prettige addon, voor heel wat sites. Echter gaat oa. de menu balk compleet stuk.

Tot nog toe lijkt de Stylish plugin die hier bovenin ook genoemnd wordt best prima te werken. Op bepaalde tekst (waaronder wat ik nu aan het typen ben) na.

Ja maar T.net moet als tech website gewoon een native dark mode implementeren. Dat het stuk gaat, ligt dus in zeker zin aan T.net

route99 schreef op dinsdag 2 april 2019 @ 04:22:
En deze extensie?
https://chrome.google.com...dpbpbibiknkcjamlkhoghieie
Heb zelf erg weinig ervaring met zo'n modus, dus jullie zien het wrs het verschil met andere extensies sneller?
Zag hem nog niet getest staan hier.

Lijkt Chrome-only te zijn. Jammer.

[ Voor 28% gewijzigd door _Thanatos_ op 02-04-2019 10:37 ]

[route99]

Ok. In Opera dan ook, maar dan mis je nog steeds FF & Edge.
Tnx.

[Mast]

Aangezien ik niet veel vertrouwen heb in de Stylish extensie (https://arstechnica.com/i...tracking-every-site-visit), dacht ik maar te beginnen aan een aparte Tweakers Darkmode extensie. De CSS file is meer een soort "proof of concept" en is zeker te vervangen door een ander bestaand uitgebreider / netter brouwsel.

Het leek mij i.i.g. verstandig om het collectief te doen: https://github.com/martinstork/tweakersnight