[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'

[sjorsjuhmaniac]

Hahn schreef op zondag 9 juni 2024 @ 15:18:
[...]

Dat kan je verhelpen door er een media-query omheen te zetten met een max-width. Bijvoorbeeld:

Cascading Stylesheet:

@media screen and (max-width: 500px) {
  #menu {
    margin-right: 0 !important;
 }
}

Thanks! it works

Cascading Stylesheet:

@media screen and (max-width: 500px) {
  #menu .rightSidebarToggle {
    order: 2;
    display: none;
  }

  #menu .leftSidebarToggle {
    display: none;
  }

  #menu .leftSidebarToggle {
    order: 0;

  }

  #menu #logo {
    order: 1;
  }

  #menu #userbar {
    order: 2;
    margin-left: auto;
    margin-right: 0;

  }

  #userbar .icon.display {
    display: none;

  }

  #userbar li.notifications {
    display: flex;
    order: 3;
  }

  #userbar li.messages {
    display: flex;
    order: 2;
  }

  #userbar li.compare {
    display: flex;
    order: 1;
  }

  #userbar li.more {
    display: flex;
    order: 0;
  }
}

[vanaalten]

Heb maar even wat moeite gedaan om onzin uit de newsfeed te filteren.
Om ".actie" te filteren (commercieele acties met partners enzo):

code:

.headlines .headlineItem.promo {
  display: none;
}

Om ".deals" te filteren (iets nieuws sinds gisteren, overzicht van prijsdalers in de Pricewatch):

code:

.headlines .headlineItem.deals {
  display: none;
}

Is niet heel spannend, maar misschien bruikbaar voor anderen.

[Skit3000]

Ik heb denk ik wel een leuk custom snippet voor wie de vormgeving van reacties op frontpageartikelen te afleidend vindt. Ik heb alles teruggebracht tot het minimale, terwijl alle bestaande functionaliteit gewoon beschikbaar is gebleven.

Custom CSS toevoegen: Compactere reacties op frontpage

Overzicht:



Features:

• Datum/tijd toont volledig als je er overheen gaat met je muis.
• Moderatiestatus is nu een kleine indicator in plaats van het grote getal.
• Reacties met een +2 of hoger zijn duidelijk herkenbaar door de verticale groene rand.
• [i]Je eigen moderatie is zichtbaar als klein puntje naast de berekende score.[/li]
• Reactie rapporteren is nu een icoon ipv tekst.
• Reageren is nu een knop ipv een tekst.
• Gewijzigde reacties worden nu getoond met een icoon. Ga je er met je muis overheen, zie je de geschiedenis.

Nog even een voor/na, waar je goed kunt zien hoeveel meer ruimte er is:

[ Voor 16% gewijzigd door Skit3000 op 17-07-2024 22:06 ]

[Hero of Time]

Skit3000 schreef op woensdag 17 juli 2024 @ 22:02:
Ik heb denk ik wel een leuk custom snippet voor wie de vormgeving van reacties op frontpageartikelen te afleidend vindt. Ik heb alles teruggebracht tot het minimale, terwijl alle bestaande functionaliteit gewoon beschikbaar is gebleven.

Custom CSS toevoegen: Compactere reacties op frontpage

Kijk eens in je snippet naar regels 43 en 47. De selector is hetzelfde. Hierdoor geef je 2x dezelfde margin-top mee, bij de eerste een max-height van 10px, bij de tweede een height van 10px.

[Skit3000]

Aangepast. Gelijk ook wat andere aanpassingen gedaan. Zo is de "Bewerken" tekst bij je eigen berichten omgezet naar een knop (zelfde plek als de reply knop) en worden je eigen berichten duidelijk gemarkeerd. Verder wat dingen beter uitgelijnd en popup teksten beter leesbaar gemaakt.

[Skit3000]

Weer een paar kleine aanpassingen aan mijn Compactere reacties op frontpage snippet, na het een poosje dagelijks te hebben gebruikt.

Reageren




Eigen reacties
Duidelijk gemarkeerd met balk aan rechter zijde. Rechtsonder is de edit knop.


Uitgelichte reacties
+2 en +3 reacties worden duidelijker getoond.



Ingeklapte reacties



Hover
Met je muis over de ster (edits) of tijd gaan, toont details van edit en/of volledige datum van post.





Licht/donker thema
Zoals het er met het lichte thema uit ziet.



Op dit moment ben ik aardig tevreden met hoe de frontpage er uit ziet met dit thema bij dagelijks gebruik. Als iemand nog suggesties heeft (voor aanpassingen óf promotie?) dan hoor ik het graag!

[wizai]

Heeft iemand tips om mijn buttons of tekst een andere kleur te geven via CSS?

Het gaat om css class ctaButton


Edit: gefixt door thema Licht in te stellen, in plaats van Donker.

[ Voor 10% gewijzigd door wizai op 05-08-2024 13:43 ]

[Hero of Time]

wizai schreef op maandag 5 augustus 2024 @ 13:13:
Heeft iemand tips om mijn buttons of tekst een andere kleur te geven via CSS?

Het gaat om css class ctaButton
[Afbeelding]

Edit: gefixt door thema Licht in te stellen, in plaats van Donker.

Alternatief is .ctaButton een color: black; mee te geven. Of gewoon geen kleur overrulen, dan krijg je de standaard regel die gewoon voldoet (ik gebruik dark mode en de tekst op knoppen is bij mij gewoon donker). Waarde in css:

code:

color: var(--button-default-text-color);

[JBplap]

Bastien schreef op zondag 13 september 2020 @ 14:02:
Weet iemand of het op de een of andere manier mogelijk is om topics te verbergen, behalve via het verboden teken in 'Mijn topics'? Dat laatste is niet functioneel want dan moet je er eerst in gepost hebben. Ik wil bepaalde topics gewoon nooit zien, maar zie daar nu geen mogelijkheden voor. Behalve dan een heel subforum eruit te gooien maar da's ook niet de bedoeling. Dus eigenlijk een topic ID geheel verbergen, al is het maar enkel bij de 'Actieve topics'. Dat ik dat af en toe uit moet breiden met nieuwe id's maakt mij niet heel veel uit.

Heb wel gevonden (in een snippet) hoe het kan met user id's maar zie daar niet iets in overeen komen voor gehele topics. Maar mijn CSS kennis is ook op een diep droevig niveau dus dat helpt niet mee.

Is hier inmiddels al een CSS oplossing voor?
Ik heb dezelfde vraag.

[F.West98]

JBplap schreef op vrijdag 8 november 2024 @ 01:05:
[...]


Is hier inmiddels al een CSS oplossing voor?
Ik heb dezelfde vraag.

Cascading Stylesheet:

.listing tr:has(td.topic a[href*="1428598"]) {
    display: none;
}

Dit zou moeten werken. In de regel dan wel het topic ID vervangen door het ID van het topic dat je wil verbergen.

[JBplap]

F.West98 schreef op vrijdag 8 november 2024 @ 05:04:
[...]

Cascading Stylesheet:

.listing tr:has(td.topic a[href*="1428598"]) {
    display: none;
}

Dit zou moeten werken. In de regel dan wel het topic ID vervangen door het ID van het topic dat je wil verbergen.

Top, dit werkt!

[iCore]

Skit3000 schreef op donderdag 1 augustus 2024 @ 21:41:
Weer een paar kleine aanpassingen aan mijn Compactere reacties op frontpage snippet, na het een poosje dagelijks te hebben gebruikt.

Reageren
[Afbeelding]

[Afbeelding]

Eigen reacties
Duidelijk gemarkeerd met balk aan rechter zijde. Rechtsonder is de edit knop.
[Afbeelding]

Uitgelichte reacties
+2 en +3 reacties worden duidelijker getoond.

[Afbeelding]

Ingeklapte reacties

[Afbeelding]

Hover
Met je muis over de ster (edits) of tijd gaan, toont details van edit en/of volledige datum van post.

[Afbeelding]
[Afbeelding]
[Afbeelding]

Licht/donker thema
Zoals het er met het lichte thema uit ziet.

[Afbeelding]

Op dit moment ben ik aardig tevreden met hoe de frontpage er uit ziet met dit thema bij dagelijks gebruik. Als iemand nog suggesties heeft (voor aanpassingen óf promotie?) dan hoor ik het graag!

Dank voor je werk, erg mooi . Kwam alleen wel een klein probleempje tegen:

Als je een reactie modereert komt jouw gekoze score bobbel over de raporteer knop heen:

[Skit3000]

iCore schreef op vrijdag 8 november 2024 @ 15:57:
[...]

Dank voor je werk, erg mooi . Kwam alleen wel een klein probleempje tegen:

Als je een reactie modereert komt jouw gekoze score bobbel over de raporteer knop heen:

Dank je!

Dat is semi met opzet. Als je al een score hebt gegeven, denk ik dat de kans dat je óók nog de reactie wilt rapporteren denk ik vrij laag. Ik kon ook niet goed bedenken hoe ik als je hebt gemod, de tijd en het "report" icoon verder naar links op kan schuiven met enkel css.

Als je een betere plek weet voor het "report" icoon pas ik het graag aan!

[vanaalten]

Ik heb niet zo veel interesse in de Dev Summit, dus vraag mij af: kan je met custom CSS deze artikelen uit het nieuwsoverzicht verwijderen?

Ik heb zelf wat geprobeerd - eigenlijk een bestaande CSS snip gepakt en aangepast - maar deze deed het in elk geval niet:

Cascading Stylesheet:

.headlineItem:has(.headline--anchor[href*="Summit"]){
  display: none;
}

[Skit3000]

Je .headlineItem:has(.headline--anchor) geeft een div terug, geen a, dus heeft ook geen href attribute.

Dit is denk ik wat je wilt:

code:

.headlineItem:has(.headline--anchor) a[href*="summit"]{
  display: none;
}

[vanaalten]

Skit3000 schreef op maandag 25 november 2024 @ 11:04:
Je .headlineItem:has(.headline--anchor) geeft een div terug, geen a, dus heeft ook geen href attribute.

Dit is denk ik wat je wilt:

code:

.headlineItem:has(.headline--anchor) a[href*="summit"]{
  display: none;
}

Hmmm, dat doet het wat beter, maar het laat wel het icon en tijd staan, enkel de titel verdwijnt.

[Skit3000]

Dan wil je het waarschijnlijk inkorten tot:

code:

.headlineItem:has(a[href*="summit"]){
  display: none;
}

[vanaalten]

Skit3000 schreef op maandag 25 november 2024 @ 12:11:
Dan wil je het waarschijnlijk inkorten tot:

code:

.headlineItem:has(a[href*="summit"]){
  display: none;
}

Ja!
@Skit3000 dank, dit gaat in de toekomst nog wel vaker bruikbaar zijn.
Ik heb er maar meteen een publieke CSS-snip van gemaakt:
Verwijder Dev-Summit nieuws uit het overzicht

[segil]

Ik blokkeer .adv posts, maar vandaag is eentje toch zichtbaar:



Mijn code:

code:

a [src*="*gift*guide*"] { display: none;}
#bestBuyGuides {
display:none;
}
.adv {display:none;}
.Adv {display:none;}
.deals {display:none;}
.promo {display:none;}
#navMenu li a[href^="https://tweakers.net/carriere/"]{ 
 display: none;
}
#navMenu li a[href^="https://tweakers.net/pricewatch/deals/"]{ 
 display: none;
}
ul#navMenu a[href="https://tweakersgear.net"]
{
  display: none !important;
}

#navMenu li a[href^="https://tweakers.net/deals/black-friday/echte-techdeals"]{ 
 display: none;
}
etc...

Iemand een idee wat hier gebeurt?

[vanaalten]

segil schreef op dinsdag 3 december 2024 @ 08:53:
Ik blokkeer .adv posts, maar vandaag is eentje toch zichtbaar:

[Afbeelding]

Mijn code:

code:

a [src*="*gift*guide*"] { display: none;}
#bestBuyGuides {
display:none;
}
.adv {display:none;}
.Adv {display:none;}
.deals {display:none;}
.promo {display:none;}
#navMenu li a[href^="https://tweakers.net/carriere/"]{ 
 display: none;
}
#navMenu li a[href^="https://tweakers.net/pricewatch/deals/"]{ 
 display: none;
}
ul#navMenu a[href="https://tweakersgear.net"]
{
  display: none !important;
}

#navMenu li a[href^="https://tweakers.net/deals/black-friday/echte-techdeals"]{ 
 display: none;
}
etc...

Iemand een idee wat hier gebeurt?

Ik heb er geen verstand van, maar hier heb ik die onderdrukt met:

Cascading Stylesheet:

.headlineItem.nonspot {
    display: none;
}

[segil]

vanaalten schreef op dinsdag 3 december 2024 @ 11:35:
[...]

Ik heb er geen verstand van, maar hier heb ik die onderdrukt met:

Cascading Stylesheet:

.headlineItem.nonspot {
    display: none;
}

Bedankt, dat werkt. Blijkbaar is iets gewijzigd bij Tweakers. Geen idee hoe deze CSS werkt, maar het werkt

[WRT54G]

Ik probeer de rechter kolom te verwijderen van mijn front page maar krijg het niet voor elkaar.

code:

.sidebar {display: none !important;}

Haalt hem weg maar dan ben ik ook direct mijn sidebar kwijt in de instellingen van mijn gebruikersprofiel.

Iemand een idee?

[MatHack]

WRT54G schreef op maandag 9 december 2024 @ 14:38:
Ik probeer de rechter kolom te verwijderen van mijn front page maar krijg het niet voor elkaar.

code:

.sidebar {display: none !important;}

Haalt hem weg maar dan ben ik ook direct mijn sidebar kwijt in de instellingen van mijn gebruikersprofiel.

Iemand een idee?

[Afbeelding]

probeer eens

Cascading Stylesheet:

.fp-grid-areas .sidebar {display: none !important;}

[WRT54G]

@MatHack
Je bent een topper, thanks! Het werkt.

[vanaalten]

MatHack schreef op maandag 9 december 2024 @ 14:57:
[...]


probeer eens

Cascading Stylesheet:

.fp-grid-areas .sidebar {display: none !important;}

@MatHack Dank, da's beter dan mijn gevonden oplossing!

Heb er een publieke snip van gemaakt:
Verwijder sidebar (Best Buy Guides, prijsdalers)

[WRT54G]

Ik heb mijn CSS nu bijna zover als ik hem wil hebben echter op mijn iPhone krijg ik rechts boven een (druk/click) pijl die vervolgens niks doet. Deze zou ik nog weg willen hebben. Iemand een idee hoe?

[Wiethoofd]

WRT54G schreef op maandag 9 december 2024 @ 16:03:
Ik heb mijn CSS nu bijna zover als ik hem wil hebben echter op mijn iPhone krijg ik rechts boven een (druk/click) pijl die vervolgens niks doet. Deze zou ik nog weg willen hebben. Iemand een idee hoe?

[Afbeelding]

Dat zou de .sidebar-trigger moeten zijn die je dan wil verbergen.

[WRT54G]

Wiethoofd schreef op maandag 6 januari 2025 @ 21:11:
[...]

Dat zou de .sidebar-trigger moeten zijn die je dan wil verbergen.

Gelukt! Thanks

[Yorinn]

Tweakers Groene Menubalk

Als ik nu hover over een menu-item, is die rood ipv. groen. Ik denk dat dit een aanpassing met het nieuwe menu is geweest, maar hoe verander ik dit terug?

[vanaalten]

Er is denk ik nog wel meer veranderd.
Ik gebruik o.a. Sidebar links en merk nu dat het de tracker in/uitklappen de hele menubalk ook mee-schuift. Waardoor het rechterdeel met oa notifications en persoonlijke instellingen niet meer zichtbaar is.

[DaFeliX]

Yorinn schreef op donderdag 23 januari 2025 @ 10:40:
Tweakers Groene Menubalk

Als ik nu hover over een menu-item, is die rood ipv. groen. Ik denk dat dit een aanpassing met het nieuwe menu is geweest, maar hoe verander ik dit terug?

Volgens mij zou dit werken:

code:

twk-site-menu > menu > li:hover {
  background-color: inherit;
}

[Rubman]

Gaat sowieso niet heel lekker met de bovenbalk en CSS,
Dropdown van notificaties flipt behoorlijk van links naar rechts met muis naar rand bewegen waardoor je feitelijk niets aan kan klikken.
ook de teller is vrij inacuraat geeft heel veel notificaties terwijl ik er maar 1 heb.
De flippende dropdown ligt waarschijnlijk aan de Hover snippet van @F.West98

[ Voor 22% gewijzigd door Rubman op 23-01-2025 11:14 ]

[Yorinn]

DaFeliX schreef op donderdag 23 januari 2025 @ 11:09:
[...]


Volgens mij zou dit werken:

code:

twk-site-menu > menu > li:hover {
  background-color: inherit;
}

Dat was hem bijna, maar heeft me wel in de goede richting geholpen. Onderstaande doet het hem.

code:

twk-site-menu > menu > li:hover {
background:#1D8348;
background-color:#1D8348;
border-bottom:1px solid #333;
border-bottom:1px solid #333;
height:43px
}

[GieltjE]

Heb van de week een eigen css gemaakt: Verberg scroll/jump button op mobiel

Ben absoluut geen frontend programeur (eerder het omgekeerde), dus als de css beter kan hoor ik het graag.

[vanaalten]

vanaalten schreef op donderdag 23 januari 2025 @ 10:49:
Er is denk ik nog wel meer veranderd.
Ik gebruik o.a. Sidebar links en merk nu dat het de tracker in/uitklappen de hele menubalk ook mee-schuift. Waardoor het rechterdeel met oa notifications en persoonlijke instellingen niet meer zichtbaar is.

Voor wie hier ook tegenaan loopt: ik heb die CSS snip vervangen door Fix de nieuwe verslechterde sidebar / sidebar weer links en dan werkt het weer zoals het hoort.

[segil]

Om één of andere reden is de "custom css" optie verdwenen uit mijn profiel, ik zie 'm er niet meer tussen staan als ik ga naar mijn profiel -> Instellingen.

Deze werkt ook niet bij mij: https://tweakers.net/instellingen/layout/#Customstyle

Nu is er een kleine kans dat mijn eigen custom CSS hiervoor verantwoordelijk is Alhoewel ik geen aanpassingen heb gedaan aan het instellingen menu, zover ik weet.

Iemand een idee hoe ik weer mijn custom CSS settings kan bereiken?

[crisp]

segil schreef op donderdag 23 januari 2025 @ 14:47:
Om één of andere reden is de "custom css" optie verdwenen uit mijn profiel, ik zie 'm er niet meer tussen staan als ik ga naar mijn profiel -> Instellingen.

Deze werkt ook niet bij mij: https://tweakers.net/instellingen/layout/#Customstyle

Nu is er een kleine kans dat mijn eigen custom CSS hiervoor verantwoordelijk is Alhoewel ik geen aanpassingen heb gedaan aan het instellingen menu, zover ik weet.

Iemand een idee hoe ik weer mijn custom CSS settings kan bereiken?

Misschien via deze link: https://tweakers.net/instellingen/customcss/

[ Voor 80% gewijzigd door crisp op 23-01-2025 15:19 ]

[segil]

crisp schreef op donderdag 23 januari 2025 @ 15:19:
[...]


Misschien via deze link: https://tweakers.net/instellingen/customcss/

Thanks! Nu weet ik zeker dat mijn CSS code dat linker menu bij Instellingen verbergt. ff puzzelen waardoor dat komt.

[Dennis1812]

Tweakers heeft de layout vandaag weer behoorlijk verkloot.
Op mobiel (chrome, Android, pixel fold) heb ik ineens 4 icoontjes bovenin en is de bel van notificaties fors kleiner geworden.
En met dikke vingers is t echt niet makkelijker geworden.

Iemand hier al d.m.v customCSS een fix voor om terug naar de situatie van gisteren te kunnen?
Die knop voor Nederland/België hoeft echt niet in het zicht te staan. Dat kan prima ver weg in een menuutje ergens. Of gewoon weg.

[Yorinn]

Dennis1812 schreef op donderdag 23 januari 2025 @ 22:05:
Tweakers heeft de layout vandaag weer behoorlijk verkloot.
Op mobiel (chrome, Android, pixel fold) heb ik ineens 4 icoontjes bovenin en is de bel van notificaties fors kleiner geworden.
En met dikke vingers is t echt niet makkelijker geworden.

Iemand hier al d.m.v customCSS een fix voor om terug naar de situatie van gisteren te kunnen?
Die knop voor Nederland/België hoeft echt niet in het zicht te staan. Dat kan prima ver weg in een menuutje ergens. Of gewoon weg.

Voor die weergave-opties is Verberg Weergave-opties in menu al gedeeld om die te verbergen.

[F.West98]

Rubman schreef op donderdag 23 januari 2025 @ 11:10:
Gaat sowieso niet heel lekker met de bovenbalk en CSS,
Dropdown van notificaties flipt behoorlijk van links naar rechts met muis naar rand bewegen waardoor je feitelijk niets aan kan klikken.
ook de teller is vrij inacuraat geeft heel veel notificaties terwijl ik er maar 1 heb.
De flippende dropdown ligt waarschijnlijk aan de Hover snippet van @F.West98

Er is inderdaad vrij veel kapot

Ik ga er dit weekend naar kijken!

[Bas170]

Voor de mensen die Aanvullingen Tweakers Perfect Dark gebruiken, ik heb wat aangepast.
Er gaat iets niet goed in dit stuk:

Cascading Stylesheet:

@media (min-width: 767px),(min-device-width: 767px) and (orientation: portrait),(min-device-width: 499px) and (orientation: landscape) {

#layout {
  background: rgb(39,40,40) !important;
}

.fixedHeader #menubar {
  width:100% !important;
}

#menu {
  width: 1000px !important;
}

#logo {
  left: -45px !important;
}

#menu .sitename + ul {
  margin-left: 120px !important;
  width:650px !important;
}

#userbar {
  right: 0px !important;
}

#top {
  margin: auto;
}
}

Door de @media was de bovenbalk naar rechts geschoven, maar ik zie niet 123 wat er fout gaat (de code die onder @media staat lijkt namelijk niet het issue), dus voor nu heb ik dat hele stuk uitgecomment. Op dit moment heb ik namelijk niet de tijd om daar in te duiken.

Menubalk zou nu in ieder geval weer bruikbaar moeten zijn.

[Meg]

Hey,

Er is vast iemand hier die weet of dit mogelijk is. Maar kun je op de GoT het logo van Tweakers vervangen met custom CSS door deze afbeelding van Henk?



Edit: @AW_Bos heeft deze custom CSS, maar die werkt op dit moment niet.
Henk in de header

[ Voor 29% gewijzigd door Meg op 27-04-2025 10:14 . Reden: Custom CSS gevonden die niet meer werkt ]

[Yorinn]

Meg schreef op zondag 27 april 2025 @ 10:09:
Hey,

Er is vast iemand hier die weet of dit mogelijk is. Maar kun je op de GoT het logo van Tweakers vervangen met custom CSS door deze afbeelding van Henk?

[Afbeelding]

Edit: @AW_Bos heeft deze custom CSS, maar die werkt op dit moment niet.
Henk in de header

Misschien dat je een stuk code uit Ode aan Henk kan halen om te gebruiken hiervoor?

[Meg]

Yorinn schreef op zondag 27 april 2025 @ 11:07:
[...]


Misschien dat je een stuk code uit Ode aan Henk kan halen om te gebruiken hiervoor?

Als ik weet, waar ik precies zou moeten zoeken.

[Paul]

@Meg Naar een URL Je zult het plaatje ergens vandaan moeten halen, dus als je in die CSS een URL ziet staan dan ben je op de goede weg.

Er staat maar één URL in, dus dat moet te doen zijn. Het commentaar is best duidelijk waar de tweede vermelding voor dient als je in gedachte houdt dat { t/m } een sectie aanduidt.

[Meg]

Dank, maar ook als ik de Ode aan Henk stijl gebruik, behoud je het normale logo van Tweakers.

[AW_Bos]

Meg schreef op zondag 27 april 2025 @ 10:09:
Hey,

Er is vast iemand hier die weet of dit mogelijk is. Maar kun je op de GoT het logo van Tweakers vervangen met custom CSS door deze afbeelding van Henk?

[Afbeelding]

Edit: @AW_Bos heeft deze custom CSS, maar die werkt op dit moment niet.
Henk in de header

Verhip. Is Henk opeens weggestuurd?
Mooi is dat!

Ik ga komende dagen ergens kijken of ik Henk weer terug kan krijgen.

[Meg]

AW_Bos schreef op zondag 27 april 2025 @ 12:04:
[...]

Verhip. Is Henk opeens weggestuurd?
Mooi is dat!

Ik ga komende dagen ergens kijken of ik Henk weer terug kan krijgen.

Ik vermoed dat Henk vakantie heeft, want ook de custom CSS van @Femme is Henk-loos.

[Hahn]

Even quick & dirty, en het is niet alleen op GoT, maar op heel Tweakers.net, maar het is een begin:

Cascading Stylesheet:

.site-logo, twk-site-menu .site-logo:hover {
  height: 45px;
  width: 100px;
  background: url(https://tweakers.net/fotoalbum/image/5Ox42ho8JvxT9r20zHJb98Tv.png) no-repeat 20px 0px;
}

.site-logo svg {
  display: none;
}

Wat eruit ziet als:


Uiteraard kan je de URL vervangen door een eigen plaatjes-URL, als je een ander logo wilt

[Meg]

Dat ziet er al een stuk beter uit!

Dit aanpassen naar andere maten werkt niet. Enig idee hoe dat komt?

[css] height: 45px;
width: 100px;[/css]

Gelukt, maar dat is niet mooi.

Ik ben bezig om het nog wat verder te Tweaken, maar zit nu met het volgende:

Cascading Stylesheet:

ttwk-site-menu .site-logo svg {
  display: none !important; /* Verberg het standaard Tweakers SVG-logo */
}

twk-site-menu .site-logo {
  height: 45px !important;
  width: 100px !important;
  background: url(https://tweakers.net/fotoalbum/image/5Ox42ho8JvxT9r20zHJb98Tv.png) no-repeat center/contain !important;
  background-color: transparent !important;
  border-left: 3px solid transparent !important; /* Zorgen dat de linkse rand bestaat voor hover */
  border-bottom: 1px solid transparent !important; /* Zorgen dat de onderste rand bestaat voor hover */
  transition: transform 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55); /* Alleen transformatie met animatie */
  transform-style: preserve-3d;
  transform-origin: center center;
}

/* Mouse-over effect */
twk-site-menu .site-logo:hover {
  transform: rotateY(180deg) scale(1.1); /* Draai direct met geen vertraging */
  background-color: #730d26 !important; /* Achtergrondkleur direct na flip */
  border-left: 3px solid #730d26 !important; /* Lijn links direct na flip */
  border-bottom: 1px solid #730d26 !important; /* Lijn onderaan direct na flip */
  transition: transform 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), 
              background-color 0.8s ease, 
              border-left 0.8s ease, 
              border-bottom 0.8s ease; /* Vertraging voor de kleur- en randveranderingen */
}

Het bovenstaande is wat ik heb, dit werkt perfect (dank AI) maar bij de mouse over is de stijl nog niet helemaal goed, weet iemand hoe ik dat oplos?


Dit is met de "Ode aan Henk" template.

[ Voor 100% gewijzigd door Meg op 27-04-2025 16:26 . Reden: Ik was vergeten Henk te vermelden. ]

[Meg]

Met dank aan de "/me" in regenboog tekst heb ik mijn eigennaam ook met een regenboog effect, maar kan ej dit ook op de rest van de site doen en niet alleen het forum?

* Meg houdt van regenboogkleuren.

Cascading Stylesheet:

div.message[data-owner-id="821329"] a.user {
  background: linear-gradient(45deg, #ef5350, #f48fb1, #7e57c2, #2196f3, #26c6da, #43a047, #eeff41, #f9a825, #ff5722);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: gradientFlow 5s infinite linear;
  background-size: 200% 200%;
}
  
@keyframes gradientFlow {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 200% 50%;
  }
}

[Bas170]

Meg schreef op maandag 5 mei 2025 @ 14:28:
Met dank aan de "/me" in regenboog tekst heb ik mijn eigennaam ook met een regenboog effect, maar kan ej dit ook op de rest van de site doen en niet alleen het forum?

* Meg houdt van regenboogkleuren.

Cascading Stylesheet:

div.message[data-owner-id="821329"] a.user {
  background: linear-gradient(45deg, #ef5350, #f48fb1, #7e57c2, #2196f3, #26c6da, #43a047, #eeff41, #f9a825, #ff5722);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: gradientFlow 5s infinite linear;
  background-size: 200% 200%;
}
  
@keyframes gradientFlow {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 200% 50%;
  }
}

Ik heb ooit eens iets heel lelijks gemaakt, geen garantie dat het goed werkt:

Taste The Rainbow Of Eternal Suffering

[Meg]

Bas170 schreef op donderdag 15 mei 2025 @ 12:59:
[...]

Ik heb ooit eens iets heel lelijks gemaakt, geen garantie dat het goed werkt:

Taste The Rainbow Of Eternal Suffering

Ga thuis kijken. Dank.

Dat is te erg.

[ Voor 3% gewijzigd door Meg op 15-05-2025 18:29 ]

[evilution]

.

[ Voor 99% gewijzigd door evilution op 24-08-2025 09:01 ]

[Meg]

@Zerora kan het kloppen dat Henk zo geschrokken is tijdens Halloween dat hij verdwenen is en je nu weer een duimpje op berichten moet geven?

[Zerora]

Meg schreef op zondag 2 november 2025 @ 14:18:
@Zerora kan het kloppen dat Henk zo geschrokken is tijdens Halloween dat hij verdwenen is en je nu weer een duimpje op berichten moet geven?

Ja, ik zag het. Ik zal er deze week eens naar kijken.

[Meg]

Zerora schreef op zondag 2 november 2025 @ 17:44:
[...]

Ja, ik zag het. Ik zal er deze week eens naar kijken.

Super, dankjewel!

[vanaalten]

...dus... er moest zonodig een zwarte balk in beeld komen met Black Friday blaat, "Eerst Tweakers, dan shoppen! Bekijk onze selectie..." enzo. Kostbare nuttige ruimte wordt zo ingenomen.

Die moet met Custom CSS wel weg te krijgen zijn, lijkt mij - maar ik ben een amateur op CSS gebied.
Mijn poging was simpelweg:

Cascading Stylesheet:

.twk-alert-bar {display:none!important;}

...maar, dat doet het dus niet.

Ik had met F12 de inspectie-optie aangezet, op het muiswijzertje geklikt om de zwarte balk als element te selecteren en zag daar dus ".twk-alert-bar" als elementnaam genoemd. Maar goed, zoals gezegd werkt dit niet. Dan ben ik sowieso benieuwd naar een correcte oplossing, maar vooral ook uitleg daarbij waarom die wel werkt en hoe ik dit had kunnen bedenken. Iemand?

[THE_BASE]

vanaalten schreef op maandag 10 november 2025 @ 09:05:
...dus... er moest zonodig een zwarte balk in beeld komen met Black Friday blaat, "Eerst Tweakers, dan shoppen! Bekijk onze selectie..." enzo. Kostbare nuttige ruimte wordt zo ingenomen.

Die moet met Custom CSS wel weg te krijgen zijn, lijkt mij - maar ik ben een amateur op CSS gebied.
Mijn poging was simpelweg:

Cascading Stylesheet:

.twk-alert-bar {display:none!important;}

...maar, dat doet het dus niet.

Ik had met F12 de inspectie-optie aangezet, op het muiswijzertje geklikt om de zwarte balk als element te selecteren en zag daar dus ".twk-alert-bar" als elementnaam genoemd. Maar goed, zoals gezegd werkt dit niet. Dan ben ik sowieso benieuwd naar een correcte oplossing, maar vooral ook uitleg daarbij waarom die wel werkt en hoe ik dit had kunnen bedenken. Iemand?

Vast niet onbekend, maar met Safari in macOS en iOS kun je afleidende onderdelen verbergen. Werkt prima voor de amateur.

[MatHack]

vanaalten schreef op maandag 10 november 2025 @ 09:05:
...dus... er moest zonodig een zwarte balk in beeld komen met Black Friday blaat, "Eerst Tweakers, dan shoppen! Bekijk onze selectie..." enzo. Kostbare nuttige ruimte wordt zo ingenomen.

Die moet met Custom CSS wel weg te krijgen zijn, lijkt mij - maar ik ben een amateur op CSS gebied.
Mijn poging was simpelweg:

Cascading Stylesheet:

.twk-alert-bar {display:none!important;}

...maar, dat doet het dus niet.

Ik had met F12 de inspectie-optie aangezet, op het muiswijzertje geklikt om de zwarte balk als element te selecteren en zag daar dus ".twk-alert-bar" als elementnaam genoemd. Maar goed, zoals gezegd werkt dit niet. Dan ben ik sowieso benieuwd naar een correcte oplossing, maar vooral ook uitleg daarbij waarom die wel werkt en hoe ik dit had kunnen bedenken. Iemand?

Ik heb hem zelf verborgen met onderstaande, dat is echt puur voor de black-friday alert, want mogeijk zijn er alerts die ik de toekomst wel wil zien. De fout in jouw poging is dat je twk-alert-bar als class hebt geschreven ipv element (de punt ervoor moet weg).

Cascading Stylesheet:

twk-alert-bar[campaign-id="2"] {display:none!important} /* verbergt black friday alert */

[Help!!!!]

MatHack schreef op maandag 10 november 2025 @ 09:48:
[...]


Ik heb hem zelf verborgen met onderstaande, dat is echt puur voor de black-friday alert, want mogeijk zijn er alerts die ik de toekomst wel wil zien. De fout in jouw poging is dat je twk-alert-bar als class hebt geschreven ipv element (de punt ervoor moet weg).

Cascading Stylesheet:

twk-alert-bar[campaign-id="2"] {display:none!important} /* verbergt black friday alert */

Top, veel dank!
Die zwarte balk was echt zeer obnoxious!

[Meg]

Help!!!! schreef op maandag 10 november 2025 @ 10:19:
[...]

Top, veel dank!
Die zwarte balk was echt zeer obnoxious!

Maar daarmee behoud je wel de grijze balk.

[Help!!!!]

Kan ik prima mee leven, heb toch al een grijzige achtergrond:

[MatHack]

Meg schreef op maandag 10 november 2025 @ 10:39:
[...]

Maar daarmee behoud je wel de grijze balk.

Mocht je die ook nog wel willen halen:

Cascading Stylesheet:

.twk-site-menu-wrapper {height:3rem!important}

Maar ik heb dat zelf niet gedaan, omdat ik geen idee heb wat er, naast de alert-bar, nog meer de hoogte van die style-container aanpast. Ook ik kan, net als @Help!!!!, leven met een tijdelijke hogere grijze balk (in dark-mode in mijn geval).

[DaFeliX]

MatHack schreef op maandag 10 november 2025 @ 11:05:
[...]


Mocht je die ook nog wel willen halen:

Cascading Stylesheet:

.twk-site-menu-wrapper {height:3rem!important}

Maar ik heb dat zelf niet gedaan, omdat ik geen idee heb wat er, naast de alert-bar, nog meer de hoogte van die style-container aanpast. Ook ik kan, net als @Help!!!!, leven met een tijdelijke hogere grijze balk (in dark-mode in mijn geval).

Zou je dan niet beter

Cascading Stylesheet:

:root .has-alert-bar,
:root .has-alert-bar-desktop, 
:root .has-alert-bar-mobile {
    --alert-bar-height: 0;
    --site-menu-wrapper-height: var(--site-menu-height);
}

kunnen doen? Dan heb je ook geen !important nodig

[MatHack]

DaFeliX schreef op maandag 10 november 2025 @ 11:37:
[...]


Zou je dan niet beter

Cascading Stylesheet:

:root .has-alert-bar,
:root .has-alert-bar-desktop, 
:root .has-alert-bar-mobile {
    --alert-bar-height: 0;
    --site-menu-wrapper-height: var(--site-menu-height);
}

kunnen doen? Dan heb je ook geen !important nodig

Hehe, ik neem aan dat dat veel beter werkt, zover had ik niet door de DOM en de CSS gekeken

[Toet3r]

DaFeliX schreef op maandag 10 november 2025 @ 11:37:
[...]


Zou je dan niet beter

Cascading Stylesheet:

:root .has-alert-bar,
:root .has-alert-bar-desktop, 
:root .has-alert-bar-mobile {
    --alert-bar-height: 0;
    --site-menu-wrapper-height: var(--site-menu-height);
}

kunnen doen? Dan heb je ook geen !important nodig

Werkt bij mij niet

[Meg]

Toet3r schreef op maandag 10 november 2025 @ 12:05:
[...]


Werkt bij mij niet

Die werkt hier ook niet helaas.

[Meg]

MatHack schreef op maandag 10 november 2025 @ 11:05:
[...]


Mocht je die ook nog wel willen halen:

Cascading Stylesheet:

.twk-site-menu-wrapper {height:3rem!important}

Maar ik heb dat zelf niet gedaan, omdat ik geen idee heb wat er, naast de alert-bar, nog meer de hoogte van die style-container aanpast. Ook ik kan, net als @Help!!!!, leven met een tijdelijke hogere grijze balk (in dark-mode in mijn geval).

Helaas werkt dat niet, zal straks eens gaan spelen.

[DaFeliX]

Toet3r schreef op maandag 10 november 2025 @ 12:05:
[...]


Werkt bij mij niet

Misschien omdat je een ander element dan ik verberg?

Ik heb dit dat de alert-bar zelf en de witruimte weghaald:

Cascading Stylesheet:

twk-alert-bar {
  display: none;
}
:root .has-alert-bar,
:root .has-alert-bar-desktop, 
:root .has-alert-bar-mobile {
    --alert-bar-height: 0;
    --site-menu-wrapper-height: var(--site-menu-height);
}

[Bart ®]

Deze snippet lost voor mij het probleem op:
Verberg de altijd zichtbare Black Friday banner.

[Room42]

Bart ® schreef op maandag 10 november 2025 @ 12:56:
Deze snippet lost voor mij het probleem op:
Verberg de altijd zichtbare Black Friday banner.

Top, maar daarmee verwijder je wel alle 'twk-alert-bar' zaken. Het lijkt erop dat die bar voor meer opties gebruikt kan worden, maar die zul je dan ook niet meer zien.

Ik vind het, qua UX, raar dat er geen 'verberg melding'-knopje aanwezig is. Hoe heet jullie UX designer ook alweer? Misschien die even taggen?

[Meg]

Bart ® schreef op maandag 10 november 2025 @ 12:56:
Deze snippet lost voor mij het probleem op:
Verberg de altijd zichtbare Black Friday banner.

Deze werkt perfect!

[AW_Bos]

Room42 schreef op maandag 10 november 2025 @ 13:48:
[...]

Top, maar daarmee verwijder je wel alle 'twk-alert-bar' zaken. Het lijkt erop dat die bar voor meer opties gebruikt kan worden, maar die zul je dan ook niet meer zien.

Ik vind het, qua UX, raar dat er geen 'verberg melding'-knopje aanwezig is. Hoe heet jullie UX designer ook alweer? Misschien die even taggen?

Voor welke doeleinde wordt die balk nog meer gebruikt? Ik hoop niet dat ik straks belangrijke informatie zal missen?

[Room42]

AW_Bos schreef op maandag 10 november 2025 @ 14:00:
[...]

Voor welke doeleinde wordt die balk nog meer gebruikt? Ik hoop niet dat ik straks belangrijke informatie zal missen?

Met deze CSS aan zullen we het nooit weten.

[Bart ®]

Room42 schreef op maandag 10 november 2025 @ 13:48:
Hoe heet jullie UX designer ook alweer? Misschien die even taggen?

https://tweakers.net/info/over-tweakers/wie/
Daar staan er een paar.

[Toet3r]

Room42 schreef op maandag 10 november 2025 @ 13:48:
[...]

Top, maar daarmee verwijder je wel alle 'twk-alert-bar' zaken. Het lijkt erop dat die bar voor meer opties gebruikt kan worden, maar die zul je dan ook niet meer zien.

Ik vind het, qua UX, raar dat er geen 'verberg melding'-knopje aanwezig is. Hoe heet jullie UX designer ook alweer? Misschien die even taggen?

Ik heb deze snippet gemaakt die alleen de black friday alert-bar verbergt niet de volledige alert-bar.
Daarnaast verbergt ie ook de black friday knop in de menubar en zwarte achtergrond op pricewatch product pagina.

[Meg]

Toet3r schreef op maandag 10 november 2025 @ 14:23:
[...]

Ik heb deze snippet gemaakt die alleen de black friday alert-bar verbergt niet de volledige alert-bar.
Daarnaast verbergt ie ook de black friday knop in de menubar en zwarte achtergrond op pricewatch product pagina.

De knop wordt niet verborgen in de menubalk met deze.

[Toet3r]

Meg schreef op maandag 10 november 2025 @ 15:28:
[...]

De knop wordt niet verborgen in de menubalk met deze.

lol, linkte naar de verkeerde snippet. Dit is de goede
Weg met Black Friday

[Meg]

Nice, alhoewel ik met die button zelf geen moeite heb.

[jdh009]

Voor degene die het gemist hebben:
WouterdR in "Feedbacktopic voor advertenties (banners)"

WouterdR schreef op maandag 10 november 2025 @ 16:35:
Bedankt voor alle feedback. Voor nu hebben we de alert bar uitgezet bij nieuwsberichten en in het forum, je kunt hem nog wel zien op de homepage. Verschillende afdelingen gaan met elkaar in gesprek hoe we dit product kunnen verbeteren. Wanneer er meer te delen is dan doen we wat.

[ Voor 62% gewijzigd door jdh009 op 10-11-2025 17:22 ]

[Maarten21]

Voor wie games op de frontpage niet interessant vindt:

code:

.headlineItem:has(twk-icon[title*="Nieuws | Games"]){
  display: none;
}

Geen Games op frontpage

[Resistor]

Ik ben niet echt handig met CSS, en ik heb een hekel aan alles wat met AI te maken heeft.

Heeft iemand al een CSS die de AI samenvatting uit de PW weg kan slopen? Dan hoef ik die rotzooi niet te zien.



Zoeken op 'AI' in de snippets helpt niet echt.

[ Voor 8% gewijzigd door Resistor op 03-02-2026 14:48 ]

[MatHack]

Resistor schreef op dinsdag 3 februari 2026 @ 14:40:
Ik ben niet echt handig met CSS, en ik heb een hekel aan alles wat met AI te maken heeft.

Heeft iemand al een CSS die de AI samenvatting uit de PW weg kan slopen? Dan hoef ik die rotzooi niet te zien.

[Afbeelding]

Zoeken op 'AI' in de snippets helpt niet echt.

Cascading Stylesheet:

.pdp-ai-product-text-container { display:none }

Vrij makkelijk zelf te vinden met F12 en/of inspect element in de HTML overigens.

[ Voor 7% gewijzigd door MatHack op 03-02-2026 19:54 ]

[Help!!!!]

Iemand enig idee hoe je die rode balk en de tekst erin op het Forum en de Frontpage kunt verwijderen / vervangen door zelfde grijze achtergrond.

Mijn retina's branden er anders uit...

Ik kom wel snippets tegen die de hele footer eruit halen maar voor mij is alleen die balk ergerlijk.

[Dennis1812]

Help!!!! schreef op maandag 30 maart 2026 @ 20:47:
Iemand enig idee hoe je die rode balk en de tekst erin op het Forum en de Frontpage kunt verwijderen / vervangen door zelfde grijze achtergrond.

Mijn retina's branden er anders uit...

Ik kom wel snippets tegen die de hele footer eruit halen maar voor mij is alleen die balk ergerlijk.

[Afbeelding]

synoniem in "[feedback] Nieuwe footer"

Hier staan enkele opties. Met succes in gebruik bij mij in ieder geval.

[Help!!!!]

^
Thx. Die opties had ik wel al gevonden maar die deleten dus de rode balk en alles eronder.

Mij gaat het alleen om de rode balk en de tekst erin. Had zelf al wat geprobeerd maar krijg het niet voor elkaar. Heb hier verder ook nul verstand van.

Maar goed als dit niets oplevert dan hide ik de hele footer maar gewoon.

[MatHack]

Help!!!! schreef op maandag 30 maart 2026 @ 21:11:
^
Thx. Die opties had ik wel al gevonden maar die deleten dus de rode balk en alles eronder.

Mij gaat het alleen om de rode balk en de tekst erin. Had zelf al wat geprobeerd maar krijg het niet voor elkaar. Heb hier verder ook nul verstand van.

Maar goed als dit niets oplevert dan hide ik de hele footer maar gewoon.

Cascading Stylesheet:

.footer-top {display:none!important}

[Help!!!!]

^
Thx! Dit werkt

[ Voor 7% gewijzigd door Help!!!! op 31-03-2026 08:43 ]

[Turismo]

Wellicht dat je mijn snippet wat vind, die behoud de footer nog enigzins, echter valt die meer netjes weg zoals het hoort.

Lightweight Footer dark grey

[Noxious]

Anderen hier ook wel eens last van 'hostile CSS'?

Een gebruiker heeft laatst z'n CSS snippet aangepast om de hele site knalroze te maken:
https://tweakers.net/inst...mcss/snippets/bekijk/130/

Daar was ik dus op geabonneerd weet niet eens wat het oorspronkelijk was.

Een berichtje gestuurd met dat dat geen leuke grap is; een lekker toxic antwoord terug gekregen ('cry about it').

Dat heb ik nog niet eerder meegemaakt op t.net..

[jack zomer]

Noxious schreef op vrijdag 17 april 2026 @ 12:00:
Anderen hier ook wel eens last van 'hostile CSS'?

Een gebruiker heeft laatst z'n CSS snippet aangepast om de hele site knalroze te maken:
https://tweakers.net/inst...mcss/snippets/bekijk/130/

Daar was ik dus op geabonneerd weet niet eens wat het oorspronkelijk was.

Een berichtje gestuurd met dat dat geen leuke grap is; een lekker toxic antwoord terug gekregen ('cry about it').
Dat heb ik nog niet eerder meegemaakt op t.net..

https://gathering.tweaker...message/85086056#85086056
we hadden last van het zelfde. ik had geel en zwart.
De tweakers crew is er mee bezig.

[Noxious]

jack zomer schreef op vrijdag 17 april 2026 @ 14:42:
[...]


https://gathering.tweaker...message/85086056#85086056
we hadden last van het zelfde. ik had geel en zwart.
De tweakers crew is er mee bezig.

Aha, dankjewel! Dat topic had ik gemist (had nog wel gezocht!). Vervelend inderdaad; wat een naar gedrag.

[jack zomer]

Noxious schreef op vrijdag 17 april 2026 @ 12:00:
weet niet eens wat het oorspronkelijk was.

ik weet het ook niet meer. het was toen der tijd handig.
Maar ik heb al mijn ccs (blijkbaar had ik er 5) verwijdert.

Want nu het 1 keer is gebeurd, kan het zomaar zijn dat het nog een keer gebeurd.
Jammer dat het zo is, misschien had de maker van de ccs een slechte dag )@alex3305
Dat het niet verwacht van een 14k reactie tweaker. maar goed les geleerd.

[mindwarper]

Hallo allemaal

ik heb al langer een CSS snippet willen maken die alle Shops in PriceWatch met ≤3 rating - een vorm van Rood maakt en wat EXTRA functies meegeeft gelijk...
Ook om anderen te helpen goede overwogen keuze te maken om wel of niet te bestellen daar - altijd persoonlijke keuze!

Dat heb ik gedaan op deze manier:

• Op basis van <li data-shop-id> en waar nodig ook tegelijk <a href*="shop-id=">
• Bovendien dan ook verder in zelfde <li> - op basis van <twk-star-rating title=>, waarbij "Geen shopreviews" dan niet wordt meegenomen...
• Daarnaast dan ook verder in zelfde <li> - op basis van zelfde <twk-star-rating data-score=>, waarbij dan ale ratings van 0 tot kleiner of gelijk 3 (met halve stappen ertussen) worden meegenomen voor CSS styling
  Het is misschien op een onorthodoxe manier, maar ik moet dat doen omdat ik ook nog andere CSS snippets gebruik waardor het anders om zeep geholpen wordt...

Dan nu styling effecten zelf:

• Voor de shop naam een bouncing (elke 2s) goudkleurig waarchuwingssymbool
• Waarschuwingssymbool gebruikt:
  https://www.w3schools.com/cssref/css_entities.php - CSS ID 26A0
• No breaking space gebruikt:
  https://www.w3schools.com/cssref/css_entities.php - CSS ID 00A0
• Een vorm van rood shop naam
• Bij hover de background check-out button in andere rode kleur met opacity
• Shop Tagline Title in een wat andere passende rode kleur ook en wat gespeeld met met passende opacity niveaus
• dan nog wat kleine andere effectjes

Werkt het beste uitsluitend op TWK NEW Dark - dat is wat ik gebruik ook i.c.m. met eigen hele grote CSS snippet voor overige kleur veranderingen - deze:
Tweakers NEW Dark | Links colour + Other Customisations

En voor deze snippet voor shops met ≤3 rating - Snippet URL is deze:
Shops met ≤3 rating - Licht Rood en EXTRA Functies voor TWK NEW Dark

ook deze van mijzelf heb ik in gebruik:
Oude Moderatie kleuren - ALERNATIEF - Tweakers NEW Dark

Screenshots komen wellicht later wel - nu overdue avondeten maken
ik moet even kijken hoe ik een GIF kan toevoegen

GIF toegevoegd - het is te zien hoe het waarschuwingssymbool springt in oude en nieuwe kleurstelling...

edit:
Andere kleurstelling gebruikt en gespeeld met opacity ook...
en specifiek voor TWK NEW Dark gecodeerd
Nieuwe GIF geplaatst + nieuwe screenshot ook

OUD:


NIEUW:


En hier een screenshot van de Hover functie bij Bekijk clickout button...
En o ja die van Megekko - is ook een CSS van mij - Heb die doorgestreept voor mij overwegende redenen (andere discussie hahaha )

OUD:


NIEUW:

[ Voor 49% gewijzigd door mindwarper op 24-04-2026 11:57 . Reden: Nieuwe setup uitgelegd & nieuwe plaatjes toegevoegd ]

[Meg]

Heeft iemand een CSS snippet om het oude lettertype (of deze weer op een normale grote i.p.v. standje 'een blind persoon kan dit lezen' te krijgen?

[Onbekend]

Meg schreef op vrijdag 22 mei 2026 @ 11:35:
Heeft iemand een CSS snippet om het oude lettertype (of deze weer op een normale grote i.p.v. standje 'een blind persoon kan dit lezen' te krijgen?

Ik kreeg het probleem niet met CSS opgelost. Ik heb nu de Firefox-extension "Stylus" geïnstalleerd. Voor Tweakers.net heb ik het volgende ingesteld:

code:

@font-face {
  font-family: "Roboto Flex";
  src: local("Arial");
}

Op zich wel handig dat het niet in mijn standaard CSS zit, want dan kan ik het af-en-toe gemakkelijk uitzetten om te zien of er een verbetering is.

[Meg]

Onbekend schreef op vrijdag 22 mei 2026 @ 19:17:
[...]

Ik kreeg het probleem niet met CSS opgelost. Ik heb nu de Firefox-extension "Stylus" geïnstalleerd. Voor Tweakers.net heb ik het volgende ingesteld:

code:

@font-face {
  font-family: "Roboto Flex";
  src: local("Arial");
}

Op zich wel handig dat het niet in mijn standaard CSS zit, want dan kan ik het af-en-toe gemakkelijk uitzetten om te zien of er een verbetering is.

Hopelijk kan iemand dit met CSS fixen.

[Meg]

Als het goed is zou het moeten werken met deze snippet: Vervang Roboto Flex voor Arial met de oude grote