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

[Caelorum]

Madrox schreef op zondag 21 oktober 2012 @ 05:18:
Kom maar op met die code

ps: Hoorde btw. over die klachten dat er zoveel code werd gepost, zit ineens te denken; waarom kunnen we die code niet achter een spoiler verstoppen, zoals je wel ziet bij hints etc. van games. Gewoon een spoiler tag, die uiteraard uit en inklapbaar is ?

Omdat de code dan de opmaak mist?
Zelf verbaas ik mij er al een aantal jaar over dat tweakers niet een codetag heeft die je optioneel kan beperken tot een aantal regels bijv. 15 ofzo. en een codetag in een spoilertag werkte in ieder geval in Tweakers 6 niet.

[Soul__assasin]

geen idee waarom... maar dit

[code]/* Eigen bericht highlighten */
#messages div.message .ownpost{
background-color: #F2F5A9 !important;
} [/code]

werk dus helemaal niet bij mij...


werkt dus wel... ik was dom :-)

[ Voor 10% gewijzigd door Soul__assasin op 21-10-2012 08:54 ]

[QwaftZefoni]

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 18:29:
Inmiddels is versie 1.0.5 van Tweakers 7.5 geland, met als wijzigingen:

_Excellente_ is wat het is.

Maar, ik krijg het niet voor elkaar om hier de tracker links en fixed naast de content (dus in het grijs) te zetten, en dan ook met zo'n mooie shadow border. Hij wil binnen de content ruimte blijven op een of andere manier?

//edit: dat zal overflow: hidden; wel zijn geweest. Heb delen van je code gebruikt. Later maar 'ns kijken of ik meer kan gebruiken want nette opmaak!

[ Voor 15% gewijzigd door QwaftZefoni op 21-10-2012 09:21 ]

[PierreAronnax]

Verwijderd schreef op zondag 21 oktober 2012 @ 00:35:
Is er al een mogelijkheid om de tracker op de FP weer te geven middels Greasemonkey op een beeldscherm van 1280x?

Ik gebruik onderstaand script, deze toont de tracker altijd ongeacht de scherm resolutie aan de linker kant van het scherm, terwijl alles gecentreerd blijft. Ik heb de 'content' breedte niet eens hoeven verkleinen, het paste makkelijk.

JavaScript:

// ==UserScript==
// @name        Tweakers
// @include     http*://tweakers.net/*
// @include     http*://*.tweakers.net/*
// @grant       none
// ==/UserScript==

// Make room for Tracker
document.getElementById('contentArea').style.paddingLeft = '260px'; 

// Show Tracker
unsafeWindow.getPageDimensions = function() { 
    return 0;
};
initTrackerOnLoad('l');  

// Set Tracker width
var popup = PopupGenerator.get('trackerPopup'); 
popup.element.style.width = '250px';

// Hide 'Fixeer rechts'
document.getElementById('trackerFixateLink').style.display = 'none';

[Matis]

Ik heb zojuist een update van mijn custom CSS gemaakt, waarmee je eenvoudig kunt zien of je zelf de laatste bent geweest die in een topic gereageerd heeft

Cascading Stylesheet:

td.topic a[title*="Matis"]
{ 
background-color: yellow; 
}

De URL naar het topic wordt geel gemaakt indien jouw naam in het title atrribuut terugkomt.

Natuurlijk wel even je eigen naam aanpassen

Edit; Ik weet dat wontcachme in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'" ongeveer hetzelfde heeft gedaan qua highlighting, maar ik heb een wildcard gebruikt (de *, zodat je niet afhankelijk bent van eventuele wijzigingen in de title.

[ Voor 26% gewijzigd door Matis op 21-10-2012 10:23 ]

[jmxd]

Goed bezig Blue-eagle

[_eXistenZ_]

Kleine sneak preview voor Tweakers 7.5 versie 1.1
^{nouja, tis eigenlijk al af maar ik zet in een losse versie zo eerst nog wat bugfixes online}:

<plaatje verwijderd naar de post waarin ik 1.1.0 release>

Wil je ook de inline tracker, dan is het dus noodzakelijk om mijn theme als userscript te gaan draaien vanaf versie 1.1, aangezien ik dat ding uitlees en opbouw met javascript.

Straks vers van http://userscripts.org/scripts/show/150491 te halen

/edit

Ik vind de oplossing van PierreAronnax ook erg sjiek!
Wellicht is die nog beter, dan kan de tracker gewoon er altijd naast!
/edit
Die clasht helaas met hoe ik al paddings gebruik in de layout, waardoor het er niet echt mooier op wordt. In een vrij stock layout is het iig een goede oplossing!

[ Voor 31% gewijzigd door _eXistenZ_ op 21-10-2012 15:13 ]

[Hmmbob]

Jo... schreef op zaterdag 20 oktober 2012 @ 22:14:
Hoe mijn Tweakers eruit ziet:

[afbeelding]

Er is eigenlijk weinig veranderd, gewoon een donkerdere achtergrond en een scheiding tussen de content en die achtergrond.
Ik vond Tweakers 7 eigenlijk niet zo verschrikkelijk, buiten de witte achtergrond. Met deze aanpassing is het voor mij dus prima.

De CSS: (Die ik i.c.m. Stylish gebruik)

Cascading Stylesheet:

...

Ik heb het niet helemaal zelf geschreven (Ik heb me al lang niet meer beziggehouden met CSS), ik had het gevonden op het forum, en heb dan zelf nog wat aanpassingen gemaakt. (Vooral wat zaken verwijderd, om Tweakers 7 zo weinig mogelijk te veranderen)

Dank man! Ik heb geen behoefte om de hele site te verbouwen: dit is precies wat ik zocht, zo kan ik verder prima leven met de nieuwe layout. Thanks!

[Tk55]

@_eXistenZ_

Van mij mag het lijntje tussen het rood en het grijs (van de achtergrond) wel op gelijke hoogte met de onderkant van de menubalk, dat ziet er net wat strakker uit. Verder echt een top thema!

[Jo...]

Groentenboer schreef op zondag 21 oktober 2012 @ 13:00:
[...]
Dank man! Ik heb geen behoefte om de hele site te verbouwen: dit is precies wat ik zocht, zo kan ik verder prima leven met de nieuwe layout. Thanks!

Graag gedaan!
Ik heb nog even een detail toegevoegd. Als je bijvoorbeeld wou uitloggen, was het deel onder het "uitlogformulier" wit. Nu, met de nieuwe versie, is het ook grijs. (Zoals de rest van de achtergrond.)

Cascading Stylesheet:

body {
background-color: #444;
}

div#contentArea {   
    background-color: #FFF;   
    border: 20px solid #FFF;  
    box-shadow: 0 5px 12px black;   
}   

#layout { 
    background-color: #444;       
}  

#bottom div.hr {  
    height:0px;  
}  


h1, h2 { 
    color: #C50000; 
} 

.fancyButton { 
    border-radius: 2px; 
} 

.imageContainer img {opacity: 0.8;} 
.imageContainer:hover img {opacity: 1.0;} 

}

[Damic]

@_eXistenZ_ nice man dirct geïnstalleerd , vele rustiger alleen zit nog een foutje in de reclame vacatures, de box word afgekapt

[ Voor 40% gewijzigd door Damic op 21-10-2012 13:26 ]

[_eXistenZ_]

Tk55 schreef op zondag 21 oktober 2012 @ 13:11:
@_eXistenZ_

Van mij mag het lijntje tussen het rood en het grijs (van de achtergrond) wel op gelijke hoogte met de onderkant van de menubalk, dat ziet er net wat strakker uit. Verder echt een top thema!

Meh, dan vond ik m saai worden, heb juist extra effort er in gestopt om dit zo te houden, dat andere was zelfs makkelijker Thx iig

[Joen]

Ik vind die van _eXistenZ_ ook wel prettig, dus gelijk maar ingesteld.

[Blue-eagle]

En als iemand anders ook mijn layout wilt gebruiken, hierbij de code, zelf te installeren

Getest in Chrome.

CSS voor gebruik met de Stylish plugin: http://pastebin.com/yyRnvrGD
JS voor gebruik met Tampermonkey: http://pastebin.com/mQb7CYuT

Bovenin de CSS file kan je zelf kiezen tussen een aantal full-page backgrounds. Gewoon de "a" bij "background-image" weghalen en bij de huidige background-image (zonder a) even toevoegen, of commentariseren, whatever

Edit: profielpagina/tabs fix in CSS.

[ Voor 4% gewijzigd door Blue-eagle op 21-10-2012 14:36 ]

[josvane]

Ik probeer nu de kleuren terug te krijgen in het forum, maar ik snap duidelijk de werking van nth-child nog niet. Volgens mij moet het hiermee kunnen. Jammer dat de devvers, niet een class toegevoegd hebben per catagorie.

[KroontjesPen]

_eXistenZ_ schreef op zondag 21 oktober 2012 @ 12:39:
Kleine sneak preview voor Tweakers 7.5 versie 1.1
^{nouja, tis eigenlijk al af maar ik zet in een losse versie zo eerst nog wat bugfixes online}:

[afbeelding]

Wil je ook de inline tracker, dan is het dus noodzakelijk om mijn theme als userscript te gaan draaien vanaf versie 1.1, aangezien ik dat ding uitlees en opbouw met javascript.

Straks vers van http://userscripts.org/scripts/show/150491 te halen

/edit

Ik vind de oplossing van PierreAronnax ook erg sjiek!
Wellicht is die nog beter, dan kan de tracker gewoon er altijd naast!
/edit
Die clasht helaas met hoe ik al paddings gebruik in de layout, waardoor het er niet echt mooier op wordt. In een vrij stock layout is het iig een goede oplossing!

De GoT start pagina is mooi zo.
De topics zijn niet centrum uitgelijnd. Daardoor aan de rechterkant nu een brede strook wit.
Dat is er weer niet in de reactiepagina van het forum.

Zelf wil ik nu de leuke tips van anderen erbij kunnen zetten. Alleen geen idee waar dat script door Greasemonkey wordt opgeslagen.

Edit 1
Zie nu ook dat de kleur weg is bij je eigen posts.

Edit 2
Toch terug naar Tweakers 7.0 Grey & Compacted gegaan.

[ Voor 4% gewijzigd door KroontjesPen op 21-10-2012 14:19 ]

[yannickie111]

Blue-eagle schreef op zondag 21 oktober 2012 @ 13:33:
[afbeelding]

En als iemand anders ook mijn layout wilt gebruiken, hierbij de code, zelf te installeren

Getest in Chrome.

CSS voor gebruik met de Stylish plugin: http://pastebin.com/5e5TnavM
JS voor gebruik met Tampermonkey: http://pastebin.com/mQb7CYuT

Bovenin de CSS file kan je zelf kiezen tussen een aantal full-page backgrounds. Gewoon de "a" bij "background-image" weghalen en bij de huidige background-image (zonder a) even toevoegen, of commentariseren, whatever

Mooi!
Alleen (bijvoorbeeld in je profiel) is er nu geen verschil meer tussen linkjes en niet-linkjes.
Kun je dat nog veranderen? Dan ga ik hem gebruiken

[Blue-eagle]

yannickie111 schreef op zondag 21 oktober 2012 @ 14:03:
[...]


Mooi!
Alleen (bijvoorbeeld in je profiel) is er nu geen verschil meer tussen linkjes en niet-linkjes.
Kun je dat nog veranderen? Dan ga ik hem gebruiken

Ow die pagina is nu wel heel erg lelijk inderdaad Ga hem straks wel fixen

[yannickie111]

Blue-eagle schreef op zondag 21 oktober 2012 @ 14:24:
[...]

Ow die pagina is nu wel heel erg lelijk inderdaad Ga hem straks wel fixen

Dan hoor ik het straks wel, lijkt me maar een kleine aanpassing, maar een groot plezier.

[Blue-eagle]

yannickie111 schreef op zondag 21 oktober 2012 @ 14:27:
[...]


Dan hoor ik het straks wel, lijkt me maar een kleine aanpassing, maar een groot plezier.

Fixed: http://pastebin.com/yyRnvrGD

[Verwijderd]

PierreAronnax schreef op zondag 21 oktober 2012 @ 09:15:
[...]


Ik gebruik onderstaand script, deze toont de tracker altijd ongeacht de scherm resolutie aan de linker kant van het scherm, terwijl alles gecentreerd blijft. Ik heb de 'content' breedte niet eens hoeven verkleinen, het paste makkelijk.

JavaScript:

// ==UserScript==
// @name        Tweakers
// @include     http*://tweakers.net/*
// @include     http*://*.tweakers.net/*
// @grant       none
// ==/UserScript==

// Make room for Tracker
document.getElementById('contentArea').style.paddingLeft = '260px'; 

// Show Tracker
unsafeWindow.getPageDimensions = function() { 
    return 0;
};
initTrackerOnLoad('l');  

// Set Tracker width
var popup = PopupGenerator.get('trackerPopup'); 
popup.element.style.width = '250px';

// Hide 'Fixeer rechts'
document.getElementById('trackerFixateLink').style.display = 'none';

[afbeelding]

Thanks werkt goed . Alleen op een of andere manier sluit de layout niet meer goed aan daar moet ik ff nog naar kijken .

[_eXistenZ_]

Tweakers 7.5 - v1.1.0 is gearriveerd

Bugfixes:

• Fix voor de shadow op pagina's met een hoge header (o.a. hier)
• Fix voor karma wat door de zoekbalk heen gerenderd werd (o.a. hier)
• Je eigen posts werden niet gehighlight als dat aanstond in je profiel, nu wel weer

Features:

• Inline tracker op de front page. Het is nog steeds mogelijk de tracker links van de layout te fixeren zodat deze op andere pagina's dan de FP ook beschikbaar is, maar voor mensen die het fijn vinden (of mensen met een kleiner scherm waardoor de tracker als deze links gefixeerd staat niet wordt weergegeven)

Todo:

• Ik ga nog even kijken naar de mogelijkheid om te detecteren dat je de tracker rechts gefixeerd hebt, en in plaats daarvan de inline tracker aan te zetten.
  Als je dan de tracker links gefixeerd hebt toon ik de inline tracker niet

As always, de aanbevolen methode is het userscript runnen, als je die niet draait heb je geen inline tracker op de front page. Get it while it's hot:

Het UserScript voor mensen die dit script (in Greasemonkey) willen draaien
De source voor mensen die alleen de CSS willen

[ Voor 4% gewijzigd door _eXistenZ_ op 21-10-2012 15:15 ]

[_eXistenZ_]

Vraag aan hele community m.u.v. Twylight: Ik fix aardig veel updates / bugfixes / aanvragen van GoT op mijn theme, moet ik het minder aankondigen iig? As always, mensen die het netjes vragen, worden gehoord

[ Voor 16% gewijzigd door _eXistenZ_ op 21-10-2012 15:12 ]

[KroontjesPen]

_eXistenZ_ schreef op zondag 21 oktober 2012 @ 15:08:
Vraag aan hele community m.u.v. Twylight: Ik fix aardig veel updates / bugfixes / aanvragen van GoT op mijn theme, moet ik het minder aankondigen iig? As always, mensen die het netjes vragen, worden gehoord

Pas als een modje het verzoek is het vroeg zat.

[Verwijderd]

@_eXistenZ mooi werk van die inline tracker. Heb je daar ook de losse JS code van voor Greasemonkey?

[bbr]

_eXistenZ_ schreef op zondag 21 oktober 2012 @ 15:08:
Vraag aan hele community m.u.v. Twylight: Ik fix aardig veel updates / bugfixes / aanvragen van GoT op mijn theme, moet ik het minder aankondigen iig? As always, mensen die het netjes vragen, worden gehoord

Updates zijn altijd welkom.
Als het "heel kleine" dingetjes zijn kan je misschien gewoon het screenshot editten of updaten.
Maar afgezien daarvan, gewoon die gast negeren.

[yannickie111]

Blue-eagle schreef op zondag 21 oktober 2012 @ 14:36:
[...]


Fixed: http://pastebin.com/yyRnvrGD

Op de pagina voorkeuren valt ook nog het een en ander te fixen
https://secure.tweakers.net/my.tnet/preferences

[Bremg]

Blue-eagle schreef op zondag 21 oktober 2012 @ 14:36:
[...]


Fixed: http://pastebin.com/yyRnvrGD

Zeker de mooiste versie tot nu toe!

Er zit alleen nog een fout bij de pricewatch, er valt text weg aan de bovenkant..

[Blue-eagle]

Bedankt voor die reports, ik gebruik zelf alleen de FP+GoT, ik zal nu ook de rest maar eens gaan bekijken

[Verwijderd]

PierreAronnax schreef op zondag 21 oktober 2012 @ 09:15:
[...]


Ik gebruik onderstaand script, deze toont de tracker altijd ongeacht de scherm resolutie aan de linker kant van het scherm, terwijl alles gecentreerd blijft. Ik heb de 'content' breedte niet eens hoeven verkleinen, het paste makkelijk.

JavaScript:

// ==UserScript==
// @name        Tweakers
// @include     http*://tweakers.net/*
// @include     http*://*.tweakers.net/*
// @grant       none
// ==/UserScript==

// Make room for Tracker
document.getElementById('contentArea').style.paddingLeft = '260px'; 

// Show Tracker
unsafeWindow.getPageDimensions = function() { 
    return 0;
};
initTrackerOnLoad('l');  

// Set Tracker width
var popup = PopupGenerator.get('trackerPopup'); 
popup.element.style.width = '250px';

// Hide 'Fixeer rechts'
document.getElementById('trackerFixateLink').style.display = 'none';

[afbeelding]

Enig idee wat hier verkeer gaat? Of andere JS kenners . Ik heb geprobeerd om menubar meer px te geven in het script maar dat verschuift het probleem alleen maar.


zwart boven = menubar
donker grijs = layout
licht grijs = content area
zwart onder = trackter

[Tk55]

Ik snap Twylight ook wel, dat komt omdat _eXistenZ_ eerst aankondigd dat z'n nieuwste versie bijna af is en 'm een paar uur later post. Dat levert 2 relatief lange posts die vrijwel hetzelfde zijn, wat gewoon vervelend is voor mensen die niet elk half uur hier kijken. Ik vind het aankondigen ook een beetje overdreven, dat hoef je niet per sé te doen. Maar ach, zeuren he

Trouwens _eXistenZ_, in plaats van:

Cascading Stylesheet:

fpaItem div.textContainer {
     background-color: #000;
     opacity: 0.8;
}

kun je beter dit doen:

Cascading Stylesheet:

.fpaItem div.textContainer {
     background: rgba(0, 0, 0, 0.8);

Zo blijft de tekst ondoorzichtig bij de speciale items.

[ Voor 3% gewijzigd door Tk55 op 21-10-2012 15:34 ]

[_eXistenZ_]

Omg ja die stond nog op men lijstje, de enige oplossing die ik zo snel wist was oldskool met een transparente PNG

* _eXistenZ_ weet ook niet alles

Thx iig, ik pas het aan, en zal proberen niet elke 2 uur updates te plaatsen, of anders toch met wat minder plaatjes er tussen zodat ik het topic niet te hard overspoel

[Hero of Time]

Als je een 'nieuwe' versie hebt van je tweak, noem dan alleen de aanpassing met een changelog. Ga geen boekwerk schrijven met tig plaatjes en spammen naar je off-site styles, doe het gewoon allemaal in 1 post en link daar telkens heen.

[_eXistenZ_]

Twylight compleet negerend heb ik het nu ook van een andere user gehoord (op een vriendelijke toon, waar ie wat mee bereikt) dus ik ga proberen iets minder enthausiast alle updates te melden, of toch tenminste zonder zoveel plaatjes

/edit

Hero of Times, daar kan ik me ook prima in vinden ja Of denk je dat ik mss beter gewoon een eigen topic kan starten? Volgens mij is mijn style inmiddels zoals gezegd vrij veel gebruikt, wellicht dat dat practischer is? Kan ik ook mijn creatieve ei kwijt.

[ Voor 37% gewijzigd door _eXistenZ_ op 21-10-2012 15:54 ]

[cpt.skydiver]

Cssje om de frontpage afbeeldingen rechts in de zijbalk te zetten.

Komt ook (als optie) in mijn userstyle.

code:

    #fpaItems {
        float:right;
        width:336px!important;
    }

    #fpaItems .fpaItem {
        height:auto!important;
        width:168px!important;
    }
    
    #fpaItems .fpaItem .imageContainer {
        width:167px!important;
    }
    
    #fpaItems .fpaItem img {
        height:84px!important;
        width:168px!important;
    }
    
    #fpaItems .fpaItem div.textContainer {
        font-size:12px!important;
        line-height:15px!important;
        padding:5px 10px!important;
        border-bottom:1px solid #FFF;
    }

[ Voor 6% gewijzigd door cpt.skydiver op 21-10-2012 17:47 . Reden: Kleine fix zodat de afbeeldingen op de review pagina niet worden aangepast ]

[josvane]

Het is begin voor de forum kleuren, vanavond ga ik hem verder verbeteren. Helaas heb je wel een recente browser nodig.

code:

/* Forum */
.channelHeader{display:none;}

.forumList:nth-child(3) table.listing tr th{
background:#b80008;
}
.forumList:nth-child(4) table.listing tr th{
background:#452560;
}
.forumList:nth-child(5) table.listing tr th{
background:#1ba500;
}
.forumList:nth-child(6) table.listing tr th{
background:#ff5a00;
}
.forumList:nth-child(7) table.listing tr th{
background:#00c69e;
}

[Hero of Time]

Maak dan een blog aan om alles te beschrijven. Dump de link in je sig en klaar. Als mensen interesse hebben, gaan ze daar wel heen. Wie de wijzigingen wil zien, gaan naar je blog. Updates komen automatisch zit je telkens te zeggen, dus laat dit dan over aan mensen die niet elk uur een pixel hebben aangepast of een item op een ander plekje zetten.

[Caelorum]

_eXistenZ_ schreef op zondag 21 oktober 2012 @ 15:53:
Twylight compleet negerend heb ik het nu ook van een andere user gehoord (op een vriendelijke toon, waar ie wat mee bereikt) dus ik ga proberen iets minder enthausiast alle updates te melden, of toch tenminste zonder zoveel plaatjes [...]

Ahhh... Ben ik net te laat met vriendelijk reageren?
Ik wilde net zeggen dat ik het wel met hem eens was, maar dat zijn toon echt nergens op slaat. Overigens wat mij betreft zet je een Tweakblog op. Dan kan je hier elke 1-2 dagen een korte updateje plaatsen en verwijzen naar je blog. Kunnen we daar ook mooi verder discussieren

Overigens zou ik het fijn vinden als je in je CSS iets meer commentaar opneemt. Dan wordt het geheel wel wat meer verbose, maar is het makkelijker kleine dingen er uit over te nemen. Zoals bijv. een stukje CSS dat *alleen* maar die plaatjes op de frontpage naar rechts verplaatst.
Een mooi voorbeeld van iemand die het wel heeft gedaan: wontcachme in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"

[Hero of Time]

Commentaar in je CSS ftw. Dat heb ik bij mijn update ook gedaan en nog voeg ik dingen toe. Het boeit niet dat je wat regeltjes meer krijgt. Als je iets wilt delen, dan voorzie je je werk van goed commentaar.

[Verwijderd]

Modbreak gewenste breedte (Thnx Darkstone) en in het midden centreren. Als ik het net zo breed maak als de Quickreply box dan loopt de modbreak buiten het veld bij uitgebreid reageren vandaar dus centreren .

Cascading Stylesheet:

fieldset.modbreak {
    margin: auto !important;
    width: 650px;
}

[_eXistenZ_]

Zeker, ik ga er naar kijken of ik het wat kan verduidelijken

[radial]

@_eXistenZ_ perfect script hoe het eigenlijk zou moeten zijn, bedankt!

Zou je bij je het userscript het volgende toe kunnen/willen voegen (anders moet ik het elke keer handmatig aanpassen bij een update)

// @include https://tweakers.net/*
// @include https://gathering.tweakers.net/*

[ Voor 11% gewijzigd door radial op 21-10-2012 16:15 ]

[Yorinn]

cpt.skydiver schreef op zondag 21 oktober 2012 @ 15:56:
Cssje om de frontpage afbeeldingen rechts in de zijbalk te zetten.

Komt ook (als optie) in mijn userstyle.

[afbeelding]

code:

#fpaItems {
        float:right;
        width:336px!important;
    }

    .fpaItem {
        height:auto!important;
        width:168px!important;
    }
    
    .fpaItem .imageContainer {
        width:167px!important;
    }
    
    .fpaItem img {
        height:84px!important;
        width:168px!important;
    }
    
    .fpaItem div.textContainer {
        font-size:12px!important;
        line-height:15px!important;
        padding:5px 10px!important;
        border-bottom:1px solid #FFF;
    }

Bedankt, maar die werkt niet 100%. Ik krijg naast die FP-items een hele witruimte, ipv. de nieuwsberichten.

[cpt.skydiver]

Yorin schreef op zondag 21 oktober 2012 @ 16:17:
[...]


Bedankt, maar die werkt niet 100%. Ik krijg naast die FP-items een hele witruimte, ipv. de nieuwsberichten.

Welke browser? In Chrome/Firefox werkt ie prima.

[Yorinn]

cpt.skydiver schreef op zondag 21 oktober 2012 @ 16:18:
[...]


Welke browser? In Chrome/Firefox werkt ie prima.

In Chrome v24.0

Ook in IE 10 hetzelfde probleem. Ik browse in Full HD.

[ Voor 13% gewijzigd door Yorinn op 21-10-2012 16:21 ]

[Verwijderd]

Nog een handige tweak:

code:

/* maak CSS edit ding veel breder. Voeg extra hoogte toe naar wens */
#StylesettingsContainer > textarea{
    position: relative;
    left: -115px;
    width: 890px !important;
    border: 2px solid rgb(195, 198, 198);
}

Maakt het CSS edit veld een stuk breder. Nu test ik met een lokaal bestand en wat @imports. Dit werkt toch even wat fijner... evt nog breder maken als je fullscreen browset (ik gebruik een 900px brede setup).

Helpt de kleuren op de pagina wel semi om zeep. Maar dat zal me een worst wezen.

[ Voor 8% gewijzigd door Verwijderd op 21-10-2012 16:20 ]

[cpt.skydiver]

Yorin schreef op zondag 21 oktober 2012 @ 16:19:
[...]


In Chrome v24.0

Ik heb hier alleen een Chrome v22 (laatste stable). Dus ik denk dat het door v24 komt of door een van je andere css tweaks.

[Hahn]

Yorin schreef op zondag 21 oktober 2012 @ 16:19:
[...]


In Chrome v24.0

Ook in IE 10 hetzelfde probleem. Ik browse in Full HD.

Geen dev/beta gebruiken van Chrome?

[ Voor 12% gewijzigd door Hahn op 21-10-2012 16:23 ]

[Yorinn]

v24 is Chrome Dev. Maar ik heb de boosdoener gevonden en die verwijdert. Het was onderstaande CSS:

code:

/* Content andere pagina's breder */ 
.mainColumn { width: 666px !important; } 
.secondColumn { width: 290px !important; } 
#pricewatch input.text { width: 200px !important; } 
#social .twitterButton, 
#social .facebookButton { width: 142px !important; } 
#social .twitterButton a { background-position: 10px center !important; } 
#social .facebookButton a { background-position: 15px center !important; } 

.relevancyColumn { display: none !important; } 
.articleColumn { width: 850px !important; }

.extra_39134264 {display: always !important; }

[Verwijderd]

Een tijd geleden plaatste ik een 900px brede stijlsheet. Die had nogal wat side effects. Dus hier een schone versie.

Te testen met:

code:

@import url( ... );

Let op: @import is trage meuk. Als je dit langer wilt gebruiken is het slimmer om de CSS te copy-pasten in je voorkeuren.

900px breed layout

• Wat doet het?
Maakt de GoT layout 900 pixels breed. Handig voor als je 2 vensters naast elkaar wilt hebben. Geen horizontale scrollbalken met uitzondering van het fotoalbum en forums met bepaalde productkoppelingen.

• URL
https://dl.dropbox.com/u/...ease/900px%20CSS%20v1.css

inklapbare footer

• wat doet het?
Klapt de footer in totdat je er met je muis overheen gaat. Waardoor je 150px ruimte wint.

• URL
https://dl.dropbox.com/u/....0/CSS-release/footer.css

Tabs omhoog

• Wat doet het?
Plaatst de tabs omhoog. Naast ze zoekbalk.


• URL
https://dl.dropbox.com/u/...S-release/tabs-omhoog.css
Alleen getest met 900px breed. Maar zal zonder ook wel werken.

minimale hoogte header

• Wat doet het?
verwijdert alle padding in de header inclusief de rode balk.


• URL
https://dl.dropbox.com/u/...maal-verticaal-header.css
Let op: alleen te gebruiken icm 'tabs omhoog'

[ Voor 52% gewijzigd door Verwijderd op 21-10-2012 16:58 ]

[_eXistenZ_]

radial schreef op zondag 21 oktober 2012 @ 16:15:
@_eXistenZ_ perfect script hoe het eigenlijk zou moeten zijn, bedankt!

Zou je bij je het userscript het volgende toe kunnen/willen voegen (anders moet ik het elke keer handmatig aanpassen bij een update)

// @include https://tweakers.net/*
// @include https://gathering.tweakers.net/*

Thx!

Stop ik er gelijk even in, zodat via HTTPS ook goed verloopt. Thx voor het melden

@ iedereen, ik ben vanaf nu te volgen via Tweakers 7.5 changelog, zodat ik niet maximaal grote updates hoef te plaatsen met een hoop plaatjes, maar het bij één linkje kan houden

[cpt.skydiver]

Kleine fix gedaan voor de sidebar afbeeldingen.. de items op de review pagina werden per ongeluk ook verkleind. Code in originele post is aangepast. Klik!

[ Voor 58% gewijzigd door cpt.skydiver op 21-10-2012 17:48 ]

[Tk55]

Lekker compact en duidelijk. Ik ben tevreden! Maar ik ben erg benieuwd naar jullie meningen.

CSS code:
http://pastebin.com/21rL3dd4

[ Voor 9% gewijzigd door Tk55 op 22-10-2012 11:21 ]

[Blue-eagle]

Voor mensen die mijn stijl gebruiken een kleine update voor de pricewatch, V&A en het profiel:

http://pastebin.com/UAhk74qi

[Yorinn]

Tk55 schreef op zondag 21 oktober 2012 @ 18:40:
[afbeelding]

Lekker compact en duidelijk. Ik ben tevreden! Maar ik ben erg benieuwd naar jullie meningen.

Wat is jouw code om die duidelijkheid bij artikelen te krijgen? Dus zwart bij ongelezen en grijs bij wel gelezen?

[Jo...]

Yorin schreef op zondag 21 oktober 2012 @ 20:08:
[...]


Wat is jouw code om die duidelijkheid bij artikelen te krijgen? Dus zwart bij ongelezen en grijs bij wel gelezen?

Cascading Stylesheet:

.frontPageLink { 
    color: black;  
    font-weight:bold;
} 

.frontPageLink:visited {  
    color: grey; 
    font-weight:bold:
}

Dat zou moeten werken.

[TimvH]

Tk55 schreef op zondag 21 oktober 2012 @ 18:40:
[afbeelding]

Lekker compact en duidelijk. Ik ben tevreden! Maar ik ben erg benieuwd naar jullie meningen.

Ziet er zeker mooi uit

[Verwijderd]

Heb het een en andere gesleuteld aan verschillende CSSjes en die bij elkaar gezet. Ik ga niet de hele CSS plaatsen (wel een linkje), maar wel een klein stukje over de posts bij nieuwsitems:

Cascading Stylesheet:

.reactionRatingFilterPopup {
    margin: 4px !important; padding: 0px;
    background: #444;
    padding-left: 10px;
    padding-top: 7px;
    border: 1px solid #777;
}

.modFilter span.reactionCount.score-1 {
    margin: 4px !important; padding: 3px;
}

.modFilter span.reactionCount.score0 {
    margin: 4px !important; padding: 3px;
}

.modFilter span.reactionCount.score1 {
    margin: 4px !important; padding: 3px;
}

.modFilter span.reactionCount.score2 {
    margin: 4px !important; padding: 3px;
}

.modFilter span.reactionCount.score3 {
    margin: 4px !important; padding: 3px;
}

.reactieHeader .usericonsmall { display: none; }
.reactieHeader br { display: none; }
.reactieHeader a { font-size: 12px !important; margin-right: 10px; }

.minmaxreacties {
    float: left; display: inline-block;
    position: relative; top: 2px;
    width: 12px; height: 12px;
    background: #fff; color: #888 !important;
    line-height: 11px; font-weight: normal !important;
    text-align: center;
    margin: 0 8px 0 0 !important; padding: 0;
    border: 1px solid #ccc !important;
}

.minmaxreacties:hover {
    background: #efefef;
    text-decoration: none !important;
    color: #000 !important;
}

.reactie .topBorder { 
    margin-left: -20px !important; 
    background: #666!important; 
} 

.reactie.last .topBorder { 
    margin-left: -20px !important; 
    background: #666!important; 
} 

.reactie { 
    background: #212323 !important; 
    color: #EDEEEE !important; 
    border-left: 1px solid #666!important; 
}

.reactie.last > .reactieContainer { 
    border-left: 0px solid #666 !important;
    margin-left: -39px !important; 
}

.reactieBody.informative { 
    background: #eee !important; 
    border: 1px solid #666!important; 
}

.reactieBody.spotlight { 
    background: #ccc !important; 
    border: 1px solid #666!important; 
    margin-left: -20px !important; 
}

Tevens ook een vraag hierover, ik kreeg +/- tekens te zien voor een post, om ze handmatig in of uit te klappen. Om een of andere manier werkt dit niet meer (zie ze niet meer). Iemand tips? In het voorbeeldje hieronder zou deze voor de naam staan. En heeft te maken met de .minmaxreacties

Mede-dank aan alle andere posts die hier staan en via pm. Veel handige tips daaruit kunnen halen. Hier een screenshot met bovenstaande code:


JS van Blue-eagle:
http://pastebin.com/mQb7CYuT

En dit is de link naar userstyles.org:
http://userstyles.org/styles/77003/tweakers-v7-clean-style

Deze wordt met kleine bugfixes aangepast en uitgebreid. Mochten er significante updates zijn, geef ik nog wel een post hier met de toevoeging/fix.

[NL-RaVeR]

_eXistenZ_ schreef op zondag 21 oktober 2012 @ 15:05:
Tweakers 7.5 - v1.1.0 is gearriveerd

and more ....

Bedankt voor het delen. Gebruik deze nu ook en is super. Top werk!

[Verwijderd]

Verwijderd schreef op zondag 21 oktober 2012 @ 15:32:
[...]

Enig idee wat hier verkeer gaat? Of andere JS kenners . Ik heb geprobeerd om menubar meer px te geven in het script maar dat verschuift het probleem alleen maar.

[afbeelding]
zwart boven = menubar
donker grijs = layout
licht grijs = content area
zwart onder = trackter
[afbeelding]

Ik ben eruit gekomen. Ik heb deze twee JS regels toegevoegd.

JavaScript:

document.getElementById('menubar').style.height = '39px';
document.getElementById('contentArea').style.width = 'auto';

[Blue-eagle]

Verwijderd schreef op zondag 21 oktober 2012 @ 21:25:
knip

Die +/- shit heb ik gemaakt met een plugin voor Tampermonkey. Bijhorende CSS staat in mijn totale CSS restyle, maar het onderdeel wat die dingen specifiek vorm geeft is dit:

Cascading Stylesheet:

.minmaxreacties {
    float: left; display: inline-block;
    position: relative; top: 2px;
    width: 12px; height: 12px;
    background: #fff; color: #888 !important;
    line-height: 11px; font-weight: normal !important;
    text-align: center;
    margin: 0 8px 0 0 !important; padding: 0;
    border: 1px solid #ccc !important;
}
.minmaxreacties:hover { background: #efefef; text-decoration: none !important; color: #000 !important; }

Hope that works

[Verwijderd]

Blue-eagle schreef op zondag 21 oktober 2012 @ 22:39:
[...]


Die +/- shit heb ik gemaakt met een plugin voor Tampermonkey. Bijhorende CSS staat in mijn totale CSS restyle, maar het onderdeel wat die dingen specifiek vorm geeft is dit:

Cascading Stylesheet:

snip

Hope that works

/facepalm momentje.. Tampermonkey had ik gedurende wat testen uitgezet ... Je kunt je soms scheel zoeken naar dingen >.<

[KroontjesPen]

Verwijderd schreef op zondag 21 oktober 2012 @ 21:25:
een CSS code.

De usernaam rechtsboven is gezakt en heeft vreemd lettertype.

[Verwijderd]

KroontjesPen schreef op zondag 21 oktober 2012 @ 22:51:
[...]
De usernaam rechtsboven is gezakt en heeft vreemd lettertype.

Kun je iets specifieker zijn? Bedoel je je eigen username rechtsboven als je ingelogd bent? Kan misschien te maken hebben met lengte van username, heb je een scherm printje er van? Mag 'm dm_en als je dat fijner vindt. Dan weet ik wat ik aanmoet passen.

[Wiethoofd]

Was er al iemand geweest die de groene 'nieuwe' tijden in de tracker ook zo buiten de toon vind vallen:

Cascading Stylesheet:

/* 'Tweakersblauwe' tijdkleur in tracker */
.trackerPopup .trackeritem li .new {
 color: #72C3DB;
}

[KompjoeFriek]

Een lekker simpel en saai grijs tweakers heb ik er van gemaakt, met speciale aandacht voor de reacties. Verder zo min mogelijk aan de layout veranderd.
Bij sommige onbelangrijke onderdelen is de leesbaarheid iets omlaag gegaan, dus nog zeker voor verbetering vatbaar. Maar het is iig een stuk rustiger op mijn ogen

Frontpage:	Got:
Frontpage reacties:	Got topic:

Css:
http://userstyles.org/styles/77046/tweakers-7-subtle-grey

[F.West98]

Ik snap niet waarom iedereen hier Tampermonkey en Greasemonkey scripts plaatst die enkel CSS toepast. De custom css werkt wel namelijk! (ook forum)
En het is niet het Custom JS topic

[Madrox]

Oke, na een friss herstart heb ik de kleur ook lichtelijk aangepast, vind je dit wat?



Heb zelf die plaatjes al uitgelijnt aan de rechterkant, voor ik zag dat iemand anders dat al gedaan heeft.
Groot voordeel is dat het echte nieuws nu meer naar boven komt en je meer effectieve ruimte hebt.

[ Voor 29% gewijzigd door Madrox op 22-10-2012 01:47 ]

[QwaftZefoni]

@Madrox: leuk. Hoe krijg ik zo'n mooi steel-plaatje ernaast? Pls do tell.

Jo... schreef op zondag 21 oktober 2012 @ 20:19:
[...]

Cascading Stylesheet:

.frontPageLink { 
    color: black;  
    font-weight:bold;
} 

.frontPageLink:visited {  
    color: grey; 
    font-weight:bold:
}

Dat zou moeten werken.

Maar dat doet 't niet hier in FF 16.0.1 via het custom CSS veld?

[Jo...]

QwaftZefoni schreef op maandag 22 oktober 2012 @ 06:50:
@Madrox: leuk. Hoe krijg ik zo'n mooi steel-plaatje ernaast? Pls do tell.


[...]


Maar dat doet 't niet hier in FF 16.0.1 via het custom CSS veld?

Dat zou kunnen. Ik gebruik Stylish en daar kan ik het gewoon toevoegen aan mijn code.

[Patrick89]

Madrox schreef op maandag 22 oktober 2012 @ 01:45:
Oke, na een friss herstart heb ik de kleur ook lichtelijk aangepast, vind je dit wat?

[afbeelding]

Heb zelf die plaatjes al uitgelijnt aan de rechterkant, voor ik zag dat iemand anders dat al gedaan heeft.
Groot voordeel is dat het echte nieuws nu meer naar boven komt en je meer effectieve ruimte hebt.

Dat geel vind ik zelf wel een beetje vies uitkomen. Een licht grijze kleur zou beter staan..

[Caelorum]

QwaftZefoni schreef op maandag 22 oktober 2012 @ 06:50:
[...]M
aar dat doet 't niet hier in FF 16.0.1 via het custom CSS veld?

Cascading Stylesheet:

.mainColumn .highlights .frontPageLink { color: black; font-weight:bold; }
.mainColumn .highlights .frontPageLink:visited { color: gray; font-weight:bold; }

Jo... schreef op maandag 22 oktober 2012 @ 07:27:
[...]
Dat zou kunnen. Ik gebruik Stylish en daar kan ik het gewoon toevoegen aan mijn code.

Zoals je het daar hebt gepost lijkt me het sterk dat het echt werkt. Je hebt namelijk gray als grey gespeld en een dubbele punt in plaats van een puntkomma geplaatst

[_eXistenZ_]

Tweakers 7.5 changelog: Tweakers 7.5 - v1.1.1
Voornamelijk een aantal fixes met knoppen die nog door de zoekbalk stonden

[josvane]

Bij deze mijn custom css tot nu toe. Vooral de kleuren terug in het forum zijn super.

code:

/* Forum nutteloze plaatjes weg */
.channelHeader{display:none;}

/* Forum Kleuren*/
.forumList:nth-child(3) table.listing tr th,
.forumList:nth-child(4) table.listing tr th,
.forumList:nth-child(5) table.listing tr th,
.forumList:nth-child(6) table.listing tr th,
.forumList:nth-child(7) table.listing tr th
{
background-image:url('http://www.inter-visie.com/got/tweakers_forum.png');
}
.forumList:nth-child(4) table.listing tr th{
background-position:0px 180px;
}
.forumList:nth-child(5) table.listing tr th{
background-position:0px 135px;
}
.forumList:nth-child(6) table.listing tr th{
background-position:0px 90px;
}
.forumList:nth-child(7) table.listing tr th{
background-position:0px 45px;
}

/* Frontpage aanpassing (vooral veel wit weg */
#contentArea{
background:#dddddd;
padding-left:5px;
padding-right:5px;
border-left:7px solid #fff;
border-right:7px solid #fff;
width:1000px; 
}
#layout{
background:#535353;
line-height:10px;
}
.topBorder{
display:none;
}
table.highlights td{
padding:5px;
}
.pageTabs li.active {
background:#dddddd;
}
/* Dit zal vast meer fixes nodig hebben dan de h2 bij de quotes! */ 
div.message, div.faq { 
 margin-top: -16px; 
} 
#quotemessages h2 { 
    padding-bottom: 15px; 
}
.message .messageheader .date a { 
 text-transform: lowercase; 
} 
.message .messageheader .date a:before { 
 content: 'Geplaatst op '; 
 text-transform: none; 
} 
#pmessages .date a:before { 
 content: 'Verzonden op ' 
}
#top{height:85px;}
#true{display:none;}

/* Grote plaatjes rechts */ 
#fpaItems { 
    margin-bottom: 10px; 
    float: right; 
    width: 330px; 
    border: 1px solid #dddede; 
    background: -webkit-linear-gradient(#F5F6F6, #EDEEEE) repeat scroll 0 0 #EDEEEE; 
    padding: 2px; 
} 

.fpaItem { 
    float: left; 
    width: 161px; 
    margin: 1px !important; 
    height: 122px; 
    border: 1px solid #dddede; 
    position: relative; 
} 

.fpaItem div.imageContainer { 
width: 100%; 
} 

.fpaItem img { 
    margin-left: -50px; 
} 
 .fpaItem div.textContainer {  
      bottom: 0 !important;  
      left: 0 !important;  
      opacity: 0.8 !important;  
      position: absolute !important;  
      font-size: 13px; 
      line-height: 18px; 
      padding: 4px; 
      width: 100%; 
      height: inherit !important;  
    }  
/* De 3 uitgelicht items kunnen ook wel pleite */
#highlights{
display:none;
}
/* Het menu hoeft niet breed te zijn */
#menubar { 
width: 1024px; 
border-radius:0; 
} 
/* Zoek balk verplaatsen en nutteloze ruimte weg laten */
#mainSearch{
position:absolute;
top:10px;
left:700px;
}
#searchbar{
height:0px;
border:0px;}
/* Nieuwsbrief en jobs weg */
#jobs, #newsletter{
display:none;
}

edit:
Even een screenshot toegevoegd

[Patrick89]

edit:
Even een screenshot toegevoegd

[afbeelding]

Ziet er gaaf uit met die kleurtjes.. Ik zou hem misschien gaan integreren met de gray version hier in de topic..

[jmxd]

Nice die kleuren

Was ik ook van plan maar nu kopieer ik hem lekker va jou

[Madrox]

Patrick89 schreef op maandag 22 oktober 2012 @ 07:40:
[...]

Dat geel vind ik zelf wel een beetje vies uitkomen. Een licht grijze kleur zou beter staan..

Wel, over smaak valt niet te twisten

[Zartok]

Zeker fijn die kleuren, alleen komt het bij mij wat minder uit omdat mijn cellen niet zo hoog zijn, maar ik heb het met een linear-gradient opgelost. Ik vroeg me trouwens af of er een reden is waarom je voor een afbeelding koos, want dat lijkt me wat minder makkelijk aanpasbaar.

[Bestla]

Misschien al ten overvloede hier gepost.

code:

/*zichtbare status van abo's*/
a.abonnee { color: #6174a0!important; }

Dat maakt de nickname blauw (wel babybadjesblauw maar daar kan ik niets doen.) van een abo.

Bron Bitshape uit aboforum.


En dat het werkt, ik zie alle abo's blauw.

[ Voor 49% gewijzigd door Bestla op 22-10-2012 14:47 ]

[Caelorum]

Bestla schreef op maandag 22 oktober 2012 @ 14:43:
[...] En dat het werkt, ik zie alle abo's blauw.

Waarom wil je dat?
Ik zal binnenkort ook maar eens een anti-meeste-reclame abbo afnemen.

[yannickie111]

josvane schreef op maandag 22 oktober 2012 @ 12:03:
Bij deze mijn custom css tot nu toe. Vooral de kleuren terug in het forum zijn super.
*lange lap code*

edit:
Even een screenshot toegevoegd

[afbeelding]

Werkt dit ook bij de forummapjes? Dat zou geweldig zijn!

[Bestla]

josvane schreef op maandag 22 oktober 2012 @ 12:03:
Bij deze mijn custom css tot nu toe. Vooral de kleuren terug in het forum zijn super.

code:

xxx

Even de abo blauw code toegevoegd voor mij en hij is perfect

En ik gebruik hem nu.

[Kobus Post]

Op dit moment alleen de kleuren een beetje aangepast.

To Do:
Forum
Hier en daar nog wat dingen herpositioneren

[ Voor 19% gewijzigd door Kobus Post op 22-10-2012 17:00 ]

[QwaftZefoni]

Zartok schreef op maandag 22 oktober 2012 @ 14:29:
Zeker fijn die kleuren, alleen komt het bij mij wat minder uit omdat mijn cellen niet zo hoog zijn, maar ik heb het met een linear-gradient opgelost. Ik vroeg me trouwens af of er een reden is waarom je voor een afbeelding koos, want dat lijkt me wat minder makkelijk aanpasbaar.

Hoe doe ik dat ipv dit:

Cascading Stylesheet:

.forumList:nth-child(3) table.listing tr th{
background: rgba(180, 17, 60,0.9);

Ik vraag sowieso hulp bij drie dingen. Ik doe mijn best en zoek in de andere codes maar krijg dit niet goed? Dus please hoe krijg ik:
- in de Menubar het geselecteerde onderdeel tekst in blauwe kleur tracker ipv geel

Cascading Stylesheet:

#menubar {
....  color: #72C3DB;
}

- de achtergrond tekstbalk in de afbeeldingen op de FP in een donkerder kleur grijs en opacity 0.7

Cascading Stylesheet:

    #fpaItems .fpaItem div.textContainer {
        font-size:12px!important;
        line-height:15px!important;
        padding:5px 10px!important;
        border-bottom:1px solid #FFF;
        opacity:0.7 !important;  
    }

- deze 'gelezen op Frontpage kleur-indicatie' werkt niet bij mij, wat doe ik hier fout

Cascading Stylesheet:

.mainColumn .highlights .frontPageLink { color: #212323; }
.mainColumn .highlights .frontPageLink:visited { color: #B9133c; }

[Kobus Post]

Actieve menu tab tekst blauw

Cascading Stylesheet:

#menu li.active a {
color: #000eff;
}

Actieve tab blauw

Cascading Stylesheet:

#fp_tabs li.active a {
color: #000eff;
}

Opacity naar beneden

Cascading Stylesheet:

.fpaItem div.textContainer {
height: 46px;
padding: 10px 18px;
font-size: 14px;
line-height: 21px;
color: #C8CBCB;
background-color: #212323;
border-right: 1px solid #A3A6A6;
opacity: 0.7;
}

Bezochte link op de frontpage

Cascading Stylesheet:

.frontPageLink:visited {
color: #b1778d;
}

[ Voor 9% gewijzigd door Kobus Post op 22-10-2012 17:51 ]

[Zartok]

QwaftZefoni schreef op maandag 22 oktober 2012 @ 17:40:
[...]
Hoe doe ik dat ipv dit:

Cascading Stylesheet:

.forumList:nth-child(3) table.listing tr th{
background: rgba(180, 17, 60,0.9);

Om dat met gradient te krijgen doe je het als volgt:

Cascading Stylesheet:

.forumList:nth-child(3) table.listing tr th{ background-image: -webkit-linear-gradient(#FF2F50,#A30028); }
.forumList:nth-child(4) table.listing tr th{ background-image: -webkit-linear-gradient(#9D55D5,#400072); }
etc...

Let wel op, want dit is voor chrome en voor andere browsers werkt het anders, namelijk:

Cascading Stylesheet:

background-image: -moz-linear-gradient(#FF2F50,#A30028);
background-image: linear-gradient(#FF2F50,#A30028);

Je kan ze allemaal achter elkaar zetten zodat automatisch de goede wordt gepakt en dat zal je zeker nodig hebben als je meerdere browsers gebruikt. Als je puur 1 kleur wilt en geen gradient, dan zul je moeten aangeven dat er geen image moet komen, namelijk zo:

Cascading Stylesheet:

background-image: none;
background-color: rgba(180, 17, 60, 0.9);

En je overige vragen zijn volgens mij al beantwoord , veel succes verder.

[Joosie200]

josvane schreef op maandag 22 oktober 2012 @ 12:03:
Bij deze mijn custom css tot nu toe. Vooral de kleuren terug in het forum zijn super.

Meegenomen, eigen kleurtjes gekozen en in mijn fotoalbum gestopt. Vervolgens een extra balk toegevoegd, want de categorie: General Chat had nog geen eigen balk Dit heb ik samen met de codes van Wiethoofd toegevoegd aan mijn eigen voorkeuren, voor de rest draai ik naar tevredenheid het script van _eXistenz_ in Tampermonkey voor Google chrome.

/me Joosie200 is tevreden nu

[Hero of Time]

Kobus Post schreef op maandag 22 oktober 2012 @ 16:59:
[afbeelding]

Op dit moment alleen de kleuren een beetje aangepast.

To Do:
Forum
Hier en daar nog wat dingen herpositioneren

Ik zie wat kleurtjes die ik ook wel kan gebruiken. Mijne is nogal grauw. Alleen maar zwart tinten, grijs en wit. Sommige dingen zijn wel in kleur, maar net even iets meer, zoals de linkjes, zijn wel prettig. Ik heb al de TS naam in 't groen, maar het houd een keer op .

[QwaftZefoni]

Zartok schreef op maandag 22 oktober 2012 @ 19:02:
[...]
Om dat met gradient te krijgen doe je het als volgt:
<uitleg>
En je overige vragen zijn volgens mij al beantwoord , veel succes verder.

... en bedankt

via Hex Color Code Generator en RGBaZR - Convert RGBA to HEX heb ik dit gemaakt:

Cascading Stylesheet:

/* Forum Categorie Kleuren*/
.forumList:nth-child(2) table.listing tr th{
/background: rgba(156, 158, 158,0.9); <<< VOOR EGALE KLEUREN
background-image: -moz-linear-gradient(#9C9E9E,#626363);
background-image: linear-gradient(#9C9E9E,#626363);
}
.forumList:nth-child(3) table.listing tr th{
/background: rgba(180, 17, 60,0.9);
background-image: -moz-linear-gradient(#B4113C,#760D29);
background-image: linear-gradient(#B4113C,#760D29);
}
.forumList:nth-child(4) table.listing tr th{
/background: rgba(69, 37, 96,0.9);
background-image: -moz-linear-gradient(#573077,#2B0A46);
background-image: linear-gradient(#573077,#2B0A46);
}
.forumList:nth-child(5) table.listing tr th{
/background: rgba(80, 215, 250,0.9);
background-image: -moz-linear-gradient(#50D7FA,#14505F);
background-image: linear-gradient(#50D7FA,#14505F);
}
.forumList:nth-child(6) table.listing tr th{
/background: rgba(27, 165, 60,0.9);
background-image: -moz-linear-gradient(#1BA53C,#074416);
background-image: linear-gradient(#1BA53C,#074416);
}
.forumList:nth-child(7) table.listing tr th{
/background: rgba(255, 90, 0,0.8);
background-image: -moz-linear-gradient(#FF5A00,#9E3B06);
background-image: linear-gradient(#FF5A00,#9E3B06);
}
.forumList:nth-child(8) table.listing tr th{
/background: rgba(255, 90, 0,0.8);
background-image: -moz-linear-gradient(#21428B,#112551);
background-image: linear-gradient(#21428B,#112551);
}
.forumList:nth-child(9) table.listing tr th{
/background: rgba(156, 158, 158,0.9);
background-image: -moz-linear-gradient(#9C9E9E,#626363);
background-image: linear-gradient(#9C9E9E,#626363);
}

Maar in 'mijn', lees overal gejatte custom CSS werkt het kleuren van bezochte nieuws-artikelen op de frontpage nog steeds niet evenals de tekstbox opacity in de frontpage uitgelichte items

http://pastebin.com/A71iv17V

[ Voor 2% gewijzigd door QwaftZefoni op 22-10-2012 20:55 . Reden: een c teveel achter #074416, vond de tablet niet leuk ]

[Hero of Time]

QwaftZefoni schreef op maandag 22 oktober 2012 @ 20:42:
Maar in 'mijn', lees overal gejatte custom CSS werkt het kleuren van bezochte nieuws-artikelen op de frontpage nog steeds niet evenals de tekstbox opacity in de frontpage uitgelichte items

Cascading Stylesheet:

table.highlights td a {
    color: #EDEEEE !important;
}
table.highlights td a:visited {
    color: #888888 !important;
}

Werkt voor mij. Link is grijs, bezocht is donker grijs.


De TS kan wel een update krijgen naar wat meer handige dingen, zoals de #top vastzetten zodat die mee scrollt, maar toch niet over je tekst heen gaat als-ie bovenaan is. Ik probeer 't, maar lukt niet, en kan 't ook niet zo snel vinden.

En dit werkt ook niet:
"TOPICSEARCH
Credits aan Ramon: [verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"
Link wijst naar pagina 18, niet naar de post zelf. Waar is die post!?

[Kobus Post]

Hero Of Time schreef op maandag 22 oktober 2012 @ 20:11:
[...]

Ik zie wat kleurtjes die ik ook wel kan gebruiken. Mijne is nogal grauw. Alleen maar zwart tinten, grijs en wit. Sommige dingen zijn wel in kleur, maar net even iets meer, zoals de linkjes, zijn wel prettig. Ik heb al de TS naam in 't groen, maar het houd een keer op .

Als je m'n css code wil hebben,
let wel het is nog niet af

Cascading Stylesheet:

body {
color: #79776a;
}
#layout {
background: #393939;
}
#searchbar {
background: #393939;
}
a {
color: #d9dbfe;
}
.frontPageLink:visited {
color: #b1778d;
}
table.highlights span, table.highlights .replies a {
color: #80aac6;
}
h1, h2, h1 a, h2 a {
color: #dd6034;
}
.trackerPopup .trackeritem li .new {
color: #b4c976;
}
.pageTabs li.active {
height: 30px;
margin-top: 0;
border-color: #C3C6C6;
background: white;
}
.trackerPopup .trackeritem li .caption {
color: #797979;
}
.trackerPopup .bulletSeparatedList li span {
color: #80aac6;
cursor: pointer;
}
#pricewatch, #jobs, #poll, #newsletter, #sponsored, #textlink, #social .twitterButton, #social .facebookButton {
background: #313232;
border: 0px;
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
color: #797979;
}
h3, h3 a {
color: #797979;
}
#menubar {
background: #323232;
}
table.highlights td {
line-height: 12px;
border-bottom: 1px solid #212323;
}
.pageTabs li {
background: #212323;
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
border: 0px;
}
#bottom div.hr {
background-color: #393939;
}
.advertorial {
background: #313232;
color: #79776a;
border: 0px;
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
}
.reactie {
background: #313232;
border-left: 1px solid #c0d6e9;
}
.reactie .topBorder {
background: url();
}
.reactie.last > .reactieContainer{
border-left: 1px solid #6ea1cd;
}
.reactieBody.informative {
background-color: #F7FBF6;
border: 1px solid #CFD4C9;
}
.reactieBody.spotlight {
background-color: #EFF8F2;
border: 1px solid #BECFBE;
}
.reactieBody.hidden {
background-color: #F8F9F9;
border: 1px solid #D9DBDB;
cursor: pointer;
}
.reactieHeader, .reactieHeader a {
color: #D9DBFE;
}
#filter {
background: #313232;
color: #79776a;
border: 0px;
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
}
.trackerPopup.fixed .close {
display: none;
}
.trackerPopup .popupContent {
position: fixed;
width: 310px;
background: #393939;
}
#tracker-weblogs {
display: none;
}
#tracker-jobs {
display: none;
}
.trackerPopup {
background: #393939;
}

[Hero of Time]

Tnx, je mag er wel eens wat commentaar in zetten. Ik ga mijn post ook nog even updaten met wat ik nu heb. Een paar verborgen dingen haal ik er wel uit, is niet van toepassing voor gebruikers .

En een update gedaan: Hero Of Time in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"

[ Voor 24% gewijzigd door Hero of Time op 22-10-2012 21:43 ]

[Jo...]

Caelorum schreef op maandag 22 oktober 2012 @ 09:04:
[...]

Cascading Stylesheet:

.mainColumn .highlights .frontPageLink { color: black; font-weight:bold; }
.mainColumn .highlights .frontPageLink:visited { color: gray; font-weight:bold; }

[...]

Zoals je het daar hebt gepost lijkt me het sterk dat het echt werkt. Je hebt namelijk gray als grey gespeld en een dubbele punt in plaats van een puntkomma geplaatst

Zowel Grey als Gray zijn correct volgens deze site. (En het werkt ook met zowel grey als gray in de code)
De dubbele punt is inderdaad een fout, al werkte het stukje code wel als ik het toevoegde aan mijn volledige CSS code. (Misschien omdat ik het aan het einde van de code toevoegde?)

[_eXistenZ_]

Tweakers 7.5 changelog: Tweakers 7.5 - v1.1.2

/edit

Vooruit dan maar, heb al 24 uur geen plaatje gepost hier

[ Voor 40% gewijzigd door _eXistenZ_ op 23-10-2012 00:25 ]

[Blue-eagle]

Update van mijn stijl voor ik ga slapen, een lading bugfixes en een nieuw gejatte background



CSS: http://pastebin.com/nPiJeTr6

[Bestla]

_eXistenZ_ schreef op dinsdag 23 oktober 2012 @ 00:13:
Tweakers 7.5 changelog: Tweakers 7.5 - v1.1.2

/edit

Vooruit dan maar, heb al 24 uur geen plaatje gepost hier

[afbeelding]

Geweldig mooi man ! Lekker compact ook het forum .

Dank

[Standeman]

Ik heb de trolls en de discussie daarna verwijderd. Laten we vooral vriendelijk tegen elkaar blijven, dat maakt het topic leuke en mijn leven weer makkelijker

[QwaftZefoni]

Hero Of Time schreef op maandag 22 oktober 2012 @ 21:29:
[...]

Cascading Stylesheet:

table.highlights td a {
    color: #EDEEEE !important;
}
table.highlights td a:visited {
    color: #888888 !important;
}

Werkt voor mij. Link is grijs, bezocht is donker grijs.

Da's mooi, voor jou

Ik denk dat iets in de door mij gebruikte code echter 't tegenwerkt. Dus eenvoudig die al geposte verschillende manieren invoegen in 'mijn' Custom CSS werkt niet voor me?

Ook ben ik de schaduw onder de #menubar kwijt. Waarschijnlijk plaats ik het content-stuk te hoog ofzo.

Als iemand zich geroepen voelt om tijdens een kop koffie deze dingen aan me uit te leggen... haal ik de koffie.

[Zartok]

QwaftZefoni schreef op dinsdag 23 oktober 2012 @ 11:55:
[...]
Als iemand zich geroepen voelt om tijdens een kop koffie deze dingen aan me uit te leggen... haal ik de koffie.

Gezien je huidige woonplaats denk ik dat ie koud is als je hier bent. Maar dat geeft niet, want ik houd toch niet van koffie . Je probeert je links op de FP een andere kleur te geven (toch?), ik heb het volgende gebruikt voor de FP:

Cascading Stylesheet:

table.highlights td     { line-height: 0px; padding: 5px 8px; }
.frontPageLink          { color: #212323; text-decoration: none; }
.frontPageLink:visited  { color: #B9133c; }

[Madrox]

De code voor die forum kleur balkjes, die wil ik wel