Tweakers 7 Ultimate CSS Competition - Inzendtopic

[Hooglander1]

Tweakers 7 Ultimate CSS Competition

Ondertussen is Tweakers.net al weer ruim een dag onder ons (plan: Een dag met Tweakers 7). Gedurende deze periode is er uitzonderlijk veel custom CSS gedeeld en gemaakt om T.net 7 te verbeteren naar de smaak van de community. Bijna alles gebeurde zelfs buiten de topics en forumonderdelen die daar normaal eigenlijk voor bedoeld zijn.

Hierdoor is ook een mooie wildgroei aan beschikbare CSS ontstaan, zo zijn er op het moment van schrijven 19 themes te vinden http://userstyles.org/styles/browse/tweakers en nog meer in [bug] Pagina's te wit! met een weinig verhullende titel .

Om alle goedbedoelde kritiek in mooie banen te leiden, het aanbod overzichtelijk te maken en het kaf van het koren te scheiden is er eigenlijk maar een optie mogelijk: een wedstrijd om te zien wie de beste CSS in elkaar kan knutselen om Tweakers.net zo mooi mogelijk te maken!

Doel

Het doel van de wedstrijd is uiteraard niet winnen, maar deelnemen. Haal het beste uit jezelf wat betreft CSS en post dat in dit topic. Zo kunnen niet alleen de users genieten van jouw inzending en daar waardevolle stukjes uithalen, maar wie weet breng je T.net HQ op goede ideeën.

Regels

Geen banaan zonder schil, geen wedstrijd zonder regels. Houd je er aan, anders wordt je genadeloos uitgesloten van de eindpoll door de organisatie.
• Één inzending per user.
• De CSS moet grotendeels door jezelf ontworpen zijn.
• Ads mag je niet weghalen, maar verder ben je vrij in wat je doet met de CSS.
• De inzending moet voldoen aan onderstaand format.
• De inzending moet gebruikt kunnen worden in het custom CSS veld die beschikbaar is via de karmastore.
• Plugins als greasemonkey zijn dus niet toegestaan.
• Heb je niet genoeg karma Schaam je! dan kan je je CSS wel testen via plugins als stylish, maar _alleen_ CSS.
• De inzending moet uiterlijk Zondag 4 november 23:59 ingestuurd zijn.

Format

Je inzending moet voldoen aan onderstaand format:

code:

[h1]Inzending![/]
[h3]--username--[/]
[h3]--naam van je CSS style--[/]
[img]URL naar je screenshot[/]
[code=css]
paste hier je CSS
[/]
[h3]Toelichting[/]
Leg hier uit waarom jij vind dat jij de beste CSS hebt gemaakt.

Voorbeeld:

---

Inzending!

Hooglander1

Hoogie's donkere toverhenk

Cascading Stylesheet:

#henk {
    height: 63px;
    top: -63px;
}

#layout {
    background-color: #262828;
}

div#bottom div.hr {
    background-color: #262828;
}

div#contentArea {
    background-color: #FFF;
    border-left: 20px solid #FFF;
    border-right: 20px solid #FFF;
}

Toelichting

Omdat Henk zichtbaar is natuurlijk én het doet minder pijn aan je ogen én het doet geen afbreuk aan het werk van de fantastische devvers.

---

Verkiezing van de winnaar

Vanaf Maandag 5 november zullen wij hier een poll plaatsen zodat iedereen kan stemmen op wie zij denken die alle eer verdient.

Prijzen!!!!111oneone

Tweakers is zo vriendelijk geweest om hier een fantastische prijs voor beschikbaar te stellen. Als die-hard CSS'er wordt je uitgenodigd op Tweakers HQ voor een VIP tour door de diepe krochten van het VNU pand. Ontmoet de redacteuren, de devvers en de ontwerpers. Uiteraard mag je laten weten waarom jouw CSS zo fantastisch is, maar bij een te grote muil ga je head-first het IJ in . Uiteraard zal dit alles gebeuren op een dag die jou uitkomt.

Zie hieronder een sfeerimpressie met het uitzicht van Wilbert op de 7e (alles met 7 is kennelijk mooi). Of het Nerf gun onderdeel is van een pakket stimuleringsmiddelen voor z'n "collegae" is niet bekend, maar daar kan de tour vast wel meer duidelijkheid over geven .



Uiteraard wordt er ook een aan hapje en een drankje gedacht. Een lunch is auch dabei! Na de lunch kan je nog proberen je van je beste kant te laten zien in de epische Tweakers Eternal Piew compo (UT2004).

Ook wordt je niet met lege handen naar huis gestuurd. Na al dat leuks krijg je een mooie goodie bag mee.

Maar de echte prijs voor de Tweaker is natuurlijk de eer van de beste custom CSS

Tot slot

Dus doe je best en laat zien wat je in je mars hebt. Maar vergeet niet, je mag maar één inzending doen! Denk er dus goed over na en laat je CSS van je beste kant zien!

[ Voor 32% gewijzigd door Electrowolf op 22-10-2012 15:24 ]

[pino85]

Als in het andere topic al gezegd, een goed iniatief wat ik van harte toejuich zelf is mijn kennis met dit helaas zeer gering dus ik zal niet mee doen, iedereen die mee doet veel succes ik zal het op de voet blijven volgen want ben ook erg benieuwd wat er bedacht gaat worden.
Dit soort zaken laten als je het mij vraagt de kracht van tweakers goed zien.

[ Voor 27% gewijzigd door pino85 op 19-10-2012 23:22 ]

[alex3305]

Mag je de CSS nog wel editten nadat je 'em hebt gepost of is het echt één inzending per user? Ik heb namelijk flink wat CSS al gedaan, maar ben nog niet 100% klaar...

[Hooglander1]

alex3305 schreef op vrijdag 19 oktober 2012 @ 23:24:
Mag je de CSS nog wel editten nadat je 'em hebt gepost of is het echt één inzending per user? Ik heb namelijk flink wat CSS al gedaan, maar ben nog niet 100% klaar...

Post hem als je hem helemaal af hebt. Uiteraard is er voor ons niet te controleren of je kleine fixjes doorvoert, maar het idee is wel dat je één final versie hier post

Dat houdt het overzichtelijk voor ons, maar ook voor de mensen die hier kijken.

[ Voor 8% gewijzigd door Hooglander1 op 19-10-2012 23:25 ]

[F.West98]

Dan zal je mijne over een paar weken verwachten

[Electrowolf]

F.West98 schreef op vrijdag 19 oktober 2012 @ 23:27:
Dan zal je mijne over een paar weken verwachten

Als je 'm maar voor 4 nov 24:00 post .

[F.West98]

Electrowolf schreef op vrijdag 19 oktober 2012 @ 23:28:
[...]


Als je 'm maar voor 4 nov 24:00 post .

3 nov 23:59+1
of
4 nov 23:59+1

[Hooglander1]

• De inzending moet uiterlijk Zondag 4 november 23:59 ingestuurd zijn.

De TS is leidend in deze.

[Electrowolf]

dubbel dus *knip*

[ Voor 91% gewijzigd door Electrowolf op 19-10-2012 23:33 ]

[Slapstick]

Hooglander1 schreef op vrijdag 19 oktober 2012 @ 23:31:
[...]


De TS is leidend in deze.

24 november 23:59 CET?

[Hooglander1]

Slapstick schreef op vrijdag 19 oktober 2012 @ 23:42:
[...]


24 november 23:59 CET?

CTT

[Rutix]

Leuk idee! Ik zal van het weekend eens wat mooi's in elkaar flansen ^___^! En nice spoiler van Henk Hooglander1

[F.West98]

Hoe wordt de beste inzending gekozen?

[Tomassie91]

@F.West98

Lijkt me logisch toch? Een poll.

Ik ga ook meedoen, heb nu al een pagina bij userstyles, maar dat is duidelijk nog niet mijn uiteindelijke inzending.

Nog een vraag over de regels:
Is het toegestaan om elementen uit pagina's te halen, (bijvoorbeeld op de FP de gesponsorde acties en IT banen)? Deze lijken mij redelijk belangrijk voor T.net, aangezien ze hier op verdient.

[Virtuozzo]

Tomassie91 schreef op vrijdag 19 oktober 2012 @ 23:48:


Nog een vraag over de regels:
Is het toegestaan om elementen uit pagina's te halen, (bijvoorbeeld op de FP de gesponsorde acties en IT banen)? Deze lijken mij redelijk belangrijk voor T.net, aangezien ze hier op verdient.

Goede vraag. Lijkt me wel dat we hier even voorzichtig moeten zijn. Ik zou het uitsluiten, maar dat is mijn optiek.

[Hooglander1]

Tomassie91 schreef op vrijdag 19 oktober 2012 @ 23:48:
Nog een vraag over de regels:
Is het toegestaan om elementen uit pagina's te halen, (bijvoorbeeld op de FP de gesponsorde acties en IT banen)? Deze lijken mij redelijk belangrijk voor T.net, aangezien ze hier op verdient.

Ads mag je niet weghalen, maar verder ben je vrij in wat je doet. We willen daar bewust geen grens aan stellen. Als je CSS echter zoveel weghaalt dat het amper bruikbaar is, heb je het risico dat je niet mee wordt genomen in de eind-poll.

[Electrowolf]

...en staat nu ook bij de regels in de TS.

[ChevyVan79]

Is het niet handiger om alles in pastebinnetjes te zetten? Ik zie het al voor me dat iedereen zijn 200-regel lange stylesheet hier post.

[F.West98]

Wat niet duidelijk is uit de regels:
Mag je een php script maken waar je opties kan instellen, waarmee je dus onderdelen in mijn css kan uitschakelen (feature x wil ik niet, dus doe ik die niet).
Hiermee meerdere screenshots nodig. Mag dat dan ook?

[Hero of Time]

F.West98 schreef op vrijdag 19 oktober 2012 @ 23:55:
Wat niet duidelijk is uit de regels:
Mag je een php script maken waar je opties kan instellen, waarmee je dus onderdelen in mijn css kan uitschakelen (feature x wil ik niet, dus doe ik die niet).
Hiermee meerdere screenshots nodig. Mag dat dan ook?

• De inzending moet gebruikt kunnen worden in het custom CSS veld die beschikbaar is via de karmastore.

Dus: NEE.

[Rutix]

F.West98 schreef op vrijdag 19 oktober 2012 @ 23:55:
Wat niet duidelijk is uit de regels:
Mag je een php script maken waar je opties kan instellen, waarmee je dus onderdelen in mijn css kan uitschakelen (feature x wil ik niet, dus doe ik die niet).
Hiermee meerdere screenshots nodig. Mag dat dan ook?

Nee

• De inzending moet gebruikt kunnen worden in het custom CSS veld die beschikbaar is via de karmastore.

Edit: Crap Hero Of Time was sneller :<

[ Voor 4% gewijzigd door Rutix op 19-10-2012 23:57 ]

[F.West98]

Een PHP script die CSS poept en die je include dmv een @import url(jeurlhier);

Dat kan namelijk wel in CUstom CSS veld (vergeten te zeggen)

[ Voor 7% gewijzigd door F.West98 op 19-10-2012 23:59 ]

[Hero of Time]

Maar dat is weer off-site en niet de strekking van de competitie. Bovendien maak je op die manier meer dan 1 CSS.

[Hooglander1]

F.West98 schreef op vrijdag 19 oktober 2012 @ 23:57:
Een PHP script die CSS poept en die je include dmv een @import url(jeurlhier);

Dat kan namelijk wel (vergeten te zeggen)

Nee, alleen CSS.

Het gaat om jouw visie van Tweakers 7, niet iets wat met allerlei preferences in elkaar hangt. Gewoon 1 CSS versie die jij het beste vind.

ChevyVan79 schreef op vrijdag 19 oktober 2012 @ 23:55:
Is het niet handiger om alles in pastebinnetjes te zetten? Ik zie het al voor me dat iedereen zijn 200-regel lange stylesheet hier post.

Nee, aan ruimte geen gebrek hier en de code-tag kan zichzelf invouwen, dus dat is geen probleem verder

[rvdv12773]

Inzending!

RVDV12773

Collective Stylesheet

Cascading Stylesheet:

#logo {left: -200px;}
#logo + .sitename {left: -152px;}
#userbar{right:-150px}
 #menu li a, #menu li span {padding: 0 20px;font-weight:bold;}
body {background-color:#252525; min-height: 100%; position: relative;}
#layout {min-width: 1346px;  width: 1346px;  margin-right: auto;  margin-left: auto; background-color:#DDDDDD;}
#contentArea{margin: 0 auto; width: 980px; left: 173px;}
#top {min-width: 1346px; width: 1346px;}
#bottom {min-width: 1346px; width: 1346px;}
#menubar {background: linear-gradient(#262828, #1C1E1E) repeat scroll 0 0 #444444; min-width: 1346px; width: 1346px;}
#tweakbase {background: none repeat scroll 0 0 #EDEEEE;}
table.highlights td {padding: 5px 0;}
.fpaItem div.textContainer {background-color:#444444;}
.fpaItem:hover .imageContainer {opacity:0.85}
.reactie, .articleColumn {line-height: 1.2}
.trackerPopup {background: none repeat scroll 0 0 #3B3B3B;}
.trackerPopup:hover {background: none repeat scroll 0 0 #373737;
}
#toggleButtonTxt {color:#444444;border-width:1px;border-color:#999999;border-style:solid;}

Toelichting

Nou, ik doe denk ik ook een duit in het zakje...

Tweakers heeft een heleboel effort gestoken om oa. een nieuwe layout te ontwikkelen, maar zonder de community te raadplegen, en dat hebben ze gemerkt ;-)

Nu gaan wij weer allemaal afzonderlijke Stylesheets ontwikkelen, maar mischien zou het iets zijn als een aantal Tweakers een gezamelijke CSS zouden ontwikkelen?

Ik heb al wat gedaan, maar het is nog niet perfect... Er zijn een aantal dingen waar ik niet uitkom en hulp bij nodig heb. Misschien kunnen jullie me hier mee helpen? Hier zijn enkele dingen waar ik niet uit kom...

- De Tracker moet persé links staan in deze layout, rechts komt hij niet goed te staan...
- De reactielijst ziet er wat knullig uit met deze stylesheet, dat heeft ook te maken met het feit dat Tweakers.net PNG files zonder transparantie gebruiken, zodat ze alleen kloppen op de originele achtergrondkleur (WIT zoals jullie weten ;-)

Ik zou het leuk vinden als andere users deze stylesheet weer verder ontwikkelen (als de layout ze überhaubt aanspreekt natuurlijk). Ik hoef zelf niet te winnen, maar ik wil uiteindelijk wel een Stylesheet waar ik prettig mee kan werken...

[ Voor 0% gewijzigd door rvdv12773 op 20-10-2012 00:29 . Reden: typo ]

[Hero of Time]

rvdv12773 schreef op zaterdag 20 oktober 2012 @ 00:01:
[knip]

Ik heb al wat gedaan, maar het is nog niet perfect... Er zijn een aantal dingen waar ik niet uitkom en hulp bij nodig heb. Misschien kunnen jullie me hier mee helpen? Hier zijn enkele dingen waar ik niet uit kom...

- De Tracker moet persé links staan in deze layout, rechts komt hij niet goed te staan...
- De reactielijst ziet er wat knullig uit met deze stylesheet, dat heeft ook te maken met het feit dat Tweakers.net PNG files zonder transparantie gebruiken, zodat ze alleen kloppen op de originele achtergrondkleur (WIT zoals jullie weten ;-)

Ik zou het leuk vinden als andere users deze stylesheet weer verder ontwikkelen (als de layout ze überhaubt aanspreekt natuurlijk). Ik hoef zelf niet te winnen, maar ik wil uiteindelijk wel een Stylesheet waar ik prettig mee kan werken...

Is dit serieus bedoelt als inzending, of heb je het verkeerde topic te pakken en had je 't eigenlijk in [verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?' bedoelt te zetten? Een CSS die niet af is, maakt geen serieuze kans om mee te doen aan een competitie. En als je hulp van anderen wilt om verder te sleutelen, is dit niet het juiste topic.

[rvdv12773]

Hero Of Time schreef op zaterdag 20 oktober 2012 @ 00:06:
[...]

Is dit serieus bedoelt als inzending, of heb je het verkeerde topic te pakken en had je 't eigenlijk in [verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?' bedoelt te zetten? Een CSS die niet af is, maakt geen serieuze kans om mee te doen aan een competitie. En als je hulp van anderen wilt om verder te sleutelen, is dit niet het juiste topic.

Had ik willen doen, maar ik heb daar geen toegang toe...

[Hero of Time]

Tja, 5 berichten en je dient er 50 te hebben. Hoe krijg je dat in 6 jaar toch voor elkaar?

Dan alsnog had je beter kunnen wachten en bugs eruit halen. Wellicht dat er iemand op IRC jou kan helpen?

[David Mulder]

Ik had net al een hele inzending klaar, maar kreeg toen nog een paar kleine ideetjes. Nu puur door jullie regel dat je je inzending niet meer mag wijzigen heeft dit tot gevolg dat die inzending pas op z'n vroegst volgend weekend (vanaf morgen tot donderdag heel druk) (of nooit) meer zal komen. Dan is het toch beter als zo'n inzending direct komt, want dan is het zowel een inspiratie voor anderen als nuttig voor gebruikers? Maar nu verlies je de mogelijkheid om nog van andere af te kijken zodra je op "Verstuur" drukt, wat tot gevolg zal hebben dat alle echt goeie inzendingen pas kort voor het einde zullen komen. Ja... goed uitgedacht die regels...

[Hooglander1]

GreatSlovakia schreef op zaterdag 20 oktober 2012 @ 00:26:
Ik had net al een hele inzending klaar, maar kreeg toen nog een paar kleine ideetjes. Nu puur door jullie regel dat je je inzending niet meer mag wijzigen heeft dit tot gevolg dat die inzending pas op z'n vroegst volgend weekend (vanaf morgen tot donderdag heel druk) (of nooit) meer zal komen. Dan is het toch beter als zo'n inzending direct komt, want dan is het zowel een inspiratie voor anderen als nuttig voor gebruikers? Maar nu verlies je de mogelijkheid om nog van andere af te kijken zodra je op "Verstuur" drukt, wat tot gevolg zal hebben dat alle echt goeie inzendingen pas kort voor het einde zullen komen. Ja... goed uitgedacht die regels...

Er zijn genoeg topics om je tijdelijke CSS in te spuwen en daar te reflecteren. Wij willen in dit topic nu juist dat je met die ene combinatie komt die jij het beste vind. Doe als het ware de t.net ontwerpers en devvers na, wat is nu écht goed. Denk daar eens over na.

Zoals eerder gezegd, kleine fixes doen we niet lullig over, maar elke keer je tijdelijke CSS showen, daar zijn andere topics voor

[Electrowolf]

Hooglander1 schreef op zaterdag 20 oktober 2012 @ 00:30:
[...]
Zoals eerder gezegd, kleine fixes doen we niet lullig over, maar elke keer je tijdelijk CSS showen, daar zijn andere topics voor

Zoals Hero Of Time in "Tweakers 7 Ultimate CSS Competition - Inzendtopic" al noemde .

[ Voor 19% gewijzigd door Electrowolf op 20-10-2012 00:36 ]

[David Mulder]

Datgene wat ik wou inzenden was wel degelijk van nette kwaliteit. Maja, ik zal me fijn aan jullie opzet houden en als ik het me herinner het een paar uur voor de deadline posten.

[rvdv12773]

GreatSlovakia schreef op zaterdag 20 oktober 2012 @ 00:26:
Ik had net al een hele inzending klaar, maar kreeg toen nog een paar kleine ideetjes. Nu puur door jullie regel dat je je inzending niet meer mag wijzigen heeft dit tot gevolg dat die inzending pas op z'n vroegst volgend weekend (vanaf morgen tot donderdag heel druk) (of nooit) meer zal komen. Dan is het toch beter als zo'n inzending direct komt, want dan is het zowel een inspiratie voor anderen als nuttig voor gebruikers? Maar nu verlies je de mogelijkheid om nog van andere af te kijken zodra je op "Verstuur" drukt, wat tot gevolg zal hebben dat alle echt goeie inzendingen pas kort voor het einde zullen komen. Ja... goed uitgedacht die regels...

Als je mee speelt om te winnen, dan ga je je inzending pas op het laatste moment indienen natuurlijk. Als je de andere Tweakers wil inspireren, dan doe je het nu al... Ik heb de mijne ook al ingezonden. Wellicht dat iemand er iets aan heeft... dat is voor mij belangrijker dan proberen te winnen... Nu is het ieder voor zichzelf, en dat is ook niet mijn ding... succes in ieder gaval !

[SRich]

Hooglander1 bedankt, werkt goed

[_eXistenZ_]

Tweakers 7.5 heeft weer een update gekregen:

- Hoge headers zoals je eigen profielpagina werkt nu goed
- GoT is lekker compact geworden
- Theme is door mij en een vriend inmiddels een beetje getest in verschillende browsers en is battle ready bevonden voor dagelijks gebruik (betekent niet bugvrij!)

Known bugs:
- Vanwege de plaating van het zoekformulier komt er soms andere info (De video-leverancier, je karma op je profielpagina, oid) doorheen te staan.

Todo:
- Dingen kunnen nog wel compacter, ik ben nog niet klaar
- Ik ga aandacht schenken aan de tracker, zodat deze ook voor mensen die géén full HD-scherm hebben bruikbaar is







Mensen die het userscript al draaien zouden automatisch de update binnen moeten krijgen, mensen die het userscript nog niet hebben, kunnen zich hier melden.

[_Rene_]

@_eXistenZ_; Zeer knap gedaan! Hier zie ik echt potentie in! Tracker mag er inderdaad wel bij!

[Caelorum]

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 10:28:
[...] Known bugs:
- Vanwege de plaating van het zoekformulier komt er soms andere info (De video-leverancier, je karma op je profielpagina, oid) doorheen te staan.
[...]
- Ik ga aandacht schenken aan de tracker, zodat deze ook voor mensen die géén full HD-scherm hebben bruikbaar is
[...]

Heel mooi
Dat stomme zoekformulier is ook niet makkelijk nee. Zelf ook veel problemen mee gehad. Ik heb hem hier boven de tracker uitgelijnd en links van de tabjes, zodat het popupje fatsoenlijk blijft werken. Wel met een z-index van 1000 natuurlijk
Die tracker kan je denk ik niet veel aan doen. Dat wordt onder andere met javascript gedaan.
Overigens werkt jouw css niet helemaal goed hier als ik het via custom css doe en in IE10 bekijk.

[ Voor 6% gewijzigd door Caelorum op 20-10-2012 12:47 ]

[Infant]

Heel goed topic, ik ga ook aan de slag.

Ik denk dat alle moeite die we hier in gaan steken niet voldoende gaat zijn om twee jaar aan faal ongedaan te maken, maar het zal een begin zin.

Behalve de CSS is er namelijk nog veel meer kapot. (Bijv: Dit is de tweede keer dat ik deze reactie post, de eerste keer leverde een server error op.)

[ Voor 17% gewijzigd door Infant op 20-10-2012 12:49 ]

[WoBaDijk]

Erg leuk initiatief. Volgens mij zijn er al redelijk wat tweakers zelf aan de slag gegaan. Ik vind het wel jammer dat het puur om CSS gaat (deels begrijpelijk). Daardoor kun je dingen als de zoekbalk minder goed aanpakken.

[ikbenwouter]

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 10:28:
Tweakers 7.5 heeft weer een update gekregen:

Edit:
Crosspost met:
ikbenwouter in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"

Over bugje met de menubar / contentarea in deze style. Beste style tot nu toe btw

[ Voor 52% gewijzigd door ikbenwouter op 20-10-2012 13:42 ]

[Micha]

.... verkeerd geplaatst

[ Voor 182% gewijzigd door Micha op 20-10-2012 13:48 ]

[_eXistenZ_]

Update allemaal maar effe naar versie 1.0.3 van men UserScript, het menubalkje had een z-index nodig om i.c.m. de tracker ook zichtbaar te blijven

Wat betreft !important, als Tweakers alleen de mogelijkheid biedt om in de broncode de CSS vóór hun eigen CSS te laden, zal het nodig zijn, óf je moet de CSS specifieker schrijven inderdaad.
Zie voor meer info: http://css-tricks.com/specifics-on-css-specificity/

Omdat ik nu in 3 topics post ben ik vanaf nu te volgen in _eXistenZ_ in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"

/edit

Hier ook allerlei crossposts Iig nu stroomlijn ik m weer hopelijk, door te migreren naar 1 topic.

[ Voor 8% gewijzigd door _eXistenZ_ op 20-10-2012 14:04 ]

[SkyStreaker]

Ik raad aan om een poll te maken, de crew zelf zou dit moeten gaan doen, die laat blijken wat het grotere geheel de beste CSS vindt. Neem dat mee in de evaluatie van hoe de zaken er nu op dit moment voorstaan - geef eventueel ook aandacht aan de top 3 hiervan. Neem de feedback ten harte die je krijgt van de users als er werk wordt gemaakt naar aanleiding van de resultaten van de poll. Het is een aanname die ik maak, maar een actie als deze - het lijkt mij dat de userbase zich dan ook in grote getale betrokken kan voelen bij de (her)introductie van het nieuwe uiterlijk.

Wellicht een advies die geen gehoor gaat krijgen - echter als je toch een minder gekleurde en feitelijke indruk wil hebben van hoe je userbase het nieuwe uiterlijk zou willen zien lijkt mij dit toch een goede optie.

Schop deze pol echter wel goed onder de aandacht om zoveel mogelijk man te bereiken en niet door simpelweg een topic aan te maken en het de users laten ontdekken door hunzelf/ door users elkaar te laten verwijzen naar het toppic.

[ Voor 12% gewijzigd door SkyStreaker op 20-10-2012 13:59 ]

[jay03]

Mijn versie heb ik donderdag snel even in elkaar gezet en staat al op Userstyles.net

Inzending!

Jay03

Tweakers.net dark-compact

Cascading Stylesheet:

@-moz-document domain('tweakers.net') {

    #layout {
    background-color: #313232;
    }
    #forumheading {
    background-color: #EDEEEE;
    }
    #contentArea {
    background-color: #EDEEEE;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 4px;
    }
    #header {
    margin-top:10px;
    }
    #messages { 
        width: 980px; 
    } 
    
    .messagecontent { 
        width: 826px; 
    }
    
    .pageTabs li {
        border: none;
        background: none;
    }
    
    table.highlights td {
    line-height: 15px;
    border-bottom: 1px solid #ccc;
    padding: 6px 0;
    }
    #fp_tabs {
    padding-top: 0;
    padding-left: 0;
    border-bottom: none;
    }
    
    .pageTabs li.active {
    height: 30px;
    margin-top: 0;
    border-color: #323232;
    background: #323232;
    }
    #fp_tabs li.active a, #forum_tabs li.active a {
color: #72C3DB;
}

    #fpaItems {
    overflow: hidden;
    margin-bottom: 0;
    }
    
    .fpaItem {
        height: 170px;
    }
    .fpaItem div.textContainer {
        height: 32px;
        font-size: 12px;
        padding: 4px 18px;
        line-height: 16px;
    }
    
    #fp_tabs_container {
        overflow: hidden;
        height: 30px;
        margin-bottom: 0;
    }
    
    #search {
    position: relative;
    top: -54px;
    padding-top: 0;
    margin: 0 auto;
    left: -60px;
    }
    #search input.text {
        background: #EEE;
    }
    
    #top {
        border-bottom: 1px solid #D5D5D5;
    }
    #bottom div.hr {
        height:0
    }
    #searchbar {
        background: #222;
        margin-top: 34px;
        height: 20px;
    }
    
    .reactie {
    line-height: 18px;
    }
    table.listing td, table.listing th {
        padding: 4px 5px;
        line-height: 18px;
        text-align: left;
    }
}

Toelichting

Inmiddels 435x geïnstalleerd Ik zal vast niet de beste zijn, maar browse nu een stuk fijner door de vernieuwde tweakers site. Mocht iemand die hem geïnstalleerd heeft nog een opmerking hebben, dan hoor ik het graag. Ik zal proberen om hier en daar nog wat verbeteringen toe te passen. Als het goed is werkt de update knop in chrome nu correct en wordt de style automatisch toegewezen aan tweakers.net

Update: heb de zoekbalk verplaats naar boven, scheelt weer een aantal pixels!

[ Voor 23% gewijzigd door jay03 op 20-10-2012 15:53 . Reden: Fullsize screenshot, zoekveld verplaatst naar de rode balk ]

[deus4]

Hey,

Mijn vriendin heeft gisteren ook even lopen spelen met de layout, zie hier het resultaat.

Geen idee waarom hij m'n plaatje niet weergeeft, dan maar de link: http://imageshack.us/photo/my-images/845/tweakers71.png/

-De zoekbalk is verplaatst, net als de link naar je account.
-Extra knop Tweakblogs toegevoegd.
-De hele reeks onnodige tabs weggehaald.
-achtergrondkleur minder wit
-meer info/vierkante cm

-Meuktracker met fictieve content opnieuw toegevoegd.

To do: om de een of andere idiote reden staat nu in het nieuws alles door elkaar: nieuws, .Plans, software updates etc etc. Dit moet weer netjes gescheiden worden. Dit kan echter niet eenvoudig met css

Helaas is er meer dan alleen wat css voor nodig geweest om de pagina zo te maken... Vandaar dat ik geen stukje code mee stuur...

[ Voor 7% gewijzigd door deus4 op 20-10-2012 14:09 ]

[jay03]

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 13:48:
Update allemaal maar effe naar versie 1.0.3 van men UserScript, het menubalkje had een z-index nodig om i.c.m. de tracker ook zichtbaar te blijven

Wat betreft !important, als Tweakers alleen de mogelijkheid biedt om in de broncode de CSS vóór hun eigen CSS te laden, zal het nodig zijn, óf je moet de CSS specifieker schrijven inderdaad.
Zie voor meer info: http://css-tricks.com/specifics-on-css-specificity/

Omdat ik nu in 3 topics post ben ik vanaf nu te volgen in _eXistenZ_ in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"

/edit

Hier ook allerlei crossposts Iig nu stroomlijn ik m weer hopelijk, door te migreren naar 1 topic.

Ik heb helaas geen toegang tot dat forum, maar jouw versie ziet er veelbelovend uit. Ik vind het alleen jammer dat je de zoekfunctie hebt verplaatst en verkleind. Dat vind ik toch wel het sterkste punt van de nieuwe tweakers site. Succes verder!

[runob]

_eXistenZ_ kan je resultaat toevoegen aan deze topic? Had hem graag geprobeerd maar ik kan ook niet op dat andere forum.

[Schnoop]

Inzending!

Schnoop

Zomaar een Stylesheet

Cascading Stylesheet:

body{background-color:#313232;}
#contentArea{background-color:#EDEEEE;padding-left:5px;}
#top{background-color:#313232;}
#contentArea{padding-top:0px;padding-right:10px;}
#search{position:absolute;top:-15px;right:220px;}
#searchbar{height:15px;}
.topBorder{background-color:#EDEEEE;}
#reacties
{
margin-left:15px;
}
.reactie{background: none repeat scroll 0 0 #EDEEEE;;background-color:#EDEEEE;}
.reactie .topBorder {
    background: url("http://degoeiekanjt.nl/reply_top.png") no-repeat scroll 0 0 transparent;
}
#menubar {
    border-radius: 5px;
    width: 800px;
    padding-left: 100px;
    padding-right: 100px;
    box-shadow: inset 0 0 10px #000;
}
table.listing td, table.listing th
{
padding: 5px;
}

Toelichting

Zelf kreeg ik hoofdpijn van de witte achtergrond. Vandaar deze stylesheet waar alles wat donerkerder is.
Zelf gebruik ik ook nog onderstaande regel om de highlighted items op de frontpage te verbergen (persoonlijke voorkeur).

Cascading Stylesheet:

.fpaItem{display:none;}

[Sando]

Wat ik me afvraag: Als Tweakers nog dagelijks updates doorvoert aan de markup (en css), ontstaan er dan niet dagelijks nieuwe fouten in je custom CSS omdat de markup (en originele css) steeds veranderen?

[Anoniem: 147126]

Inzending!

Shadow

Tweakers V8

Cascading Stylesheet:

html {
  display: none !important;
}

Toelichting

Ik hou wel van het nieuwe design. Mooi wit, strak en grote lege ruimtes. Content en useability zijn van secondair belang. Daarom heb ik besloten om het nog een stapje verder door te voeren, en alvast een preview te geven hoe de volgende versie (V8) van tweakers er waarschijnlijk uit komt te zien. Daarnaast werkt mijn design perfect op alle devices en schermresoluties en heb ik de CSS super compact en efficient kunnen houden!

[ChevyVan79]

Anoniem: 147126 schreef op zaterdag 20 oktober 2012 @ 15:10:
...

In het reglement staat dat de advertentie zichtbaar moeten blijven. Bij jou worden deze weggehaald.

Zolang je de advertenties maar laat zien is het volgens mij goed.

[CvDongen]

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 10:28:
*knip*

Echt een heerlijke layout, voor mij de fijnste die ik tot nu toe heb gebruikt! Dit is voor mij een reden om terug te gaan naar Firefox, haha.

Ik vind het echt heel mooi hoe je de donkergrijze menubalk van die ronde randjes hebt gegeven en hoe dat wit er dan simpelweg onderuit komt. Dat vond ik echt enorm lelijk gedaan in de 7.0 layout, en stoorde me daar ook aan. Dat de tracker er uit blijf is voor mij prima.

Enige minpunt is dat de ruimte tussen de nieuwstitel en de hoeveelheid reacties misschien wat groot is, maar dat zijn peanuts.

[Electrowolf]

Sando schreef op zaterdag 20 oktober 2012 @ 15:05:
Wat ik me afvraag: Als Tweakers nog dagelijks updates doorvoert aan de markup (en css), ontstaan er dan niet dagelijks nieuwe fouten in je custom CSS omdat de markup (en originele css) steeds veranderen?

Hier hebben we het inderdaad over gehad en verwachten dat dat wel los loopt. In het uiterste geval pas je je inzending voor de deadline nog aan zodat het wel werkt met de eventuele aanpassingen die je inzending anders helemaal vernachellen.

Anoniem: 147126 schreef op zaterdag 20 oktober 2012 @ 15:10:

Inzending!

[...]

Dat is een mooi wit vlak, ik dacht dat de meeste mensen juist minder ipv meer wit wilde .. iets mis gegaan met je plaatje posten?

[Caelorum]

Electrowolf schreef op zaterdag 20 oktober 2012 @ 16:10:
[...] Dat is een mooi wit vlak, ik dacht dat de meeste mensen juist minder ipv meer wit wilde .. iets mis gegaan met je plaatje posten?

Het is niet leuk als je een grapje moet uitleggen
Dat plaatje is goed. Zijn CSS verbergt alleen alle inhoud.

Sando schreef op zaterdag 20 oktober 2012 @ 15:05:
Wat ik me afvraag: Als Tweakers nog dagelijks updates doorvoert aan de markup (en css), ontstaan er dan niet dagelijks nieuwe fouten in je custom CSS omdat de markup (en originele css) steeds veranderen?

Ik heb mijn eigen CSS op twee punten moeten aanpassen. Ik vermoed dat het geheel wel los gaat lopen.

[Electrowolf]

Caelorum schreef op zaterdag 20 oktober 2012 @ 16:12:
[...]

Het is niet leuk als je een grapje moet uitleggen
Dat plaatje is goed. Zijn CSS verbergt alleen alle inhoud.

Bleh, skimde alleen even snel over het uiterlijk zonder echt de boel te lezen . Zal de volgende keer eerst even een goede bak koffie drinken .

[_eXistenZ_]

Anoniem: 147126 schreef op zaterdag 20 oktober 2012 @ 15:10:

Inzending!

Shadow

Tweakers V8

[afbeelding]

Cascading Stylesheet:

html {
  display: none !important;
}

Toelichting

Ik hou wel van het nieuwe design. Mooi wit, strak en grote lege ruimtes. Content en useability zijn van secondair belang. Daarom heb ik besloten om het nog een stapje verder door te voeren, en alvast een preview te geven hoe de volgende versie (V8) van tweakers er waarschijnlijk uit komt te zien. Daarnaast werkt mijn design perfect op alle devices en schermresoluties en heb ik de CSS super compact en efficient kunnen houden!

@ mensen hier boven die de mijne willen: Scroll wat naar boven voor een paar screenshots, en daar staat het userscript.

Wss ga ik de tracker met eigen javascript uitlezen en em op een fatsoenlijke plaatst tonen, dat tesamen met de auto-update-functie van GreaseMonkey (althans volgens mij doettie dat inmiddels wel) heeft mij doen besluiten om met een UserScript te starten ipv een kale CSS

Je kunt overigens op bovenstaande link wel gewoon de CSS uitlezen hoor

/edit

Inmiddels staat 1.0.4 live. Verbeteringen:

* Gele message header werkt zoals ie hoort
* Het forum is gestyled door Micha

[ Voor 10% gewijzigd door _eXistenZ_ op 20-10-2012 16:51 ]

[alex3305]

Inzending!

alex3305

Tweakers 7: UI Improved!

Cascading Stylesheet:

/* Uitvullen op de FP */ 
.article {text-align: justify;} 

/* Achtergrondkleur veranderd */ 
#layout, #myprofile h2, #mynotepad h2 {background-color: #fafafa !important;}  

/* Linkkleur veranderd FP */ 
table.highlights a, table.listing a {color: #000 !important;} 

 /* Linkkleur visited veranderd FP */ 
table.highlights a:visited, table.listing a:visited {color: #666 !important;} 

 /* Tijd rechts uitgelijnd en lichter gemaakt */ 
table.highlights .time, div#highlights > table.highlights > tbody > tr > td > span {color: #999; display: inline-block; float: right; } 

/* Titel kleur van Headers op GoT veranderd in wit */ 
table.listing th.title a {color: #fff !important;} 

/* Userdata weer klein zichtbaar */ 
.klipklap {display:none;}
.userdata .extra {display: block !important; font-size: 7pt}  

/* Abo highlighter */ 
.abonnee {color: #0A8FC4;}  

/* Action lijst kleiner gemaakt */ 
.topic_actions .action_list li {font-size: 9pt;}  

/* Sidebar weggehaald op forum */ 
#sidebar {display: none;}  

/* Forumberichten naar het midden verplaatst */ 
#messages {margin-left: 80px}  

/* Witruimte tussen berichten weggehaald */ 
#messages div.message {margin-bottom: 0px;}  

/* Eigen post gehighlight. Mooier dan de standaard :+ */ 
#messages div.message .ownpost {background-color: #D9ECFF !important;}  

/* Messageheader aangepast voor betere verschillen tussen twee berichten */ 
#messages div.message .messageheader {background-color: #ddd;}  

/* Messageheader aangepast voor TS */ 
#messages div.topicstarter .messageheader {background-color: #ccc;}  

 /* Pagecounter onderaan gefixed voor witruimte weghalen */ 
#messages p.pagecounter {display: block; margin-top: 15px} 

/* Topic actions gefixed */ 
.topic_actions {width: 980px;}  

/* Actielijst gefixed */ 
.topic_actions .action_list {font-size: 8pt;} 

/* Action lijst: Weghalen van Reageer! */
.topic_actions .action_list li:before {content: " "; margin: 0;}
.topic_actions .action_list li:first-child {display:none;}

/* Topic Action List dinges ook gefixed met achtergrondjes -- Deel 1 */
.topic_actions .action_list li a {background: #D9ECFF; padding: 3px 5px; border-radius: 1px; display: inline-block; margin-right: 7px}

/* Kleurtjes voor Topic Reports */
.topic_actions .action_list li a[title^="Rapporteer dit topic"] {background: #b98013; color: #fff;} /* Eigenlijk voor de tussenstaat, maar heb ik momenteel geen tekst van */
.topic_actions .action_list li a[title$="je laatste report is nog niet gelezen"] {background: #B9133C; color: #fff;}
.topic_actions .action_list li a[title$="je laatste report is afgehandeld"] {background: #42b913; color: #fff;}
.topic_actions .action_list li a[title="Rapporteer dit topic"] {background: #D9ECFF; color: #024368;}

/* Deel 2 van TAL */
.topic_actions .action_list li a:hover {background: #0A8FC4; color: #fff; text-decoration: none;}

 /* Reply-count fatsoenlijk leesbaar gemaakt in topic overview */ 
.listing .commentCount, .replies {color: black; background: none;} 

/* Social, Newsletter en Jobs meuk weggehaald op de FP */ 
.secondColumn #social, .secondColumn #jobs, .secondColumn #newsletter {display: none;}  

/* Topic Reply waarschuwing in het midden */ 
#topicReplyWarning p {margin-left: 0; text-align: center;}

/* Laatst gereageerd in een topic dikdrukken */
table.listing .topic a[title$="alex3305"] {font-weight: bold}

/* Tracker verbergen */
.tracker {display:none;}

/* Ruimte tussen fora en topics minder gemaakt. Scheelt nu 4px, je kunt zelf de 8px waarde verminderen om een nog compactere layout te krijgen */
table.listing td, table.listing th {padding: 8px 5px;}
table.listing .ind {width: 30px} table.listing .frm {width: 40px;}
.meukTable table.listing td, table.listing th {padding: 7px 0;} /* Fix voor meuktracker */

/* Transparante topborder voor alternatieve achtergronden */
.topBorder, .eenReactie .topBorder, .reactie .topBorder {background: transparent url(http://tweakers.net/ext/f/dnI1SO8bL4GhWrKc7T28EBNN/full.png) !important;}

/* Onderwerpen en gerelateerd in het lichtblauw zoals op de FP */
.relevancyColumn {padding: 15px 15px 17px; border: 1px solid #DDDEDE; border-radius: 1px; background: #EDEEEE; background-image: -webkit-linear-gradient(#F5F6F6,#EDEEEE); background-image: -moz-linear-gradient(#F5F6F6,#EDEEEE); background-image: linear-gradient(#F5F6F6,#EDEEEE); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .33); margin-left: 0px; width: 310px}

/* Pricewatch blok strak uitgelijnd in de onderwerpen en gerelateerd block bij artikelen */
.relevancyColumn .relatedBlock {border: none; background: none; background-image: none; -webkit-box-shadow: none; box-shadow: none;}
.relevancyColumn .popularProductListing {margin-left: -15px;}
.relevancyColumn .popularProductListing .sortable {min-width: 300px;}

/* Reacties zoals mijn stijl @ GoT */
.reacties {background: #fff; border: #DDDEDE; padding-bottom: 10px; margin-bottom: 20px;}
.reacties > .reactie {background: none; padding-left: 0px; border: none;}
.reacties > .reactie, .eenReactie {margin-top: 0;}
.eenReactie .topBorder {display: none;}
.reactieHeader {background: #eee;}
#reacties .reactie {border-left: none;}

.reactieBody.hidden, .reactieBody.informative, .reactieBody.spotlight {margin-left: 0; padding-left: 0;}
.reactieBody.informative, .reactieBody.spotlight {border: none !important;}
.reactieBody.informative > .reactieFooter, .reactieBody.spotlight > .reactieFooter {margin-bottom: 0;}

.reactieHeader {padding-left: 10px;}
.reactieContent {padding: 10px 10px 15px 10px;}
.reactieFooter {padding:  0 10px 10px 10px;}

#reactieForm {padding-left: 10px;}
table.nextPrevious, .nextPrevLinks {margin-bottom: 0;}

/* Donkere zoekbar met leesbaar True-logo */
#searchbar {background: #666; background-image: -webkit-linear-gradient(#5a5a5a,#515151); background-image: -moz-linear-gradient(#666,#555); background-image: linear-gradient(#666,#555); border-radius: 6px 6px 0 0; border-top: 1px solid #aaa; color #fff;}
a#true {display: block; width: 48px; height: 25px; background: transparent url(http://tweakers.net/ext/f/wGX6Wtpc1n5MxlQxKoEZ0SAw/full.png) no-repeat 0 0;}
img[alt="True logo"] {display: none;}

/* Home weghalen op het forum in de Breadcrumbs */
#forumheading .breadcrumb a:first-of-type, #forumheading .breadcrumb span:first-of-type, #footer .breadcrumb a:first-of-type, #footer .breadcrumb span:first-of-type {display: none;}

/* Pagecounter netjes maken */
.pagecounter a {background: #D9ECFF; padding: 3px 5px; border-radius: 1px;}
.pagecounter a:hover {background: #0A8FC4; color: #fff;}

/* Preview op het forum en notities op het forum netjes maken */
.formsubmit input[value="Verstuur bericht"], #mynotepad input[value="Notitie opslaan"] {font-weight: bold;}
.formsubmit input[value="Bekijk bericht"], .formsubmit input[value="Toon voorbeeld"], #mynotepad input[value="Bekijk notitie"] {background: #D9ECFF; padding: 5px 9px 6px 9px; border-radius: 1px; display: inline-block; color: #024368; border: none;}
.formsubmit input[value="Bekijk bericht"]:hover, .formsubmit input[value="Toon voorbeeld"]:hover, , #mynotepad input[value="Bekijk notitie"]:hover {background: #0A8FC4; color: #fff; text-decoration: none;}

/* Modfilter tekst weghalen zodat er geen overflow meer is bij veel comments. */
#reacties > .filterBox > .modFilter > .label {display:none;}

/* Table listing van DM lijst fixen */
table.listing.dm td {background: #EDEEEE; background-image: -webkit-linear-gradient(#F1F2F2,#EDEEEE); background-image: -moz-linear-gradient(#F1F2F2,#EDEEEE); background-image: linear-gradient(#F1F2F2,#EDEEEE);}

/* Profiel centreren met witte achtergrond */
.galleryHeadingContainer + .pageTabsContainer > .pageTabs {width: 620px;}
.galleryBody {margin: 0 0 0 150px; padding: 15px 20px; background: #fff; border: 1px solid #ccc;}
.galleryBody ~ #reacties {width: 660px; margin-left: 150px;}
.galleryBody ~ #reacties > .reacties {background: #fafafa;}
.galleryBody ~ #reacties > .reacties > .reactie {background: #fff;}
.galleryBody ~ #reacties > .reacties > .reactie:last-child {background: #fafafa; margin-top: 10px;}
.galleryBody ~ .sidebar > .vaStatistics {width: 640px; margin-left: 150px;}

/* Actieve tabs overal hetzelfde */
.pageTabs li.active a, #forum_tabs li.active a, #fp_tabs li.active a {color: #B9133C; background: #fafafa}

/* Nieuwsberichten tijd in het rood wanneer nieuw zoals op Tweakers 6 */
#news .highlights .new + td > span.time, #highlights .highlights .new + td > span.time {color: #B9133C;}

/* Overal fancy blok achtergrondjes */
.popularUserReviewsBlock, .popularEditorialReviewsBlock, .popularProductListing {border: 1px solid #DDDEDE; border-radius: 1px; background: #EDEEEE; background-image: -webkit-linear-gradient(#F5F6F6,#EDEEEE); background-image: -moz-linear-gradient(#F5F6F6,#EDEEEE); background-image: linear-gradient(#F5F6F6,#EDEEEE); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .33); padding: 15px 15px 17px;}

.latestAanbod, .searchAanbod, .userAanbod, #jobContent {border: 1px solid #DDDEDE; border-radius: 1px; background: #EDEEEE; background-image: -webkit-linear-gradient(#F5F6F6,#EDEEEE); background-image: -moz-linear-gradient(#F5F6F6,#EDEEEE); background-image: linear-gradient(#F5F6F6,#EDEEEE); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .33);}

.popularUserReviewsBlock, .popularEditorialReviewsBlock {width: 450px}
.popularProductListing {width: 590px;}
.latestAanbod .listing, .userAanbod .vaUserAds, .userAanbod .addUserAd, .userAanbod .listing, .vaReadmore {padding: 0 15px;}
.searchAanbod #nearbyAdForm {background: none;}
#jobContent {width: 615px;}

/* V&A header in stijl met de rest -- Aanbevolen met bovenstaande fancy blokjes */
.vaPortalColumnLeft .bar, .searchAanbod .bar, .userAanbod .bar {font-weight: normal; font-size: 18px; line-height: 22px; font-family: "HelveticaNeue-CondensedBold","Helvetica Neue Bold Condensed","Roboto Bold Condensed","Arial Bold","Helvetica Bold","Liberation Sans Bold",arial,helvetica,sans-serif; font-weight: normal; min-height: auto; margin: 15px 0 15px 15px; padding: 0; color: #B9133C; background: none;}

/* Gallery fix */
.galleryBody .galleryInnerTable .paddingLeft {width: 230px;}

Toelichting

Door verschillende, maar ook meestal kleine aanpassingen heb ik Tweakers 7 in zoverre verbeterd dat het nu veel makkelijker is om er doorheen te browsen. De witruimte is dan wel niet veel verminderd, maar toch zijn er wat subtiele details toegevoegd. Denk dan aan wat meer kleurtjes bij knoppen of het weghalen van het icoontje van het aantal topic-replies. Ook zit hier weer de TR-kleur functionaliteit in, die zo gewild is bij de notoire verklikkers .

Ook is het forum en de Gallery pagina van de gebruikers naar het midden verplaatst, wat gewoon lekkerder leest. En de vergeten headers bij zowel de V&A als IT Jobs zijn gefixed naar de nieuwe T7-headers. Ook is het 'stomme' Home knopje op het forum weg . Al met al ben ik best tevreden met deze layout en denk ik dat zo Tweakers gewoon wat bruikbaarder is .

[ Voor 0% gewijzigd door alex3305 op 23-10-2012 15:25 . Reden: Miniscule bugfix geplaatst :$. ]

[David Mulder]

Electrowolf schreef op zaterdag 20 oktober 2012 @ 16:10:

[...]

Dat is een mooi wit vlak, ik dacht dat de meeste mensen juist minder ipv meer wit wilde .. iets mis gegaan met je plaatje posten?

code:

body{ background:black;}
body * { display: none !important; }

Minder wit, ook goed

---

Maar ik zat net te denken (ik zou nu druk bezig moeten zijn met iets anders), kan er geen optie komen dat je optioneel

code:

<meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' />

kunt laten toevoegen aan de html?

[alex3305]

David Mulder schreef op zaterdag 20 oktober 2012 @ 16:47:
[...]

Maar ik zat net te denken (ik zou nu druk bezig moeten zijn met iets anders), kan er geen optie komen dat je optioneel

code:

<meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' />

kunt laten toevoegen aan de html?

Nee dat is lekker, een gebruiker niet meer mogen laten resizen. Leuk voor mensen met een visuele beperking joh .

[David Mulder]

alex3305 schreef op zaterdag 20 oktober 2012 @ 16:49:
[...]

Nee dat is lekker, een gebruiker niet meer mogen laten resizen. Leuk voor mensen met een visuele beperking joh .

Heb je nu echt geen flauw idee waar die regel voor bedoeld is of zit je nu gewoon express te trollen? Want als je niet zat te trollen; natuurlijk wil je niet dat de gebruiker resized als je een mobiele/tablet interface voorschoteld. En voor mensen met visuele beperkingen bestaan er *heel* andere tools (dubelle zoom van alle interfaces bijvoorbeeld waarbij de doorgegeven resolutie gewoon een keer zo laag is)

[alex3305]

David Mulder schreef op zaterdag 20 oktober 2012 @ 16:53:
[...]

Heb je nu echt geen flauw idee waar die regel voor bedoeld is of zit je nu gewoon express te trollen? Want als je niet zat te trollen; natuurlijk wil je niet dat de gebruiker resized als je een mobiele/tablet interface voorschoteld. En voor mensen met visuele beperkingen bestaan er *heel* andere tools (dubelle zoom van alle interfaces bijvoorbeeld waarbij de doorgegeven resolutie gewoon een keer zo laag is)

. En die werken niet meer met die regel, vriend. Daarnaast wil een slechtziende ook gewoon een browser gebruiken op een mobiel apparaat.

[ Voor 6% gewijzigd door alex3305 op 20-10-2012 16:58 ]

[_eXistenZ_]

Inzending!

_eXistenZ_

Tweakers 7.5 - zie existenznl.tweakblogs.net voor de laatste versie

Ik raad aan om het userscript te installeren, hier verkrijgbaar.
De redenen hiervoor zijn:
- Mogelijkheid tot autoupdate bij degenen die de style geinstalleerd hebben via GreaseMonkey in Fx.
- Ik ga JS nodig hebben voor het fixen van de tracker, deze komt op een logische plek in de site.

Als je alleen de CSS wil staat die hieronder (van versie 1.0.4), maar hou rekening mee dat in versie 1.1 JS wordt toegevoegd voor de tracker op de homepage, die je dan dus misloopt.

Cascading Stylesheet:

/*
 * Global styles
 */

body {
    background: #444;
}

h1, h2, h3, p {
  margin: 0 0 10px;
}

#menubar {
    width: 1020px;
    border-radius: 8px 8px 0 0;
    height: 32px;
    margin-bottom: 36px;
    z-index: 1;
}

#searchbar {
    width: 1020px;
    height: 0px;
    margin: 0 auto;
    background: none;
    position: relative;
}

    #search {
        position: absolute;
        width: 286px;
        right: 20px;
        top: 22px;
        padding: 0;
    }

        #search .keywordSearch {
            width: 176px;
            height: 24px;
            margin-top: 4px;
        }

        #search input.text {
            width: 120px;
            height: 16px;
            font-size: 12px;
            padding: 5px 10px 3px;
        }

        #search input.submit {
            height: 24px;
            background-position: 1px -75px;
        }
        
        .mainSearchSuggest {
            margin-left: -311px;
        }

.galleryHeadingContainer, /* High header content */
.pageTabsContainer,
.notificationsContainer,
#tabs,
#tweakbase {
    margin: 0 auto;
    width: 1020px;
}

.notificationsContainer {
    padding-top: 62px;
}

#b_tb { /* Top banner */
    margin-left: 0;
}

#contentArea {
    background: #fff;
    padding: 24px 20px 166px;
}

#bottom .hr {
    display: none;
}

/*
 * End of Global styles
 */

/*
 * Frontpage
 */

#fpaItems {
    margin-bottom: 10px;
    float: right;
    width: 330px;
    border: 1px solid #dddede;
    background: 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: -42px;
                }

            .fpaItem div.textContainer {
                background-color: #000;
                opacity: 0.8;
                width: 100%;
                height: auto;
                font-size: 12px;
                line-height: 1.4em;
                padding: 4px;
                position: absolute;
                bottom: 0;
            }

#fp_tabs_container {
    margin-bottom: 10px;
    height: 31px;
}

#fp_tabs {
    padding-top: 0;
}

table.highlights {
    margin-bottom: 15px;
}

    table.highlights td {
        padding: 3px 0;
    }

.secondColumn .fpItem {
  margin-bottom: 10px;
}

/*
 * End of frontpage
 */

/*
 * Article detail page
 */
 
.articleColumn {
    line-height: 1.4em;
}
 
/*
 * End of article detail page
 */

/*
 * GoT
 */

#forum_tabs {
    padding-top: 0;
}

.reactie {
    line-height: 1.4em;
}

#community li {
    padding: 5px 0;
}

table.listing td,
table.listing th {
    padding: 2px 5px;
}

table.listing td.tags {
    overflow: hidden;
    white-space: nowrap;
}

.channelHeader {
    display: none;
}

#messages div.message .messageheader {
    background-color: #ddd;
}

#messages div.message {
    margin-bottom: 0px;
}
 
#title { 
    height: 50px;
}

    #title p.mods {
        display: none; 
    }

#messages, .topic_actions { 
    overflow: hidden;
}

/*
 * End of GoT
 */

Toelichting

Aangezien de nieuwe T.net-site in mijn optiek nog wel iets positieve invloed kon gebruiken heb ik, geinspireerd door het bekijken van verschillende stijls, mijn eigen stylesheet geschreven van scratch, deze plaatst onder andere de zoekbalk op een logische plek, en toont de 4 artikelen met een plaatje in de rechterbalk.

Er wordt direct getest in meerdere browsers, en rekening gehouden met edge cases, zoals de mogelijkheid dat iemand je een DM stuurt waardoor het design in elkaar zou flikkeren. Versiebeheer gebeurt zoals gezegd d.m.v. UserScripts.org, als je Firefox gebruikt met Greasemonkey worden als het goed is de laatste versies vanzelf binnengetrokken. Ook worden goede voorstellen van andere GoTTers (zoals een stukje theming van GoT) getest en opgenomen in de theme, iedereen kan in principe dus meehelpen aan mijn stijl!

[ Voor 54% gewijzigd door _eXistenZ_ op 21-10-2012 17:28 ]

[David Mulder]

alex3305 schreef op zaterdag 20 oktober 2012 @ 16:57:
[...]

. En die werken niet meer met die regel, vriend. Daarnaast wil een slechtziende ook gewoon een browser gebruiken op een mobiel apparaat.

Zoals ik zei zijn er tal van tools voor slechtzienden en het laatste wat ze doen is kijken of ze wel of niet mogen inzoomen. En als slechtziende wil je ook niet met de hand iedere keer inzoomen, want dat is echt een ramp met langere regels enzo. En voor blinden heb je ook weer totaal andere software... bah, ik heb echt het gevoel dat ik hier getrolled word. Of geloof jij nu echt dat HTML5 apps evil zijn omdat ze niet met de standaard inzoom functionaliteiten in de browser werken? Want in dat geval kunnen we echt terug naar zwarte tekst op een witte achtergrond en verder niets.

[ Voor 15% gewijzigd door David Mulder op 20-10-2012 17:03 ]

[CLB]

Die CSS-templates / lappen tekst? Die kan ik gewoon simpelweg copy-pasten in 'n venstertje als ik Custom CSS heb 'aangekocht' voor 500 karmapunten toch? Dan ga ik dat maar is aanschaffen en wat testen
Ben een totale n00b op dat gebied dus daarom... Haal ik dat CSS-vak leeg heb ik weer de 'eigen' Tweakers?

[_eXistenZ_]

Jup

[CLB]

Okee lachen, fijn dit topic! Begrijp er al niks van, laat staan van dat Greasemonkey, plugins voor Chrome (wat ik dan wel weer gebruik) en alle heisa eromheen... Dit topic is only Custom CSS van Tweakers zelf, CLB-proof!

Dank allen, hoop dat er nog een paar mooie dingen bij komen... Vandeweek is 'aankopen' en testen!

[alex3305]

.weg.

[ Voor 104% gewijzigd door alex3305 op 20-10-2012 17:09 ]

[_eXistenZ_]

CLB schreef op zaterdag 20 oktober 2012 @ 17:06:
Okee lachen, fijn dit topic! Begrijp er al niks van, laat staan van dat Greasemonkey, plugins voor Chrome (wat ik dan wel weer gebruik) en alle heisa eromheen... Dit topic is only Custom CSS van Tweakers zelf, CLB-proof!

Dank allen, hoop dat er nog een paar mooie dingen bij komen... Vandeweek is 'aankopen' en testen!

Mijn style kan vanaf 1.1 mooie dingen op de homepage, die ga je dan mislopen...

[CLB]

Ik ga me ook nog wel verdiepen in die andere zut... (gebruik Chrome als browser)

[_eXistenZ_]

.weg.

[ Voor 96% gewijzigd door _eXistenZ_ op 20-10-2012 17:21 ]

[Hasosoft]

Inzending!

Hasosoft

Tweakers 7 donker (excl GoT)

Cascading Stylesheet:

html
{
    background-color:#222;
}

#menubar
{
    width:100%;
}

div#top
{
    border-bottom:#000 0 solid;
}

div#contentArea
{
    background-color:#333;
    padding-left:20px;
    padding-right:20px;
    border:#c3c6c6 1px solid;
}

html #bottom div.hr
{
    background:none;
    height:0;
}

#ticker
{
    background-color:#212323;
    border-top:1px solid #444;
}

#searchbar
{
    background-color:#222;
    background-image:-moz-linear-gradient(#333,#222);
    background-image:-webkit-linear-gradient(#333,#222);
    background-image:linear-gradient(#333,#222);
}

.pageTabs li
{
    background-color:#444;
    background-image:-moz-linear-gradient(#333,#222);
    background-image:-webkit-linear-gradient(#333,#222);
    background-image:linear-gradient(#333,#222);
}

.pageTabs li.active
{
    background-color:#444;
    background-image:-moz-linear-gradient(#444,#333);
    background-image:-webkit-linear-gradient(#444,#333);
    background-image:linear-gradient(#444,#333);
}

.pageTabs li p,.pageTabs li a
{
    color:#ddd;
}

#fp_tabs li.active a
{
    color:#fff;
}

.frontPageLink:visited
{
    color:#cc56be;
}

a
{
    color:#0483cc;
    text-decoration:none;
}

.relatedContent a
{
    color:#0483cc;
}

p.author,p.author a
{
    color:#c6cccc;
}

body
{
    color:#ddd;
}

#pricewatch,#jobs,#poll,#newsletter,#sponsored,#textlink,#social .twitterButton,#social .facebookButton
{
    border:1px solid #DDDEDE;
    border-radius:1px;
    background:#444;
    background-image:-moz-linear-gradient(#555,#444);
    background-image:-webkit-linear-gradient(#555,#444);
    background-image:linear-gradient(#555,#444);
}

.reactie
{
    background:#333;
}

.reactieBody.informative
{
    background-color:#4b4d4b;
    border:1px solid #CFD4C9;
}

.reactieBody.hidden
{
    background-color:#4c4d4d;
    border:1px solid #D9DBDB;
    cursor:pointer;
}

#toggleButtonTxt
{
    display:inline-block;
    background:none;
}

.reviewToc a
{
    color:#fff;
    text-decoration:none;
}

#tweakbase
{
    background:#222;
}

#tabs
{
    background:#222;
}

.commonSpecBlock
{
    border:1px solid #222;
    border-radius:1px;
    background:#EDF4F6;
    background-image:-moz-linear-gradient(#222,#333);
    background-image:-webkit-linear-gradient(#222,#333);
    background-image:linear-gradient(#222,#333);
}

.productEditionListing.commonSpecBlock .showLink,.productEditionListing.commonSpecBlock .hideLink
{
    cursor:pointer;
    color:#0483cc;
}

#filter
{
    background:#EDEEEE;
    background-image:-moz-linear-gradient(#222,#333);
    background-image:-webkit-linear-gradient(#222,#333);
    background-image:linear-gradient(#222,#333);
}

#scorecardView
{
    background-color:#333;
}

h3,h3 a
{
    color:#FFF;
}

#scorecard .scores
{
    background-color:#222;
}

#scorecard .scores .arrow
{
    display:none;
}

.tweakbaseHeader .subtitle .bulletSeparatedList a
{
    color:#0483cc;
}

#breadCrumbListing span
{
    color:#0483cc;
}

a.fancyCheckbox
{
    color:#0483cc;
}

.pageTabs li p,.pageTabs li a:hover
{
    color:#0483cc;
}

.reactie .topBorder
{
    background:#666;
}

Toelichting

Ik vind helemaal niet dat ik de beste css gemaakt heb, wilde echter wel even delen wat ik in een half uurtje gedaan heb om het lezen wat prettiger te maken, wellicht heeft iemand anders er nog wat aan.

http://userstyles.org/sty...weakers-7-donker-excl-got

[i-chat]

even een update over die php vraag .. blijkbaar heeft niemand hier van @import gehoord, een php generated css is al vaker gedaan oa voor tnet v6...

[Hero of Time]

i-chat schreef op zaterdag 20 oktober 2012 @ 17:40:
even een update over die php vraag .. blijkbaar heeft niemand hier van @import gehoord, een php generated css is al vaker gedaan oa voor tnet v6...

En wat wil je daar mee zeggen? Moet de competitie het toe staan dat er off-site CSS gebruikt wordt? Ik vind van niet. Alle CSS moet in de Custom CSS optie kunnen, niet via een @import omweg.

[mjtdevries]

@_eXistenZ_

Je bent geweldig!

Je hebt 90% van alle klachten over de nieuwe interface opgelost met die CSS. Ik hoop van harte dat de crew over hun eigen schaduw heen stapt en hier serieus naar gaat kijken.

[F.West98]

En dat kan dus ook allemaal in de Custom CSS ding. Ik wou het eigenlijk ook gaan gebruiken om user-afhankelijke features adhv je username goed te krijgen.
Dus als jij laatst had gereageerd, dan een andere opmaak van de titel. Nu zelf invoeren, dan automatisch door het script.

[Mektheb]

ik ben erg noob met het CSS, maar ik heb de functie gekocht waar kan ik het invullen ?.

[Quad]

Dus nu moet je wil je custom CSS toepassen overstappen van IE9 naar FF/Chrome..? Dat nooit!!

Ik ben eigenwijs, en IE9 betekend alles voor mij, en ik vind het fantastisch wat jullie allemaal doen, maar ik laat het Tweakers toch een mogelijkheid geven om veel dingen mooi te fixen

[MueR]

i-chat schreef op zaterdag 20 oktober 2012 @ 17:40:
even een update over die php vraag .. blijkbaar heeft niemand hier van @import gehoord, een php generated css is al vaker gedaan oa voor tnet v6...

@import is trage meuk en veroorzaakt langere pageloads door delayed loading. Wil je niet gaan doen.

[zeef]

Quad schreef op zaterdag 20 oktober 2012 @ 20:14:
Dus nu moet je wil je custom CSS toepassen overstappen van IE9 naar FF/Chrome..? Dat nooit!!

Ik ben eigenwijs, en IE9 betekend alles voor mij, en ik vind het fantastisch wat jullie allemaal doen, maar ik laat het Tweakers toch een mogelijkheid geven om veel dingen mooi te fixen

Dat is wel het idee, een mooie fix voor iedereen. Dat kost even wat tijd maar dan hebben we iets goeds.

[pedorus]

Na wat leenwerk van http://userstyles.org/sty...eakers-7-0-grey-compacted en Caelorum in "De Devschuur Coffee Corner - Iteratie 2" heb ik nu Tweakers welcome to the dark side, we have cookies (CSS) . De eerste 4 regels zijn optioneel. Met screenshots op 664 pixels hoogte (standaard cheapo/oude laptop scherm), en rechts wat je normaal zou zien zonder custom CSS:
Frontpage

Reacties

Myreact(profiel en notepad openen bij hover, net als het profiel op elke pagina trouwens)

Active topics

Forum


(Dit is geen officiële inzending vanwege het leenwerk, en het gebrek aan verdere tijd, en er is toch vast iemand die dit beter kan. Het had daarom ook in SG gekunt, maar daar kan niet iedereen in. Mijn deel van de hier gelinkte code is public domain, dus doe er je voordeel mee.)

Ik wil de search bar ook wel als in _eXistenZ_ in "Tweakers 7 Ultimate CSS Competition - Inzendtopic" (mooi!), maar helaas overlapt dat met dingen in de pricewatch, en er is geen element of id beschikbaar om dat deel van de css dan achterwege te laten te maken lijkt wel. Vacatures blijft lelijk. maar dat is in de normale css ook zo.

Mektheb schreef op zaterdag 20 oktober 2012 @ 20:11:
ik ben erg noob met het CSS, maar ik heb de functie gekocht waar kan ik het invullen ?.

https://secure.tweakers.net/my.tnet/preferences vinkje plaatsen bij "Persoonlijke stylesheetinstellingen gebruiken" en CSS in het vakje pasten.

[Tsurany]

Even een tip: niet elke custom CMS die hier gepost wordt werkt goed met een resolutie van 1280*1024, lijkt mij wel handig dat hier rekening mee gehouden wordt
Gebruik nu die van _eXistenZ_, werkt erg goed

[michaelscott]

@_eXistenX_ Geweldige CSS, probeer hem ook te installeren, maar dan geeft die een error(google chrome). Enig idee waar dat aan zou kunnen liggen?

[CLB]

Mektheb schreef op zaterdag 20 oktober 2012 @ 20:11:
ik ben erg noob met het CSS, maar ik heb de functie gekocht waar kan ik het invullen ?.

Bij je voorkeuren, vinkje bij CSS aanzetten, dan staat daar pool het CSS-vak

[twixx]

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 16:59:
Ik raad aan om het userscript te installeren, hier verkrijgbaar.
De redenen hiervoor zijn:
- Mogelijkheid tot autoupdate bij degenen die de style geinstalleerd hebben via GreaseMonkey in Fx.
- Ik ga JS nodig hebben voor het fixen van de tracker, deze komt op een logische plek in de site.

Als je alleen de CSS wil staat die hieronder (van versie 1.0.4), maar hou rekening mee dat in versie 1.1 JS wordt toegevoegd voor de tracker op de homepage, die je dan dus misloopt.

Echt goed! Complimenten. Ik heb Greasemonkey erbij staan voor de tracker straks.

[F.West98]

Quad schreef op zaterdag 20 oktober 2012 @ 20:14:
Dus nu moet je wil je custom CSS toepassen overstappen van IE9 naar FF/Chrome..? Dat nooit!!

Ik ben eigenwijs, en IE9 betekend alles voor mij, en ik vind het fantastisch wat jullie allemaal doen, maar ik laat het Tweakers toch een mogelijkheid geven om veel dingen mooi te fixen

Nee hoor hoeft niet. Gewoon de CSS code kopiëren en invullen bij je voorkeuren van tnet en je hebt het in alle browsers

[Caelorum]

pedorus schreef op zaterdag 20 oktober 2012 @ 20:34:
Na wat leenwerk van http://userstyles.org/sty...eakers-7-0-grey-compacted en Caelorum in "De Devschuur Coffee Corner - Iteratie 2" [...]

Ik hoop dat je de bugs hebt weggewerkt. Heb er nogal wat moeten fixen ^^

[CLB]

Ik heb die Tweakers 7.5 ingesteld van: _eXistenZ_ in "Tweakers 7 Ultimate CSS Competition - Inzendtopic"

Gewoon die code gecopy-pasted, in custom CSS van Tweakers, werkt heel goed, erg fijn...
Maar wat is dit dan precies?

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 16:59:
Ik raad aan om het userscript te installeren, hier verkrijgbaar.
De redenen hiervoor zijn:
- Mogelijkheid tot autoupdate bij degenen die de style geinstalleerd hebben via GreaseMonkey in Fx.
- Ik ga JS nodig hebben voor het fixen van de tracker, deze komt op een logische plek in de site.

Als je alleen de CSS wil staat die hieronder (van versie 1.0.4), maar hou rekening mee dat in versie 1.1 JS wordt toegevoegd voor de tracker op de homepage, die je dan dus misloopt.

En kan dat ook in Google Chrome?

En over die tabjes bovenaan, werelds!
MAAR, kan die 'FAQ' ook weg en kan ik daar ook 'Posthistory' plaatsen bijvoorbeeld...

EN kunnen die tabjes ook verschijnen als ik in een topic zit, zoals onderstaande (snelle) mockup?

Zo kan ik als ik in een topic zit te lezen, in 1x m'n posthistory zien, waar ik vaak / altijd mee werk(te)

EN het liefste ook nog een mogelijkheid om die tabjes zelf in te stellen qua volgorde...
Zodat ik ff kan uitvogelen wat ik het beste vind en iedereen persoonlijk kan instellen hoe hij het wil...

Ik zal ook dat scriptje wel even induiken om te kijken of ik zoiets zelf kan, maar 't is nu ff too much

EDIT: En de zoekbalk zie ik even als ik het script instel maar verdwijnt dan als sneeuw voor de zon...
Maar zit niet op m'n eigen laptopje met Full HD scherm en Google Chrome.. Zit nu op IE9 met 1366x768..

[ Voor 6% gewijzigd door CLB op 20-10-2012 22:35 ]

[tHe_BiNk]

@ _eXistenZ_ Geweldig die custom CSS, de site wordt weer overzichtelijk en bruikbaar.

[Muchachooo]

_eXistenZ_ hulde! Ik ben van mening dat Tweakers 7 zeker een mooie update is, maar ik moet zeggen dat jouw CSS het allemaal nog net een tikje verbetert! Dank!

[Anoniem: 44492]

@_eXistenZ_ super stylesheet, dit ziet er erg goed uit!

[Anoniem: 235591]

Ik hou dit in de smiezen want ik heb er geen kaas van gegeten. Zodra _eXistenZ_ het ook beschikbaar maakt voor Chrome, of variant daarvan, pas dan ga ik het gebruiken. De tracker is mij heilig omdat ik daar het meeste op kijk voor updates.

[Bierkameel]

Anoniem: 235591 schreef op zondag 21 oktober 2012 @ 00:46:
Ik hou dit in de smiezen want ik heb er geen kaas van gegeten. Zodra _eXistenZ_ het ook beschikbaar maakt voor Chrome, of variant daarvan, pas dan ga ik het gebruiken. De tracker is mij heilig omdat ik daar het meeste op kijk voor updates.

Bij mij werkt de code van _eXistenZ_ gewoon onder Chrome via Stylish, de tracker werkt ook.





Even deze installeren: http://userstyles.org/styles/76816/tweakers-old-background
De huidige code overschrijven door die van _eXistenZ en op Save klikken

[Anoniem: 235591]

Als je alleen de CSS wil staat die hieronder (van versie 1.0.4), maar hou rekening mee dat in versie 1.1 JS wordt toegevoegd voor de tracker op de homepage, die je dan dus misloopt.

Loop ik dan niet de kans dat ik de tracker misloop in 1.1? Laten we wel zijn: ik ben een totale leek op dit hele script gebeuren.

[MikeyMan]

Existenz; mooie CSS; mis alleen persoonlijk de volgende dingen:
- search ontbreekt
- Tracker loopt niet mee

Maar verder toppie!

[THWIT]

deus4 schreef op zaterdag 20 oktober 2012 @ 14:08:
Hey,

Mijn vriendin heeft gisteren ook even lopen spelen met de layout, zie hier het resultaat.

Geen idee waarom hij m'n plaatje niet weergeeft, dan maar de link: http://imageshack.us/photo/my-images/845/tweakers71.png/
[afbeelding]
-De zoekbalk is verplaatst, net als de link naar je account.
-Extra knop Tweakblogs toegevoegd.
-De hele reeks onnodige tabs weggehaald.
-achtergrondkleur minder wit
-meer info/vierkante cm

-Meuktracker met fictieve content opnieuw toegevoegd.

To do: om de een of andere idiote reden staat nu in het nieuws alles door elkaar: nieuws, .Plans, software updates etc etc. Dit moet weer netjes gescheiden worden. Dit kan echter niet eenvoudig met css

Helaas is er meer dan alleen wat css voor nodig geweest om de pagina zo te maken... Vandaar dat ik geen stukje code mee stuur...

Gebruik deze link voor je plaatje, dan doet hij het wel
http://imageshack.us/a/img845/2423/tweakers71.png

btw, mooi gemaakt!

[lolgast]

Ik dacht het ook even snel in te stellen, te laag karma -.- Wel een goede reden om wat actiever te zijn, ik zie een hoop mooie dingen voorbij komen!

[Anoniem: 225842]

Wow Redsandro Desktop 2 is voor mij de winnaar op het moment

[Lizard]

@_eXistenZ_ Net je userstyle werkt hier niet op FF17 beta met GM 1.4. Als ik de userstyle handmatig installeer, werkt deze gedeelteijk, maar het ziet er dan niet zo uit als in je screenshots.

[_eXistenZ_]

Lizard schreef op zondag 21 oktober 2012 @ 13:58:
@_eXistenZ_ Net je userstyle werkt hier niet op FF17 beta met GM 1.4. Als ik de userstyle handmatig installeer, werkt deze gedeelteijk, maar het ziet er dan niet zo uit als in je screenshots.

Kun je me PMen met je OS, browser(-versie) en een geüpload screenshotje? Dan bekijk ik het effe

@ iedereen: Tweakers 1.1.0 staat online (met inline tracker), zie _eXistenZ_ in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"

http://exhost.nl/etc/twea...e_topic/tweakers-ex-8.jpg <-- voor de mensen die niet in SG kunnen

[webinn]

_eXistenZ_ schreef op zaterdag 20 oktober 2012 @ 10:28:
Tweakers 7.5 heeft weer een update gekregen:

Erg mooie style! Op die manier is de FP weer leesbaar...