Cookies op Tweakers

Tweakers is onderdeel van DPG Media en maakt gebruik van cookies, JavaScript en vergelijkbare technologie om je onder andere een optimale gebruikerservaring te bieden. Ook kan Tweakers hierdoor het gedrag van bezoekers vastleggen en analyseren. Door gebruik te maken van deze website, of door op 'Cookies accepteren' te klikken, geef je toestemming voor het gebruik van cookies. Wil je meer informatie over cookies en hoe ze worden gebruikt? Bekijk dan ons cookiebeleid.

Meer informatie
Toon posts:

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

Pagina: 1 ... 18 19 20 Laatste
Acties:

Onderwerpen


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

ik ben de laatste tijd bezig met een custom css, en heb heel veel aangepast, en ik zou graag wat feedback hebben. ik weet dat het een rotzooi is en dat ik dingen 2 keer benoem (anders doet die het SOMS niet, maar meestal wel) later komen er nog fotos bij
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
[li]
#menuwrapper {
background-image: none;
background-color: #2d2d2d;
}

#menubar {
background-image: none;
background-color: rgba(1,2,0,0.85);
border-bottom-width: 1px;
box-shadow: rgba(18,23,4,0.45) 0px -1px 0px 0px inset;

}

#searchbar {
box-shadow: rgba(18,23,4,0.45) 0px 0px 0px 2px inset;
min-width: 100%;
}

#contentArea {
box-shadow: 5px 10px 18px #888888;
padding: 15px;
background: #343033;
}

#categoryBrowser div {
border: 0px;
}


#categoryBrowser .sublist {
background: #343033;
}

#bottom div.hr {
background-color: #00000000;
height: 0px;
}

#layout {
}

div.bar div.notice {
border: 5px;
}

div.message {
background: #5a5a5a;
}

h1, h2 ,h3, h4, h5, h6, h7, h8, h9, h10, h11, p.mods a, #title, a{
color: #bbbbbb;
}

.crew {
color: #bbbbbb;
}

div.oldage {
color: #bbbbbb;
}

a {
color: #fff;
}

#bottom{
height: 200px;
}

#ticker {
height: 20px;
}

#about {
height: 120px;
}
body {
color: #fff;
}

form table td.label {
color: #fff
}

div.message.bestAnswer {
color: #505050;
}
table.forumlisting>tbody>tr>td {
background: #5a5656;
}

#true {
width: 0px;
}

.nextPrevLinks.large li a {
color: #0783ff;
}

table.forumlisting .preview>td {
padding: 9px 18px 16px;
}

.nextPrevLinks.large .label {
color: #fff;
}

.commentCount {
margin-right: 5px;
}
table.forumlisting>tbody>tr>td{
    padding: 2px 4px;
}
.darkFpBlock {
background-color: #676767;
}

#community .communityReviews .userReview .reviewContent .userReviewDescription{
    background-image: linear-gradient(to bottom, #484848, #42423f);
   border-radius: 15px;
box-shadow: none;
background-color: #676767;
}

#categoryBrowser  {
 background: #343033;
border: inherit;
width: inherit;
}

.bar {
border: 0px;
border-radius: 2px;
background: #676767;
}

.images li {
background: #343033;
}
#catagoryBrwoser .sublist {
background: #343033;
}
#categoryBrowser .images li  {
padding: 0px;
margin: 5px;
background: #fff;
}

#categoryBar li a {
color: #fff;
}



fotos css
ez
https://tweakers.net/ext/f/fSv1L5OIcqdGdnYFqpqlpKMV/thumb.pnghttps://tweakers.net/ext/f/fBFDu05ZKmnAqgby5k736C13/thumb.pnghttps://tweakers.net/ext/f/fMlNwA1e5bsx4sHqiapx64Ga/thumb.png
https://tweakers.net/ext/f/1MQvmpXvQI74SSX2UcoX0qHe/thumb.pnghttps://tweakers.net/ext/f/Qpy2CnbwxcmQi9IiXBZw3SBb/thumb.pnghttps://tweakers.net/ext/f/rkdW9jFqFVkAlaWDvZQ4qNCU/thumb.png
https://tweakers.net/ext/f/1EyoPTMzPD8fJoDs67JUM18u/thumb.pnghttps://tweakers.net/ext/f/ZEfKteasFGyS1q0sXp9TuO4Q/thumb.pnghttps://tweakers.net/ext/f/9SfooqeGCItzrtQvGwPoWhuR/thumb.png
https://tweakers.net/ext/f/wl1QnDZa2GtqxrPfIlo8SYL6/thumb.pnghttps://tweakers.net/ext/f/WiE9HLMYiFtTsOlBMasRuEpr/thumb.png

[Voor 34% gewijzigd door dec0de op 05-11-2018 16:26]

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • Hahn
  • Registratie: augustus 2001
  • Laatst online: 22:42
Als het de ene keer wel werkt en de andere keer niet, dan heb je te maken met specificiteit. Dus de veranderingen of hoger neerzetten, of !important gebruiken om het af te dwingen. Dingen dubbel neerzetten heeft weinig nut :)

The devil is in the details.


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

nee, ik bedoel dat ik bijvoorbeeld de ene keer dit heb:


.tralala {
background-color: 0f0;
}
en dan een andere keer dit:

.tralalala li {
color: #fff;
}


en ik krijg het maar niet voormekaar om een achtergrond in te stellen! op een een of andere manier kun je nergens een achtergrond instellen. ik link gewoon op de juiste manier naar een website, het werkt namelijk wel bij de tryit! editor van w3schools...


en hoe krijg je die mooie blokken code die iedereen heeft, ik heb nu maar een quote ervan gemaakt zodat mensen het kunnen inklappen, maar heel handig is het ook niet!

[Voor 56% gewijzigd door dec0de op 04-11-2018 17:44]

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Wat is je uiteindelijke doel om te maken? Het lijkt er in de eerste paar plaatjes naar uit dat je het monochroom wilt maken, maar daarna zie ik wat groen en voornamelijk donkere achtergrondkleuren, zoals o.a. ik en anderen hebben gemaakt.

Als je '.blabla' en '.blabla li' dubbel vindt, wordt het uiteindelijk nog heel leuk als je meer gaat doen. Je krijgt namelijk ook nog te maken met '#blabla' en zaken als 'td' en 'td tr'.

Waar wil je een achtergrond hebben eigenlijk? Heb je al met 'inspect element' van je browser gekeken hoe het deel heet wat je wilt aanpassen met 'background'?

Als je syntax weergave wilt doen met de code blokken, dan moet je dat apart aangeven welke taal het is. Je kan trouwens ook gewoon berichten bekijken en onder de post die je normaal ziet, staan dan twee vakken. Eentje is de post zoals die is getypt in het reageer veld, die eronder is om het bericht te quoten. Bij de eerste kan je dus zien hoe de opmaak is gemaakt e.d.

Commandline FTW | Tweakt met mate


  • Hahn
  • Registratie: augustus 2001
  • Laatst online: 22:42
Lets find it schreef op zondag 4 november 2018 @ 17:38:
nee, ik bedoel dat ik bijvoorbeeld de ene keer dit heb:


.tralala {
background-color: 0f0;
}
en dan een andere keer dit:

.tralalala li {
color: #fff;
}


en ik krijg het maar niet voormekaar om een achtergrond in te stellen! op een een of andere manier kun je nergens een achtergrond instellen. ik link gewoon op de juiste manier naar een website, het werkt namelijk wel bij de tryit! editor van w3schools...


en hoe krijg je die mooie blokken code die iedereen heeft, ik heb nu maar een quote ervan gemaakt zodat mensen het kunnen inklappen, maar heel handig is het ook niet!
Voor die blokken code kan je... en nu komt het hoor... [code] gebruiken. Of nog beter, [code=css] ;)

En ik snap je voorbeeld niet helemaal. Background-color doet wat het zegt: de achtergrondkleur. En color is voor de tekstkleur. Dat zijn dus 2 verschillende dingen. En .tralala en .tralala li zijn ook verschillende dingen.

[Voor 3% gewijzigd door Hahn op 04-11-2018 20:02]

The devil is in the details.


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

Hero of Time schreef op zondag 4 november 2018 @ 19:45:
Wat is je uiteindelijke doel om te maken? Het lijkt er in de eerste paar plaatjes naar uit dat je het monochroom wilt maken, maar daarna zie ik wat groen en voornamelijk donkere achtergrondkleuren, zoals o.a. ik en anderen hebben gemaakt.


Waar wil je een achtergrond hebben eigenlijk? Heb je al met 'inspect element' van je browser gekeken hoe het deel heet wat je wilt aanpassen met 'background'?
mijn plan is om een totaal anders iets te maken. maar gezien ik de achtergrond maar niet veranderd krijg! (de exact zelfde code werkt wel bij andere websites!!!!). ik wacht nog steeds op de tweakers night mode switch. zodra dat er is wil ik dit als night mode, en een totaal andere css voor overdag.


via inspect element kwam ik er achter dat het moet via layout, met deze code:
Cascading Stylesheet:
1
 background-image: url("http://s1.picswalls.com/wallpapers/2016/06/06/beach-desktop-wallpapers_090608503_305.jpg");

maar dat werkt dus niet, terwijl ik alle elementen heb uitgezet die in strijd zouden kunnen zijn, ook bij body heb ik maar hetzelfde neergezet, verandert niks. toen maar geprobeerd bij allerlei websites, maar daar werkt het wel (!)


IK BEN ER ACHTER! TWEAKERS CONTENT POLICY BLOCKT HET, DUS MISSCHIEN LUKT HET VIA HET FOTO ALBUM!

[Voor 3% gewijzigd door dec0de op 05-11-2018 16:36]

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • 8088
  • Registratie: december 2000
  • Niet online

8088

NaN

Waarschijnlijk omdat je browser mixed content ongewenst vindt. OH, JE BENT ER AL UIT!

[Voor 6% gewijzigd door 8088 op 05-11-2018 16:42]

Do you seek to engage in or have you ever engaged in terrorist activities, espionage, sabotage, or genocide?


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

ja, om een afbeelding als achtergrond in te stellen moet je de afbeelding upoaden naar het fotoalbum publieke deel. dan de publieke link copieren en die link gebruiken voor background image!

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • 8088
  • Registratie: december 2000
  • Niet online

8088

NaN

Dat moet niet, dat is een mogelijkheid. Je kunt ook extern gehoste afbeeldingen gebruiken, zolang het maar over https aangeleverd wordt.

Do you seek to engage in or have you ever engaged in terrorist activities, espionage, sabotage, or genocide?


  • DedSec85
  • Registratie: oktober 2014
  • Laatst online: 07-04 15:08
Hallo Tweakers,

Ik heb de custom CSS optie gekocht. Ik krijg het alleen niet voor elkaar om de kleur van de rode menubalk te wijzigen. Ik heb nu even deze code overgenomen:

[code=css]
#top {
background-color: #0052CC !important;
background-image: none !important;
}

h1, h2 {
color: #4775FF !important;
}

[code]

Doe ik iets verkeerd? Ik gebruik Mozilla Firefox als browser.

STEKKING
Verdien sats (satoshis / bitcoin) met je aankopen (bij o.a. LEGO, AliExpress, Alternate, MediaMarkt, Albelli, Albert Heijn en meer): https://stekking.com/register/bJdq6vLY0lWyjeOE


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

@DedSec85, ja, in de eerste plaats sluit je tags met /tag. :P In de tweede is het niet #top maar #menubar. Dat kan je snel zien als je het element inspecteert.

Commandline FTW | Tweakt met mate


  • Floor-is
  • Registratie: maart 2000
  • Laatst online: 01:55
Ik heb deze: incaz in "[feature request] Mute user op forum" in gebruik genomen.

Wat een rust :)

If comedy is tragedy plus time, I need more time. But I'd really settle for less f*cking tragedy to be honest with you. (c) Jon Stewart, 2014 | Nog niet genoeg van me gehad? -> Check Met Nerds om Tafel Podcast


  • NMe
  • Registratie: februari 2004
  • Laatst online: 22:45

NMe

Quia Ego Sic Dico.

Ik heb die eerder al eens op een andere manier uitgeschreven, geeft meer rust. :P
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
div.message {
    opacity: 1;
    transition: opacity 500ms ease;
}
div.message[data-owner-id="user-id-1-hier"]:not(:hover), /* username, voor jezelf */
div.message[data-owner-id="user-id-2-hier"]:not(:hover) /* username, voor jezelf */
{
    max-height: 20px;
    opacity: 0.4;
    overflow: hidden;
}

'E's fighting in there!' he stuttered, grabbing the captain's arm.
'All by himself?' said the captain.
'No, with everyone!' shouted Nobby, hopping from one foot to the other.


  • 911GT2
  • Registratie: november 2001
  • Laatst online: 22:33

911GT2

en blazen maar!

Lets find it schreef op zondag 4 november 2018 @ 17:31:
ik ben de laatste tijd bezig met een custom css, en heb heel veel aangepast, en ik zou graag wat feedback hebben. ik weet dat het een rotzooi is en dat ik dingen 2 keer benoem (anders doet die het SOMS niet, maar meestal wel) later komen er nog fotos bij
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
\[li]
#menuwrapper {
background-image: none;
background-color: #2d2d2d;
}

#menubar {
background-image: none;
background-color: rgba(1,2,0,0.85);
border-bottom-width: 1px;
box-shadow: rgba(18,23,4,0.45) 0px -1px 0px 0px inset;

}

#searchbar {
box-shadow: rgba(18,23,4,0.45) 0px 0px 0px 2px inset;
min-width: 100%;
}

#contentArea {
box-shadow: 5px 10px 18px #888888;
padding: 15px;
background: #343033;
}

#categoryBrowser div {
border: 0px;
}


#categoryBrowser .sublist {
background: #343033;
}

#bottom div.hr {
background-color: #00000000;
height: 0px;
}

#layout {
}

div.bar div.notice {
border: 5px;
}

div.message {
background: #5a5a5a;
}

h1, h2 ,h3, h4, h5, h6, h7, h8, h9, h10, h11, p.mods a, #title, a{
color: #bbbbbb;
}

.crew {
color: #bbbbbb;
}

div.oldage {
color: #bbbbbb;
}

a {
color: #fff;
}

#bottom{
height: 200px;
}

#ticker {
height: 20px;
}

#about {
height: 120px;
}
body {
color: #fff;
}

form table td.label {
color: #fff
}

div.message.bestAnswer {
color: #505050;
}
table.forumlisting>tbody>tr>td {
background: #5a5656;
}

#true {
width: 0px;
}

.nextPrevLinks.large li a {
color: #0783ff;
}

table.forumlisting .preview>td {
padding: 9px 18px 16px;
}

.nextPrevLinks.large .label {
color: #fff;
}

.commentCount {
margin-right: 5px;
}
table.forumlisting>tbody>tr>td{
    padding: 2px 4px;
}
.darkFpBlock {
background-color: #676767;
}

#community .communityReviews .userReview .reviewContent .userReviewDescription{
    background-image: linear-gradient(to bottom, #484848, #42423f);
   border-radius: 15px;
box-shadow: none;
background-color: #676767;
}

#categoryBrowser  {
 background: #343033;
border: inherit;
width: inherit;
}

.bar {
border: 0px;
border-radius: 2px;
background: #676767;
}

.images li {
background: #343033;
}
#catagoryBrwoser .sublist {
background: #343033;
}
#categoryBrowser .images li  {
padding: 0px;
margin: 5px;
background: #fff;
}

#categoryBar li a {
color: #fff;
}



Vandaag begonnen deze te gebruiken! Eerste indruk is erg positief!

Edit: op de FP krijgen alle +2 reacties een kleur die niet matched met de tekstkleur... of eigenlijk juist wel en is dus niet leesbaar.

  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

911GT2 schreef op woensdag 2 januari 2019 @ 11:14:
[...]

Vandaag begonnen deze te gebruiken! Eerste indruk is erg positief!

Edit: op de FP krijgen alle +2 reacties een kleur die niet matched met de tekstkleur... of eigenlijk juist wel en is dus niet leesbaar.
Ik zal het aanpassen, morgen of misschien wel vandaag is dat gefikst

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

ik heb het denk ik gevoden, maar omdat ik nu een andere css gebruik, weet ik het niet zeker, maar 99% kans dat het werkt, je moet gewoon onderaan de css dit lijntje toevoegen:
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
.reactieBody.spotlight {
    background: #f3faf5;
    border-color: #becfbe;
    color: black !important;
}

.reactieBody .spotlight {
color: black !important;
}



edit: getest en het werkt

[Voor 11% gewijzigd door dec0de op 03-01-2019 13:37]

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

ik gebruik nu een tijd deze:
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
#categoryBrowser .large ul {
width: 100%;
}
.messagecontent {width: inherit !important;}

.ind {
border-bottom-left-radius: 15px;
}


#messageBox {width: 100%;}
.timeshortleft {
border-bottom-right-radius: 15px;
}



#categoryBrowser .large {
    height: 384px;
    width: 78%;
}



#layout {
padding-top: 30px;
padding-bottom: 300px;
}



#categoryBrowser {
    background: #f2f2f2;
    border: 1px solid #d9d9d9;
    border-radius: 1px;
    font-size: 12px;
    margin-bottom: 20px;
    padding: 10px;
    width: 98%;
}
#contentArea .centered { max-width: none;}






html.js .toggleable.closed .toggleBtn {

    color: #666;
    border-radius: 600px;
    
}



.pwPortalPopularProductListing {
    float: left;
    margin-bottom: 15px;
    overflow: hidden;
    width: 49%;
    margin-right: 45px;
}



#logo a {
background: url("https://tweakers.net/ext/f/SU2jftw6lDnhBXDl7qXCIOWW/full.jpg") no-repeat center;
}



.mainColumn.frontpage {

 
    margin-right: 0;
    padding-right: 20px;
    padding-top: 15px;
    width: 80%;

}



.filterBlock {border-radius: 15px; 
margin-top: 75px; 
box-shadow: 0px 0px 20px 0px #bfbfbf;
}



.filterGroup {
border-radius: 15px;
box-shadow: 0px 0px 20px 0px #bfbfbf;
}



#top {
background: rgba(180, 181, 181, 0);
border: none;
}



body, #bottom div.hr, #entity, #heroBlock, #searchbar, .galleryHeadingContainer, .pageTabsContainer, .notificationsContainer {
background-color: rgba(255, 255, 255, 0);
}



.articleColumn.wide + .relevancyColumn {
width: 10%;
padding-right: 100px;
}



#listingContainer{
width: 80%;
}



body {
background-image: url("https://tweakers.net/ext/f/dFm5Tyhgssy57i4aaC3fGCrn/full.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
}



#contentArea {
 box-shadow: 0px 10px 30px 10px #4f4f4f;
 border-radius: 15px!important;
Padding: 25px;
}



.fancyButton {box-shadow: 0px 1px 10px 1px #a1a1a1;}



.fpaItemsWrapper {
    border: 2px solid #bfbfbf;
    overflow: hidden;
    border-radius: 15px;
    padding: 10px;
    box-shadow: 0px 0px 40px 0px #4f4f4f;
    margin-bottom: 45px;
    margin-top: 35px;
}



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



.bar {
  box-shadow: 0px 0px 20px 0px #bfbfbf;
 border-radius: 10px !important;
}




.settingsContent{
width: 75%;
}



.fancyButton {
border-radius: 14px;
}



#categoryBrowser div {
border-radius: 10px !important;
}



#categoryBrowser {
border-radius: 15px !important;
box-shadow: 0px 0px 20px 0px #bfbfbf;
}



table.listing {
border-radius: 15px;
box-shadow: 0px 0px 20px 0px #bfbfbf;
  padding: 5px;
  padding-top: 10px;
  padding-left: 5px;
  padding-right: 5px;

}



}

h2.bar.question + .message, h2.bar.answer + .message {
margin-top: 15px;
box-shadow: 0px 0px 20px 0px #bfbfbf;
border-radius: 15px;
}



div.info, div.error, div.message, div.faq, form.insertMessage, form.form1, form.form2, #folders, #myprofilecontainer {
border-radius: 15px;
box-shadow: 0px 0px 20px 0px #bfbfbf;
}



.darkFpBlock{
box-shadow: inset 0 0 13px 4px rgba(45, 45, 45, 0.3);
border-radius: 15px;
}



#search input.submit {
border: 1px solid #8f8f8fb3;
border-radius: 15px
}



input.text, select.text, textarea, .keywordSearch {
border-radius: 15px;
}



body.trackerRight #tracker .fakeTop .toggleVisibility {
border-bottom-right-radius: 15px;
}

.articleColumn.wide {
width: 75%;
}



#menubottombar {
height: 21px;
line-height: 0.6;
padding: 0px;
}



#menubottombar div.socialcount {
margin-top: -4px;
}



.reactieBody {
max-width: none;
}



#menubar {
background-color: rgba(2,2,2,0.59);
background-image: none !important;
border: 3px solid black;
box-shadow: none;
height: 40px;
met veel diepte en scaduwen, vooral gemaak voor desktop (in mijn geval ultrawide) om het volledige scherm te benutten, ik zal ook nog 1 css voor mijn ipad invoegen over een tijd...






psst, dat gekke lettertype komt door mijn browser settings, en zal anders zijn bij jullie!

[Voor 5% gewijzigd door dec0de op 03-01-2019 13:58]

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • 911GT2
  • Registratie: november 2001
  • Laatst online: 22:33

911GT2

en blazen maar!

Lets find it schreef op donderdag 3 januari 2019 @ 13:32:
ik heb het denk ik gevoden, maar omdat ik nu een andere css gebruik, weet ik het niet zeker, maar 99% kans dat het werkt, je moet gewoon onderaan de css dit lijntje toevoegen:
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
.reactieBody.spotlight {
    background: #f3faf5;
    border-color: #becfbe;
    color: black !important;
}

.reactieBody .spotlight {
color: black !important;
}



edit: getest en het werkt
Bij mij niet. :'(

  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

heb je het letterlijk gekopieerd en geplakt? of overgetypt? bij mij werkt het wel, hoofdletters zijn belangerijk!

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • 911GT2
  • Registratie: november 2001
  • Laatst online: 22:33

911GT2

en blazen maar!

Ik heb het hele stuk opnieuw gedaan, eerst je initiële post en vervolgens de update er onder.

Ik heb er zelfs een harde enter tussen gezet.

  • nachtnet
  • Registratie: december 2003
  • Laatst online: 16-04 19:36
Toch maar hier even mijn vervolgvragen stellen: Feature: Custom CSS how-to?

Inmiddels heb ik wat gewenste aanpassingen kunnen maken:




  • Hoe kan ik de Taalselectie (NL/BE) verbergen? Inspect element geeft mij niet genoeg duidelijkheid.
  • Hoe de Twitter & Facebook button in het onderschrift verbergen?
  • Tussen Alles & TS (rechts boven topic) zit nog een klein groen lijntje. Hoe die zelfde kleur geven als rest vd randen?
  • Hoe de achtergrondkleur van de pagina nummering/navigatie veranderen naar andere kleur?
  • Hoe de gekoppelde onderwerpen eruit laten zien als het TS / Karma badge? Dus met smalle gekleurde rand, gekleurde letters en witte achtergrond?
  • En tenslotte: Hoe in de mobiele weergave dat grijze pijltje verbergen? (dat bij scrollen naar beneden of naar boven tevoorschijn komt en zorgt voor een sprong naar beneden of naar boven?) (ik wil nooit naar beneden springen, maar klik bij scrollen voortdurend op dat pijltje. :N )

quote: Custom CSS nachtnet
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
/* Comment: Custom CSS tweakers nachtnet */
/* Comment: */

/* Comment: Related products Forum kleinere afbeeldingen */
#tweakbase_relations .rbProductlist .item .thumb,
#tweakbase_relations .rbProductlist .item .thumb img {
    height: 20px;
    width: 26px;
}
/* Comment: Kleinere tekst Related products Forum */
#tweakbase_relations .rbProductlist .item p.desc {
    font-family: "Roboto Condensed Medium","helvetica","Liberation Sans",sans-serif;
    font-size: 13px;
    margin-top: 15px;
}
#tweakbase_relations .rbProductlist .item p.desc {
    margin-top: 0;
}
/* Comment: einde related products Forum*/

/* Comment: Onderwerp koppelingen */
#tweakbase_relations .rbEntitylist .relatedSubject {
    border-radius: 2px;
    background: #014A93;
    background: url("../../../g/forum/images/icons/tslabel.png") no-repeat 5px center;
    background-size: 10px 9px;
    font-size: 11px;
    height: 20px;
    line-height: 20px;
    padding: 0 6px;
}

/*Comment: Frontpage Related subjects koppeling */
.relatedSubject {
    background: #014A93;
    font-size: 11px;
    height: 20px;
    line-height: 20px;
    padding: 0 6px;
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    text-decoration: none;
}
/* Einde related products */

/* Filterknop Alle berichten Grijs ipv groen */
.filterPosts ul li.active {
        border-color: #d9d9d9;
    background: #DDDDDD;
}
.filterPosts ul li.active a {
    color: #666;
}
/* Einde Alle berichten */

/* Comment: Pagina telling niet blauw */
.pageDistribution b {
    background-color: #EEEEEE;
    border: 1px solid #014a93;
    border-radius: 2px;
    color: #FFF;
    display: inline-block;
    height: 15px;
    line-height: 15px;
    padding: 0 4px;
    text-align: center;
}
/* Comment: Einde pagina nummering */


/* Verbergen Pakkie link in V&A */
.userAanbod table.listing .pakkie {
    display: none;
    float: right;
}
/* Einde Pakkie */

/* Verbergen Facebook & twitterbutton in Footer Frontpage */
#about .button {
display:none;
}
/* Einde verbergen socials */

/*Einde custom CSS */


}
* nachtnet heeft uiteraard met "Inspect Element" geprobeerd duidelijkheid te krijgen over deze vragen, maar geen goede resultaten kunnen krijgen.

nachtnet zonder hoofdletter - “I … have nothing to add to my former answer.”


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Het tandwieltje, waar overigens meer achter zit dan alleen de taal, is te vinden onder "#userbar li.icon.flag.nl" voor NL en flag.be voor BE. Hoe heb je dat niet kunnen vinden? Het staat zo in de CSS regels als je het icoon inspecteert. Je moet wel letten op welk element je kiest, soms moet je de bovenliggende hebben.

FB en Twitter heb ik in m'n tweaks.css verborgen. Zoek even de link naar m'n Google drive, daar staat het met comment in. Iets met slogan, dan is de hele zwarte balk daar weg.

De rest is met juist gebruik van inspect element an sich ook wel te vinden. Het pijltje bij het scrollen op je mobiel is wat lastiger, dat is vziw javascript based om weer te geven. Het blijft een seconde ofzo staan, dus als je 't niet kan vinden is geduld een schonere zaak. ;)

Commandline FTW | Tweakt met mate


  • Pjottski
  • Registratie: maart 2001
  • Laatst online: 17-04 13:52

Pjottski

🦍 Monkey 🦍

nachtnet schreef op zaterdag 19 januari 2019 @ 16:15:
Toch maar hier even mijn vervolgvragen stellen: Feature: Custom CSS how-to?

Inmiddels heb ik wat gewenste aanpassingen kunnen maken:

[Afbeelding]
[Afbeelding]

[Afbeelding]
  • Hoe kan ik de Taalselectie (NL/BE) verbergen? Inspect element geeft mij niet genoeg duidelijkheid.
  • Hoe de Twitter & Facebook button in het onderschrift verbergen?
  • Tussen Alles & TS (rechts boven topic) zit nog een klein groen lijntje. Hoe die zelfde kleur geven als rest vd randen?
  • Hoe de achtergrondkleur van de pagina nummering/navigatie veranderen naar andere kleur?
  • Hoe de gekoppelde onderwerpen eruit laten zien als het TS / Karma badge? Dus met smalle gekleurde rand, gekleurde letters en witte achtergrond?
  • En tenslotte: Hoe in de mobiele weergave dat grijze pijltje verbergen? (dat bij scrollen naar beneden of naar boven tevoorschijn komt en zorgt voor een sprong naar beneden of naar boven?) (ik wil nooit naar beneden springen, maar klik bij scrollen voortdurend op dat pijltje. :N )




[...]


* nachtnet heeft uiteraard met "Inspect Element" geprobeerd duidelijkheid te krijgen over deze vragen, maar geen goede resultaten kunnen krijgen.
Ben ff aan het stoeien geweest.

Cascading Stylesheet:
1
2
3
4
5
6
li.icon.display.flag.nl,li.icon.display.flag.be {display:none;} /*Hoe kan ik de Taalselectie (NL/BE) verbergen?*/
div.socialcount {display:none;}/*Hoe de Twitter & Facebook button in het onderschrift verbergen?*/
div.filterPosts ul li.active {border-color:#d9d9d9;}/*Tussen Alles & TS (rechts boven topic) zit nog een klein groen lijntje. Hoe die zelfde kleur geven als rest vd randen?*/
#tweakbase_relations .rbEntitylist .relatedSubject {border-radius: 4px;background-color:white;border: 1px solid #0f108c;color:#0f108c;}/*Hoe de gekoppelde onderwerpen eruit laten zien als het TS / Karma badge? Dus met smalle gekleurde rand, gekleurde letters en witte achtergrond?*/
span.pageDistribution b {background-color:red;border-color:red;background-image:none;}/*Hoe de achtergrondkleur van de pagina nummering/navigatie veranderen naar andere kleur?*/
@media screen and (max-width:720px){ div.scrollTo.show {display:none;} }/*En tenslotte: Hoe in de mobiele weergave dat grijze pijltje verbergen? (dat bij scrollen naar beneden of naar boven tevoorschijn komt en zorgt voor een sprong naar beneden of naar boven?) (ik wil nooit naar beneden springen, maar klik bij scrollen voortdurend op dat pijltje. :N )*/

Dit is mijn uitspraak en daar zult u het mee moeten doen


  • nachtnet
  • Registratie: december 2003
  • Laatst online: 16-04 19:36
@Hero of Time bij het zoeken naar het vlaggetje kon ik het tandwieltje wel wegkrijgen, maar bleef de vlag zelf staan. Later kreeg ik ook de vlag wel weg, maar verdwenen ook de notificatie iconen.

Zoals eerder gezegd, ik heb niet voldoende kaas gegeten van CSS om mij er vaardig in te voelen. Wel heb ik nu door de geleverde pointers en suggesties een voor mij betere tweakers ervaring kunnen maken met custom CSS.

@Pjottski +1 Top, met jouw css weer een stuk meer kunnen doen. (moest nog wel even zoeken naar de schaduw in de paginanummering om het helemaal scherp en netjes te krijgen.)

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
/* Comment: Pagina telling niet blauw */
.pageDistribution b {
    background-color: #FFFFFF;
background-image:none;
    border: 1px solid #b91330;
    border-radius: 2px;
    color: #014A93;
    display: inline-block;
    height: 15px;
    line-height: 15px;
    padding: 0 4px;
    text-align: center;
text-shadow: none;
}

nachtnet zonder hoofdletter - “I … have nothing to add to my former answer.”


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

@nachtnet, wat de vlag maakt, iig voor NL en ik vermoed hetzelfde voor BE maar dan net iets anders, is dit stuk:
Cascading Stylesheet:
1
2
3
4
5
6
7
#userbar li.icon.flag.nl::after {
  height: 3px;
  width: 12px;
  border-top: 3px solid #e7184c;
  background-color: #fff;
  border-bottom: 3px solid #014a93;
}

De rand boven is rood, de rand onder is blauw, de achtergrondkleur is wit. Allemaal met 3 pixels hoogte. ;)

Commandline FTW | Tweakt met mate


  • Hahn
  • Registratie: augustus 2001
  • Laatst online: 22:42
Samengevat, met deze CSS is het vlaggetje weg, zonder dat je nl of be hoeft te includen:
Cascading Stylesheet:
1
2
3
#userbar li.icon.flag::after { 
    display: none;
}

[Voor 15% gewijzigd door Hahn op 20-01-2019 12:34]

The devil is in the details.


  • Gropah
  • Registratie: december 2007
  • Laatst online: 00:12

Gropah

Admin Softe Goederen

Oompa-Loompa 💩

Vanuit [Responsive] Tijd laatste reactie ipv aantal reactie's heb ik zelf maar een stukje CSS geschreven om bij kleine schermen de laatste reactie tijd te laten zien ipv een reply count in topic listings.

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
/* time of latest reaction instead of replycount in topiclistings */
@media (max-width: 499px),(max-device-width: 499px) and (orientation: portrait){
    /* Hide the reply counter */
    table.listing .replies{
        display:none
    }

    table.listing .replies,table.forumlisting .replies{
        overflow:hidden;
        padding:0px;
        width: 0px;
    }

    /* Show the last reply counter*/
    table.listing .time {
        width: 80px;
        border-right: 1px solid #d9d9d9;
        text-align: center;
    }

    table.listing .time,table.forumlisting .time{
        display: table-cell;
        padding: 10px;
        width: 60px;
    }
}

en nog een screengrab met het resultaat:

Tweakers Discord


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

DedSec85 schreef op vrijdag 7 december 2018 @ 17:09:
Hallo Tweakers,

Ik heb de custom CSS optie gekocht. Ik krijg het alleen niet voor elkaar om de kleur van de rode menubalk te wijzigen. Ik heb nu even deze code overgenomen:

[code=css]
#top {
background-color: #0052CC !important;
background-image: none !important;
}

h1, h2 {
color: #4775FF !important;
}

[code]

Doe ik iets verkeerd? Ik gebruik Mozilla Firefox als browser.
ja, je moet dit toevoegen aan #menubar
Cascading Stylesheet:
1
2
3
background-image: inherit;
background-image: inherit;
background-image: inherit;

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

Rhier kom ik weer! maar nu met wat speciaals!

EEN SWITCHABLE DARK MODE!

deze is aardig compleet, maar nog niet af, alles is wel leesbaar, ik zal elke week een update plaatsen, om de experience te verbeteren.

demonstratie: YouTube: Tweakers custom css darkmode

als iets niet bevalt, ik heb overal comments om het makklijk te maken voor jou en mij :*)

Met dank aan @B.O.C.K

LET OP: de menubalk word bij ipads en telefoons gebackdroped-blurd, dit werkt echter alleen op
safari(alle platformen) en chrome voor desktop als je dit ook op desktop wilt (ziet er sick uit in mijn opinie, maar ik gebruik firefox.. ga hier naartoe: https://developer.mozilla...ter#Browser_compatibility en zet Enable Experimental Web Platform Features flag op aan bij chrome::flags) en wijzig de css bij lijn 23 tot 28 naar
Cascading Stylesheet:
1
2
3
4
5
6
7
#menubar{
background-image: none;
background-color:#0004;
border-bottom: none;
box-shadow: inherit;
-webkit-backdrop-filter: blur(10px);
}


als je , de menubalk is erg doorzichtig, om dit aan te passen moet je naar benden scrollen en even de trasparantheid naar #090909cc zette, anders word het heel snel storend.

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
@media only screen and (min-width: 1220px) {
body{
background: #474747;
}

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

}


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

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

.menubottom span{
display: none;
}


.menubottom:after{
content:' blokkeer alstublieft niet onze reclames';
}

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

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

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

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

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

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

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


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


#searchbar{
background: #474747;
}


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

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

h1, h2 {
color: #000;
}


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


#layout {
background: #474747
}


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


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

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


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


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

#categoryBrowser ul{
background: #dedede;
}


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

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

.pageTabsContainer{
background: #474747;
}

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

.galleryHeading .karma{
color: #efefef;
}

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

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


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

#filterForm{
width: 210px;
}

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


.entityHeader h1 {
color: white;
}

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

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

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


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


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

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


.fpaItems{
margin: 0 auto;
}


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


 #categoryBar{
text-align: center;
}


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


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

table.highlights .type{
background: #dedede
}


.secondColumn.frontpage{
width: 400px;
}


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


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


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

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

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


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


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

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

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


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

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

body.customColor a {
color: #cbcbcb;
}


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


 body.customColor h3{
color: black;
}

background-color: #8d8d8d;


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


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


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


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

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

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


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

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

body.customColor a {
color: #cbcbcb;
}


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


 body.customColor h3{
color: black;
}


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

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


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

filmpje en fotos komen

[Voor 108% gewijzigd door dec0de op 01-02-2019 11:33]

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Je mag het oneens zijn met wat er is verandert, maar iets als dit in je CSS zetten zodat het op elke pagina staat vind ik wel erg respectloos:
.menubottom:after{
content:'wij hebben geen webdesigners in dienst, maar als je voldoende karma hebt mag je het fixen!';
}

Commandline FTW | Tweakt met mate


  • Rembock
  • Registratie: maart 2013
  • Laatst online: 15-04 20:17

Rembock

Beh...

Lets find it schreef op donderdag 31 januari 2019 @ 20:14:
hier kom ik weer! maar nu met wat speciaals!

EEN SWITCHABLE DARK MODE!
Zou het wel waarderen als je in het vervolg ten minste aangeeft wie je dit verteld heeft. :)
Heb veel tijd gestoken in het uitzoeken hiervan, het is niet echt netjes om met creaties van anderen te pronken

  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

B.O.C.K schreef op donderdag 31 januari 2019 @ 22:33:
[...]


Zou het wel waarderen als je in het vervolg ten minste aangeeft wie je dit verteld heeft. :)
Heb veel tijd gestoken in het uitzoeken hiervan, het is niet echt netjes om met creaties van anderen te pronken
Je bedoelt dit: wie je en “kleine” tip in de juiste richting heeft gegeven ;)
Ik wist helaas niet meer wie deze tip had gegeven, maar dat was jij dus.. haha

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

Hero of Time schreef op donderdag 31 januari 2019 @ 20:46:
Je mag het oneens zijn met wat er is verandert, maar iets als dit in je CSS zetten zodat het op elke pagina staat vind ik wel erg respectloos:

[...]
Dit was een grapje, omdat iedereen moeilijk doet om t.net 7, ik ga dit aanpassen

Btw, dit is alleen op desktop. Ik kan er ook hetzelfde neerzetten als @deathgrunt, (wij stellen je geduld op de proef) maar dat is ook weer zo copycat...

Dus speciaal voor jou: Hero of time kan niet tegen een grapje :+

Nee, er staat nu dit: blokkeer ulstublieft niet onze reclames

[Voor 10% gewijzigd door dec0de op 01-02-2019 10:07]

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • Rembock
  • Registratie: maart 2013
  • Laatst online: 15-04 20:17

Rembock

Beh...

Lets find it schreef op vrijdag 1 februari 2019 @ 09:56:
[...]


Je bedoelt dit: wie je en “kleine” tip in de juiste richting heeft gegeven ;)
Ik wist helaas niet meer wie deze tip had gegeven, maar dat was jij dus.. haha
Je kunt het brengen hoe je zelf wilt en er omheen draaien, het blijft uiteindelijk niet netjes. :w

  • dec0de
  • Registratie: oktober 2017
  • Laatst online: 17-04 12:23

dec0de

Linux equals life

Nu je zin? :)

*O*

The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time


  • _Thanatos_
  • Registratie: januari 2001
  • Laatst online: 07-04 08:22

_Thanatos_

Ja, en kaal

Ik heb een donkere tweakers.net. Ik ga toch niet met custom styles zitten kliederen? Straks past T.net iets aan, en dan kun je puin gaan ruimen in je aanpassingen. Neh. Ik gebruik Dark Reader.

Die maakt aanpassingen aan een site dynamisch. Of "static", wat eigenlijk ook een soort van minder dynamisch is. Het werkt iig briljant.

Het is wel alleen voor dark mode. Andere aanpassingen kun je er wel mee doen, maar dan kom je toch weer op custom css, en dat zou ik afraden voor een site die zo vaak verandert.

日本!🎌


  • MarnickS
  • Registratie: februari 2016
  • Laatst online: 21:20
Ik heb hier nog een hele simpele dark mode voor Tweakers die aardig compleet is. Werkt ook volledig op mobiel (ook de pricewatch filters).

https://del.dog/tweakersdarkcss

Dell XPS 15 9560 · Xiaomi Mi Mix 2S (Evolution X ROM) · NVIDIA SHIELD TV


Acties:
  • 0Henk 'm!

  • mschol
  • Registratie: november 2002
  • Niet online
vraagje ik gebruik nu (o.a.) de volgende css:

Cascading Stylesheet:
1
#layout {    background-color: #edeeee;    margin: 0 auto;    width: 1200px;}



Die wordt, zover ik gezien heb, overal netjes toegepast behalve op https://tweakers.net/instellingen/layout/
andere css wordt wel toegepast op die pagina.

als ik in de developer tools kijk staat hij wel netjes erin, maar om de een of andere reden wordt hij niet toegepast, wat zie ik over het hoofd?

  • Koozza
  • Registratie: november 2007
  • Laatst online: 23:56

Koozza

Wâ voor drop? GAS D’ROP!

mschol schreef op zondag 3 maart 2019 @ 23:42:
vraagje ik gebruik nu (o.a.) de volgende css:

Cascading Stylesheet:
1
#layout {    background-color: #edeeee;    margin: 0 auto;    width: 1200px;}



Die wordt, zover ik gezien heb, overal netjes toegepast behalve op https://tweakers.net/instellingen/layout/
andere css wordt wel toegepast op die pagina.

als ik in de developer tools kijk staat hij wel netjes erin, maar om de een of andere reden wordt hij niet toegepast, wat zie ik over het hoofd?
Als ik deze zelfde regel in mijn CSS zet werkt deze gewoon op instellingen/layout :)

  • enverlin
  • Registratie: november 2006
  • Niet online
Iemand al een stukje code om de nieuwe layout te verbeteren?

Ik heb het dan over het verbergen van fpAnkeiler en de "tr class" inBetweenContent.

  • Rubman
  • Registratie: april 2002
  • Laatst online: 17-04 05:53

Rubman

Retarded or just overjoyed!

Ik ziel dat ik waarschijnlijk mijn CSS moet aanpassen gezien ik slechts 1 uitgelicht nieuwsbericht bovenin zie ipv de keuze om de andere artikelen te zien.

Zucht, dat ding is al zo'n allegaartje waar ik weinig meer van snap.
Maar verder is het precies zoals ik wil.

In deze afbeelding zie je duidelijk meerdere uitgelichte nieuwsberichten om uit te kiezen.
ik heb dus alleen dat eerste zwarte stukje met lees meer/review/whatever

Iemand die nog iets wijs kan worden uit mijn knip en plak knutselwerk van een CSS? O-)

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
/* Menu / Header */
#menubar{
background: #2c3e50;
box-shadow: inset 0 -2px 0 #C9EF29;
}

 
/* Usericon witte achtergrond (mooier bij transparante png/gif) */
#userbar .usericonsmall {
        background-color: #FFFFFF;
}

#logo a {
height: 42px;
}

#logo a:hover {
-webkit-animation-name: shake; 
animation-name: shake;
-webkit-animation-duration: 3.5s; 
animation-duration: 3.5s; 
-webkit-animation-fill-mode: both; 
animation-fill-mode: both; 
-webkit-animation-timing-function: ease-in-out; 
animation-timing-function: ease-in-out; 
animation-iteration-count:infinite; 
-webkit-animation-iteration-count:infinite;
-webkit-animation-delay: 0.25s;
animation-delay: 0.25s;
}

#menu li a:hover {
border-left:0px;
}
#menu li:hover,
#logo:hover{
height:43px;
background-image:-webkit-linear-gradient(#2c3e50,#C9EF29);
background-image:-moz-linear-gradient(#2c3e50,#C9EF29);
border-bottom:0px;
}

 /* Menu Dropdown */
#menu li.dropdown li:hover {
background-image:-moz-linear-gradient(#C9EF29,#C9EF29);
background-image:-webkit-linear-gradient(#C9EF29,#C9EF29);
}

#menu li.active a:hover {
color:#e0e2e2;
}

.dropdown li:hover,
dropdown li:hover a{
color:#000!important;
}

#menubottombar {
background-color: #2c3e50;
}

#menubottombar a.facebook {
background:url(http://www.eurosong.be/wp-content/themes/eurosongbe/images/icon_facebook.png) no-repeat;
}

#top #menubottombar a.twitter {
background:url(http://www.iknowuwill.com/images/Twitter_bird_icon.png) no-repeat;
background-size: 16px 16px;
background-position: 0px 0px !important;
}

#menubottombar span.slogan {
color: #EDEEEE;
text-shadow: 0px 2px 2px rgba(201, 239, 41, 1);
font-style: italic;
}
#menubottombar span.slogan:hover {
color: #C9EF29;
text-shadow: 0px 2px 2px rgba(237, 238, 238, 1);
}


@-webkit-keyframes shake { 
    0%, 80%, 100% {-webkit-transform: translateX(0);} 
    8%, 24%, 40%, 56%, 72% {-webkit-transform: translateX(-10px);} 
    16%, 32%, 48%, 64% {-webkit-transform: translateX(10px);} 
} 
@keyframes shake { 
    0%, 80%,100% {transform: translateX(0);} 
    8%, 24%, 40%, 56%, 72% {transform: translateX(-10px);} 
    16%, 32%, 48%, 64% {transform: translateX(10px);} 
} 

#menubottombar span.arrow-left {
border-right: 5px solid #EDEEEE;
}
#menubottombar span.count {
background-color: #EDEEEE;
border: 1px solid #C8C8C8;
border-left:0;
}

#userbar li.icon.unread {
-webkit-animation-duration: 5s; 
animation-duration: 5s; 
-webkit-animation-fill-mode: both; 
animation-fill-mode: both; 
-webkit-animation-timing-function: linear; 
animation-timing-function: linear; 
animation-iteration-count:infinite; 
-webkit-animation-iteration-count:infinite;
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-animation-delay: 2s;
animation-delay: 2s;
} 

@-webkit-keyframes bounce { 
0%, 10%, 25%, 40%, 50%, 100% {-webkit-transform: translateY(0);} 
20%, 30% {-webkit-transform: translateY(-10px);} 
} 

@keyframes bounce { 
0%, 10%, 25%, 40%, 50%, 100% {transform: translateY(0);} 
20%, 30% {transform: translateY(-10px);}
}


/* Topics met laatste eigen reactie markeren */
td.topic a[title*="Rubman"] {
        font-style: italic;
        color: #D1D1D1 ;
}

/* Usericon witte achtergrond (mooier bij transparante png/gif) */
#userbar .usericonsmall {
        background-color: #FFFFFF;
}

/* ### GoT ### */

/* ####Henk duim####*/ 
.action_list li.rating .thumbsup::before {
    background: rgba(0, 0, 0, 0) url("https://static.tweakers.net/ext/f/TlL6Zo91MiMutr9amUluNikj/full.png") no-repeat scroll 50% center;
    content: "";
    display: inline-block;
    height: 100%;
    width: 100%;
}
/* Cascading stylesheet */
a.abonnee {color: #0A8FC4 !important;}
}

/* Logo vervangen, tekst "Tweakers" staat er nog wel bij, maar icoontje is vervangen. */
#logo a
{
background:url(../../ext/f/UcY5a82gNc5VAOkdXU120jGG/full.png) no-repeat 50%;
display:block;
height:44px;
width:156px;
}
}
.action_list li.rating .thumbsup.rated::before {
    background: rgba(0, 0, 0, 0) url("http://static.tweakers.net/ext/f/XUQa8JbPDzdzsWTKxb4qX5Gm/full.png") no-repeat scroll 50% center;
}

.action_list li.rating .thumbsup {
    background: #e0e0e0 linear-gradient(#e0e0e0, #c4c4c4) repeat scroll 0 0;
    border: 1px solid #bfb9a9;
    border-radius: 1px;
    cursor: default;
    display: inline-block;
    height: 22px;
    margin-left: 5px;
    overflow: hidden;
    position: relative;
    top: -2px;
    vertical-align: bottom;
    width: 26px;
}

.action_list li.rating .thumbsup.rated {
    background-color: #e0e0e0 repeat scroll 0 0;
    background-image: linear-gradient(#e0e0e0, #c4c4c4);
    border-color: #bfb9a9;
}

.action_list li.rating .ratingcount {
    min-width: 35px;
}

/* ####Overzicht####*/
 
/* Forumoverzicht kleuren, ieder deel andere achtergrond kleur (gradient indien mogelijk) */
.forumList:nth-child(2) table.listing tr th {
        background-image: linear-gradient(#9C9E9E,#626363);
}
 
.forumList:nth-child(3) table.listing tr th {
        background-image: linear-gradient(#B4113C,#760D29);
}
 
.forumList:nth-child(4) table.listing tr th {
        background-image: linear-gradient(#573077,#2B0A46);
}


.forumList:nth-child(5) table.listing tr th {
        background-image: linear-gradient(#1BA53C,#074416);
}
 
.forumList:nth-child(6) table.listing tr th {
        background-image: linear-gradient(#FF5A00,#9E3B06);
}
 
.forumList:nth-child(7) table.listing tr th {
        background-image: linear-gradient(#50D7FA,#14505F);
}
 
.forumList:nth-child(8) table.listing tr th {
        background-image: linear-gradient(#21428B,#112551);
}
 
.forumList:nth-child(9) table.listing tr th {
        background-image: linear-gradient(#9C9E9E,#626363);
}

/* NL vlaggetje weg */
.flagNL div{
   visibility: hidden !important;}
#bottom{display:none;}

}

/* Compactere forum tabellen */ 
table.listing td, table.listing th { 
 padding: 5px; /* is standaard 10px boven/onder en 5px links/rechts */ 
}

.ratingcount {
    color: #fff !important;
    border: 1px solid #bbbebe;
    border-radius: 1px;
    height: 22px;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0,0,0,.2),0 0 2px rgba(0,0,0,.2);

    background: #dcdfdf;
    background-image: -webkit-linear-gradient(#dcdfdf,#c5c8c8);
    background-image: -moz-linear-gradient(#dcdfdf,#c5c8c8);
    background-image: linear-gradient(#dcdfdf,#c5c8c8);
}

.can_be_rated .ratingcount {
    background: #929494;
    background-image: -webkit-linear-gradient(#929494,#7d8080);
    background-image: -moz-linear-gradient(#929494,#7d8080);
    background-image: linear-gradient(#929494,#7d8080);
    border-color: #7c7e7e;
}

.has_ratings .ratingcount {
    background: #cbda30;
    background-image: -webkit-linear-gradient(#cbda30,#c1d203);
    background-image: -moz-linear-gradient(#cbda30,#c1d203);
    background-image: linear-gradient(#cbda30,#c1d203);
    border-color: #b6c600;
}
#############
.spoiler {
    background-color: #DAE64A;
    color: rgba(218, 230, 74, 0);
    cursor: pointer;
    font-size: 1pt;
    height: 8px;
    padding: 8px;
    border-radius: 3px;
    margin-top: -10px;
    border: 1px dashed rgba(0,0,0,0);
}

.spoiler.visible {
    background-color: rgba(0,0,0,0);
    color: #000 !important;
    font-size: 13px !important;
    height: 100% !important;
    transition: all 0.1s ease 0s;
    margin-top: -10px;
    padding-top: 28px !important;
    border: 1px dashed #C4C4C4;
}

.spoiler a,
.messagecontent div.spoiler a,
.messagecontent .message-quote-div div.spoiler a,
.messagecontent div.spoiler a:hover,
.messagecontent .message-quote-div div.spoiler a:hover {
    display: none;
}

.spoiler.visible a,
.messagecontent div.spoiler.visible a,
.messagecontent .message-quote-div div.spoiler.visible a,
.messagecontent div.spoiler.visible a:hover,
.messagecontent .message-quote-div div.spoiler.visible a:hover {
    display: inline;
    background-color: rgba(0,0,0,0) !important;
    color: #000 !important;
    font-size: 13px !important;
    height: 100% !important;
    transition: all 0.1s ease 0s;
    margin-top: -10px;
    padding: 0 !important;
    border: 0;   
    border-radius: 0;
}

.messagecontent div:not([class]) small,
.message-quote-div div:not([class]) small {
    margin-top: 8px;
    padding: 4px;
    background-color: #DAE64A;
    border-radius: 3px;
    margin-left: 8px;
    font-size: 11px;
    font-weight: bold;
    text-transform: capitalize;
    color: #434343;
}

div.spoiler div.resizewarning {
    display: none;
}

div.spoiler.visible div.resizewarning,
div.spoiler.visible div.resizewarning a,
div.spoiler.visible div.resizewarning a:hover {
    display: inline;
    font-size: 11px !important;
    color: white !important;
    background-color: rgba(0,0,0,0) !important;
}

div.resizewarning div small,
div.spoiler div.resizewarning div small,
div.messagecontent a small,
div.messagecontent td div small {
    background-color: rgba(0,0,0,0) !important;
    border-radius: 0;
    font-weight: normal;
    margin-left: 0;
    margin-top: 0;
    padding: 0;
    text-transform: none !important;
}

div.resizewarning div small,
div.spoiler div.resizewarning div small {
    color: white !important;
}

div.messagecontent a small {
    color: #014c93 !important;
}

div.messagecontent a:hover small {
    color: #b9133c !important;
}

@media and screen (max-width: 767px), (max-device-width: 767px) and (orientation: portrait), (max-device-width: 499px) and (orientation: landscape){
#menubar.hideheader {
animation: hide-menu 0.3s ease forwards;    -webkit-animation: none !important;
}
}

Ik ben achteruit de toekomst in gestruikeld. - van Rossum M.
Laaiend enthousiast kwam hij uit de brandende kerncentrale en keek stralend om zich heen.


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

enverlin schreef op dinsdag 12 maart 2019 @ 13:49:
Iemand al een stukje code om de nieuwe layout te verbeteren?

Ik heb het dan over het verbergen van fpAnkeiler en de "tr class" inBetweenContent.
Wat houd je tegen om zelf met je browser via 'inspecteer element' de onderdelen te zoeken en met Google uitvogelen hoe je elementen verbergt met CSS? Er zijn in dit topic al zat voorbeelden voor.

In dit topic geld hetzelfde als in alle andere fora: het is geen afhaalchinees. Dus laat even zien wat je zelf hebt gevonden. ;)


@Rubman, geen documentatie (in de vorm van comments) in je code, dus veel succes. :P

Commandline FTW | Tweakt met mate


  • Rubman
  • Registratie: april 2002
  • Laatst online: 17-04 05:53

Rubman

Retarded or just overjoyed!

Hero of Time schreef op dinsdag 12 maart 2019 @ 14:20:
[...]

Wat houd je tegen om zelf met je browser via 'inspecteer element' de onderdelen te zoeken en met Google uitvogelen hoe je elementen verbergt met CSS? Er zijn in dit topic al zat voorbeelden voor.

In dit topic geld hetzelfde als in alle andere fora: het is geen afhaalchinees. Dus laat even zien wat je zelf hebt gevonden. ;)


@Rubman, geen documentatie (in de vorm van comments) in je code, dus veel succes. :P
Ik bedoel het ook niet van hier is het, fix het.

Ik ga zeker zelf zoeken waar het uit hangt en zoeken.
Comments staan er inderdaad niet in omdat het een knip en plakwerk is van meerdere CSS-en van anderen met wat eigen prutswerk er tussendoor.

moet maar even een momentje pakken om alles eens op orde te krijgen.

Ik ben achteruit de toekomst in gestruikeld. - van Rossum M.
Laaiend enthousiast kwam hij uit de brandende kerncentrale en keek stralend om zich heen.


Acties:
  • +1Henk 'm!

  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Rubman schreef op dinsdag 12 maart 2019 @ 14:32:
[...]

Ik bedoel het ook niet van hier is het, fix het.
Dat was ook niet de strekking van m'n post. ;)
Ik ga zeker zelf zoeken waar het uit hangt en zoeken.
Comments staan er inderdaad niet in omdat het een knip en plakwerk is van meerdere CSS-en van anderen met wat eigen prutswerk er tussendoor.

moet maar even een momentje pakken om alles eens op orde te krijgen.
Dat was mijn punt. Ga eerst even uitzoeken en benoemen wat welk stukje code doet, maakt het een stuk makkelijker vinden als je iets wilt wijzigen. :) Mijn code heeft al aardig wat comments met wat wat doet, al zou het ietsjes beter kunnen. Maar het is iig niet het niveau wat jij hebt. :+

Commandline FTW | Tweakt met mate


  • Rubman
  • Registratie: april 2002
  • Laatst online: 17-04 05:53

Rubman

Retarded or just overjoyed!

Blijkt het niet eens aan mijn code te liggen.

Even alles uitgeschakeld en de frontpage ververst krijg ik ook slechts 1 uitgelicht nieuws item,

Dan wachten we even rustig af O-)

Ik ben achteruit de toekomst in gestruikeld. - van Rossum M.
Laaiend enthousiast kwam hij uit de brandende kerncentrale en keek stralend om zich heen.


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Rubman schreef op dinsdag 12 maart 2019 @ 14:42:
Blijkt het niet eens aan mijn code te liggen.

Even alles uitgeschakeld en de frontpage ververst krijg ik ook slechts 1 uitgelicht nieuws item,

Dan wachten we even rustig af O-)
*kuch* plan: Vernieuwde frontpage - Development-iteratie #151 *kuch*

Commandline FTW | Tweakt met mate


  • Rubman
  • Registratie: april 2002
  • Laatst online: 17-04 05:53

Rubman

Retarded or just overjoyed!

Ja zoals hij op de afbeelding in dat topic staat heb ik het niet.
Ik heb dus slechts 1 "ankler' met lees artikel, zoals hier te zien is

Ik ben achteruit de toekomst in gestruikeld. - van Rossum M.
Laaiend enthousiast kwam hij uit de brandende kerncentrale en keek stralend om zich heen.


  • segil
  • Registratie: januari 2003
  • Laatst online: 17-04 14:46
Volgens mij is de font ook veranderd op de frontpage. Hoe verander ik dat terug? /css-noob
En is er een manier om de menubalk aan te passen en dat "Carrière" weg te halen. Ik klik daar steeds op als ik Forum wil hebben :p

[Voor 42% gewijzigd door segil op 12-03-2019 15:08]


  • Zeror
  • Registratie: september 2003
  • Laatst online: 22:18

Zeror

Ik Henk 'm!

Font is nog steeds hetzelfde. Misschien een regular <--> bold versie wisseling.

Ik heb trouwens bij die ankeilers de comment counter weggehaald. Zag daar bij die ankeilers niet echt de meerwaarde van in.

[Voor 44% gewijzigd door Zeror op 12-03-2019 15:08]

Nintendo ID: Zeror_rk | SW-6670-3316-6323
Stem op 👍: 'Henk' knop (uitproberen?) | Betrouwbare reviews in PW


  • segil
  • Registratie: januari 2003
  • Laatst online: 17-04 14:46
Zeror schreef op dinsdag 12 maart 2019 @ 15:07:
Font is nog steeds hetzelfde. Misschien een regular <--> bold versie wisseling.

Ik heb trouwens bij die ankeilers de comment counter weggehaald. Zag daar bij die ankeilers niet echt de meerwaarde van in.
Ik zie toch echt een compleet andere font, zowel in de menubalk als de header van het artikel:


Acties:
  • +1Henk 'm!

  • RobIII
  • Registratie: december 2001
  • Laatst online: 05:48

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

Dit is mijn huidige CSS; wat-waarvoor dient staat in de comments van de CSS.

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
/* Automatisch spoilers tonen bij hover */ 
div.spoiler:hover {   
    color: white !important;   
} 

/* Quotes donkerder dan posts */
.message-quote-div {
    background-color: #dddede !important;
    border: 1px solid #c8c8c8 !important;
    color: #000 !important;
}

/* Gekke speechbubbles weg */
.commentCount {
    color: #616464 !important;
    background: none !important;
}

/* Paging voor dikke vingers */
.pageIndex .pageDistribution a {
    padding: 3px 10px;
}

/* Usabillia dinges weg */
.giveFeedback { display: none; }

/* Notify icon bounce */
#userbar li.icon.unread {
    -webkit-animation-duration: 5s; 
    animation-duration: 5s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    -webkit-animation-timing-function: linear; 
    animation-timing-function: linear; 
    animation-iteration-count:infinite; 
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
} 

@-webkit-keyframes bounce { 
    0%, 10%, 25%, 40%, 50%, 100% {-webkit-transform: translateY(0);} 
    20%, 30% {-webkit-transform: translateY(-10px);} 
} 

@keyframes bounce { 
    0%, 10%, 25%, 40%, 50%, 100% {transform: translateY(0);} 
    20%, 30% {transform: translateY(-10px);}
}

/* Bruikbare frontpage */
#categoryBar,
.fpAnkeiler,
.inBetweenContent,
#highlightedProducts,
#newsletter,
.secondColumn  {
    display: none;
}

table.highlights td {
    padding: 0;
    line-height: normal;
}

.mainColumn {
    width: 100% !important;
 }


.communityReviews,
.communityTopics,
.communityBlogs {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

#community .communityReviews .communityItem,
#community .communityTopics .communityItem,
#community .communityBlogs .communityItem {
    border: 0px;
    margin: 10px 10px;
}

#layout .mainColumn.frontpage {
    border: 0px;
}

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Roses are red Violets are blue, Unexpected ‘{‘ on line 32.

Over mij


Acties:
  • +1Henk 'm!

  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Rubman schreef op dinsdag 12 maart 2019 @ 14:58:
Ja zoals hij op de afbeelding in dat topic staat heb ik het niet.
Ik heb dus slechts 1 "ankler' met lees artikel, zoals hier te zien is
[Afbeelding]
Dat hoort zo. Er is nog geen extra informatie bij dat bewuste artikel/ankeiler vergeleken met de screenshot in het artikel.

Commandline FTW | Tweakt met mate


  • alex3305
  • Registratie: januari 2004
  • Laatst online: 14-04 13:37
Mijn meest recente versie die voor mij goed werkt nu:

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
/** New Tweakers **/

/* Disable tracker */
#menubottombar, html.js body.hasTracker #tracker {display: none}
html.js body.hasTracker {margin-left:0;}

/* Frontpage tweaks */
.fpAnkeiler.fullWidth {height:165px;}

#categoryBar, .secondColumn.frontpage, #newsletter {display:none;}
.mainColumn.frontpage, .fpAnkeiler {width:100%;}
table.highlights td {font-size:1.2em;line-height:1.5em;}

/* Forum tweaks */
div.message.topicstarter {
    border-top: 3px solid #a61e39 !important;
    border-bottom: 3px solid #a61e39 !important;
}
div.message.ownpost {
    border-top: 2px dashed #a61e39 !important;
    border-bottom: 2px dashed #a61e39 !important;
    background-image: none !important;
}
table.listing .topic a[title$="alex3305"] {font-weight: bold}

/* Topic Action List customization */
#forumheading .topic_actions .action_list li:first-child, .topic_actions .action_list li a {background: #D9ECFF; padding: 3px 5px; border-radius: 1px; display: inline-block; margin-right: 7px}
.topic_actions .action_list li a:hover {background: #0A8FC4; color: #fff; text-decoration: none;}
.topic_actions .action_list li:before {content: " "; margin: 0;}

.topic_actions .action_list li a[title^="Rapporteer dit topic"] {}
.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;}
.topic_actions .action_list li a[title^="Rapporteer dit topic"] img {display: none;}


Grootste issue met de nieuwe layout is vooral de font sizes. Deze zijn nog steeds met px gezet ipv punten of liever rem's. Dat komt de usability niet ten goede. Wanneer je namelijk vergroot browsed (bijv. 150%), gaat de layout gekke verschillen tonen met betrekking tot titels en tekst.

  • WrR0n
  • Registratie: juni 2017
  • Laatst online: 13-04 20:00
segil schreef op dinsdag 12 maart 2019 @ 15:00:
Volgens mij is de font ook veranderd op de frontpage. Hoe verander ik dat terug? /css-noob
En is er een manier om de menubalk aan te passen en dat "Carrière" weg te halen. Ik klik daar steeds op als ik Forum wil hebben :p
@segil Ja dat kan met deze regel:
Cascading Stylesheet:
1
2
3
#navMenu li a[href^="https://tweakers.net/carriere/it-banen/zoeken/"]{ 
 display: none;
}

:)

[Voor 21% gewijzigd door WrR0n op 13-03-2019 10:35]


  • Rubman
  • Registratie: april 2002
  • Laatst online: 17-04 05:53

Rubman

Retarded or just overjoyed!

Maar klopt het dat er nu slechts 1 nieuws item bovenin wordt weergegeven Waar dat er eerder 4 waren naast elkaar?

Ik heb nog steeds het idee dat ik wat mis om door te klikken naar volgende nieuws items of dat het zo'n lopende pagina is waar hij ze steeds af gaat.

Ik ben achteruit de toekomst in gestruikeld. - van Rossum M.
Laaiend enthousiast kwam hij uit de brandende kerncentrale en keek stralend om zich heen.


  • Zeror
  • Registratie: september 2003
  • Laatst online: 22:18

Zeror

Ik Henk 'm!

Rubman schreef op woensdag 13 maart 2019 @ 10:50:
Maar klopt het dat er nu slechts 1 nieuws item bovenin wordt weergegeven Waar dat er eerder 4 waren naast elkaar?
Nee, je hebt er nog steeds 4. 1 grote ankeiler bovenaan en 3 kleinere ankeilers in de lijst van nieuwsberichten.

Nintendo ID: Zeror_rk | SW-6670-3316-6323
Stem op 👍: 'Henk' knop (uitproberen?) | Betrouwbare reviews in PW


  • Creesch
  • Registratie: februari 2002
  • Laatst online: 22:27

Creesch

bla bla!

Dat sommige mensen visueel zijn ingesteld snap ik, dat daardoor iedereen tegen een stel posters moet aankijken voor reviews e.d. snap ik dan weer niet helemaal. Daarom een wat subtielere implementatie van het huidige frontpage fiasco hieronder.

https://tweakers.net/ext/f/SffddlZLm4lkTBSiqeRjmfaC/thumb.png

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
/* blurry achtergrond weg */
body .fpAnkeiler::before {
    display: none;
}


/* Comment count mag ook weg */
body .fpAnkeiler > a.commentCount {
  display: none;
}


/* "Lees verder", prijzen, etc. */
body .fpAnkeiler .fpaMeta {
  display: none;
}

/* Het algehele component */
body .fpAnkeiler {
    background: rgba(0,18,41,0.7);
}

/* De headline vormgeven */
body .fpAnkeiler .fpaTitle {
  display: inline-block;
  position: initial;
  background: rgba(255, 255, 255, 0);
  height: 60px;
  box-sizing: border-box;
  text-shadow: -1px -1px 0 rgba(0,18,41,0.7), 1px -1px 0 rgba(0,18,41,0.7), -1px 1px 0 rgba(0,18,41,0.7), 1px 1px 0 rgba(0,18,41,0.7);
}

/* Plaatje in een normaal formaat naast de headline */
body .fpaImage.review {
  display: inline-block;
  width: auto;
  height: 60px;
  vertical-align: top;
  float: right;
}

/* top banner  mag wat mij betreft gelijk aan de andere artikelen */
body .fpAnkeiler.fullWidth .fpaImage {
  display: inline-block;
  height: 60px;
}

body .fpAnkeiler.fullWidth .fpaImage img {
    height: 60px;
}


body .fpAnkeiler .fpaImage::before {
  display: none
}
body .fpAnkeiler.fullWidth {
  height: auto;
  width: 639px;
}

/* Aangezien de top banner hebben gefixed kan de rechter sidebar ook iets omhoog */
.secondColumn.frontpage.top {
    margin-top: -80px;
}



Daarnaast ook nog wat losse regels voor het verbergen van diverse elementen waar ik persoonlijk helemaal niks mee doe. Dat ziet er in totaal dan ongeveer zo uit

https://tweakers.net/ext/f/zJj43cud4avPeZ254628dHtZ/thumb.png

Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
/* Ik hoef geen promo te zien */

body #fpPromo {
    display: none;
}

/* Ik hoef ook geen video suggesties die kom ik wel tegen in de artikelen zelf.  */
body .fpItem#videos {
    display: none;
}

/* "acties" heb ik ook geen interesse in */
body .fpItem#sponsored {
    display: none;
}

/* de category bar gebruik ik eigenlijk ook helemaal niet */
#categoryBar {
    display: none;
}

/* En waarom zou ik eigenlijk willen zien hoeveel twitter en facebook dingen er zijn? */
.socialcount {
    display: none;
}

  • Zeehond
  • Registratie: juni 2015
  • Niet online

Zeehond

Frontpage Admin & PowerMod / Mod WG

Seal with it!

Een tijdje terug heb ik een dark theme gemaakt. Zie hieronder hoe deze er uit ziet:

https://tweakers.net/ext/f/xmdjmXIRb6UjMJ56D6yQA1kG/thumb.jpghttps://tweakers.net/ext/f/I1FQNgVAMoDi1x4ggMUCJgon/thumb.jpghttps://tweakers.net/ext/f/DmmKAV0HWzVK7XR1z4prYslC/thumb.jpg


De css is redelijk bug vrij (kan altijd dat ik iets niet gezien heb). Wellicht moet ik nog wat zaken bij polijsten, dan zal ik de CSS code in deze post updaten. Actief ondersteuning ga ik uiteraard niet leveren, maar als je de CSS ook op de site wil gebruiken dan staat deze hieronder. De code heeft hier en daar wat coments die zaken aanpassen makkelijker zouden moeten maken.
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
/*versie 5 18-04-2019*/
#forumheading .info, #forumheading #tweakbase_relations, #forumheading div.buttonnav {

}

#tweakbase_relations {
    background: #333;
    border: 1px solid #d9d9d9;
    box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.2);
}

#tweakbase_relations {
    position: relative;
}

.arrow#tweakbase_relations::before {
    display: none;
}

/*bovenste balk instellingen pagina*/
html.js body.hasTracker {
    background-color: #1d1d1d;
}

.arrow#tweakbase_relations::before {
    background: url("../../../g/forum/images/layout/arrow_top_white.png") no-repeat;
    content: "";
    height: 8px;
    left: 60px;
    position: absolute;
    top: -8px;
    width: 15px;
}

#tweakbase_relations h2 {
    color: #fff;
    cursor: pointer;
    display: block;
    font: 12px "arial","helvetica","Liberation Sans",sans-serif;
    font-weight: bold;
    margin: 0;
    padding-right: 14px;
    padding-top: 8px;
    padding-bottom: 4px;
    padding-left: 14px;
}

.collapsed#tweakbase_relations h2::before {
    transform: rotate(90deg);
}

#tweakbase_relations h2::before {
    background: url("../../../g/hidpi/icons/chevron_black.svg") no-repeat center/6px 10px;
    content: "";
    display: inline-block;
    height: 10px;
    margin-right: 5px;
    width: 10px;
}

.collapsed#tweakbase_relations .relationbox {
    display: none;
}

#tweakbase_relations .relationbox {
    padding: 0 10px 10px;
}

#tweakbase_relations .relationbox {
    line-height: 20px;
    overflow: hidden;
}

.topic_actions {
    margin-bottom: 0px;
    overflow: hidden;
}

.topic_actions {
    margin-bottom: 3px;
    overflow: hidden;
}

#forumheading .info {
    margin-bottom: 0px;
}
/*forum categorie header */
h2, header .subheading {
    color: rgba(179, 117, 35, 1);
}

/* andere headers (pricewatch/ va)*/
#header h1 .subtitle {
    color: rgba(179, 117, 35, 1);
    display: block;
    font-size: 16px;
}

@media screen and (min-width: 1500px) {
   #tweakbase_relations {
       position: absolute;
       width: 200px;
       margin-left: -250px;
   }
}

/*dark mode*/
#menubar {
    background-color: #000;
    background-image: -webkit-linear-gradient(top, #a41e39, #9a0e36 68px);
    background-image: -moz-linear-gradient(#a41e39, #9a0e36 68px);
    background-image: linear-gradient(to bottom, #000, #000);
    background-repeat: no-repeat;
    border-bottom: 1px solid #000;
    box-shadow: inset 0 -1px 0 #000;
    height: 44px;
    left: 0;
    position: relative;
    z-index: 110;
}

/*verbergtmenubottombar 9slogan*/
#menubottombar {
    display: none;
}

#bottom div.hr {
    display: none;
}


#contentArea {
    margin-bottom: 20px;
    padding-bottom: 20px;
    padding-top: 20px;
    background-color: #333;
}

/*5 b grote text en kleur*/
body {
    color: rgba(179, 117, 35, 1);
}

.messagecontent {
    font-size: 14px;
    word-wrap: break-word;
}

form table td.label {
    color: #fff;
}

#categoryBar ul li a {
    color: #fff;
    display: block;
    height: 42px;
    line-height: 17px;
    text-align: center;
}

h3 {
    color: #fff;
}

.messagecontent a {
    color: rgba(53, 159, 35, 1);
    text-decoration: underline;
}

.rbProductlist .item p.price a {
    color: rgba(179, 117, 35, 1);
}

.user, a.user:hover {
    color: #a0a0a0;
    font-weight: bold;
}

.menuHeaderPopup .notification .postInfo {
    max-height: 76px;
    overflow: hidden;
    padding-top: 4px;
    color: white;
}

.menuHeaderPopup .notification:hover .postInfo {
    max-height: 76px;
    overflow: hidden;
    padding-top: 4px;
    color: black;
}

.menuHeaderPopup .notification.unread .postInfo  {
    max-height: 76px;
    overflow: hidden;
    padding-top: 4px;
    color: black;
}


#header h1 .subtitle a {
     color: rgba(53, 159, 35, 1);
}

table.listing td.title a {
    color: rgba(53, 159, 35, 1);
}

table.listing td a {
    color: rgba(53, 159, 35, 1);
}

table.listing td.topic a {
    color: rgba(53, 159, 35, 1);
}

table.listing td.poster a {
    color: rgba(53, 159, 35, 1);
}

form a {
    color: rgba(53, 159, 35, 1);
    cursor: pointer;
    text-decoration: none;
}

.action_list li.viewcount {
    color: #a0a0a0;
}

.reactieContent blockquote {
    border-left: 3px solid #d7d7d7;
    color: #a0a0a0;
    margin: 10px 0 10px 10px;
    padding-left: 5px;
}

table.listing p.title, table.forumlisting p.title {
    color: rgba(0, 224, 217, 1);
    font-size: 14px;
    font-weight: normal;
}

/*auteur artikel */
.authorBlock .info {
    margin-left: 10px;
    padding: 3px;
}

.reactieHeader .userLink {
    color: #a0a0a0;
    font-weight: bold;
}

.messageheader .date a {
    color: #a0a0a0;
}

.authorBlock .info .name a {
    color: #a0a0a0;
}

.message .poster .title {
    color: #a0a0a0;
    font-size: 11px;
    margin-bottom: 5px;
    font-weight: bold;
}

.crew, a.crew:hover {
    color: #b9133d;
}

.mbr {
    color: rgba(0, 173, 78, 1);
}

/*forum messages */
div.info, div.error, div.message, div.faq, form.insertMessage, form.form1, form.form2, #folders, #myprofilecontainer {
    background-color: #333;
    background-image: -webkit-linear-gradient(top, #333, #333 40px);
    background-image: -moz-linear-gradient(#333, #333 40px);
    background-image: linear-gradient(to bottom, #333, #333 40px);
    background-repeat: no-repeat;
    border: 1px solid #d9d9d9;
    border-radius: 1px;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.33);
}

.reactieBody.informative {
    background: #333;
    border-color: rgba(130, 185, 19, 1);
}

.reactieBody.spotlight {
    background: #333;
    border-color: #00971f;
}

/*quotes*/
.messagecontent .message-quote-div {
    background-color: #1d1d1d;
    border: 1px solid #d9d9d9;
    border-radius: 1px;
    color: #a0a0a0;
    margin: 2px 0;
    padding: 10px;
}

/*links above topic*/
a {
    color: rgba(53, 159, 35, 1);
    text-decoration: none;
}

/*kleur crew*/
.crew, a.crew:hover {
    color: rgba(19, 154, 185, 1);
}


/*carousel 3 b*/
.fpaItem > a {
    display: block;
    position: relative;
    text-decoration: none !important;
}

.fpaItem .fpaTitle {
    background: rgba(255,255,255,0.9);
    bottom: 0;
    box-sizing: border-box;
    left: 0;
    padding: 4px 10px 5px;
    position: absolute;
    width: 100%;
    z-index: 1;
}

.fpaItem .fpaMeta {
    background: rgba(255,255,255,0.9);
    bottom: 0;
    font-size: 12px;
    height: 24px;
    line-height: 24px;
    padding: 0 10px;
    position: absolute;
    width: 100%;
    display: none;
}

/*reageerbox*/
form dl dd textarea {
    font-size: 13px;
    height: 120px;
    width: 632px;
    background-color: rgba(196, 196, 196, 1);
}

/*meer & account dropdown,  blokken */
.dropdown ul {
    background: rgba(36, 36, 36, 1);
    border: 1px solid #e6e6e6;
    border-radius: 1px;
    display: block !important;
    list-style: none;
    margin: 0;
    padding: 5px 0;
}

.dropdown li, .dropdown li > a {
    color: #fff !important;
    text-decoration: none;
}

table.listing {
    background-color: rgba(0, 0, 0, 1);
    background-image: -webkit-linear-gradient(rgb(145, 145, 145), rgb(140, 140, 140));
    background-image: -moz-linear-gradient(#919191, #8c8c8c);
    background-image: linear-gradient(rgb(0, 0, 0), rgb(0, 0, 0));
    empty-cells: show;
    margin: 0 0 10px 0;
    table-layout: fixed;
    width: 100%;
}

body, #bottom div.hr, #entity, #heroBlock, #searchbar, .galleryHeadingContainer, .pageTabsContainer, .notificationsContainer {
    background-color: #1d1d1d;
}

.bar {
    background: #666;
    border: 1px solid #666;
    border-radius: 1px;
    color: #000;
    font-size: 12px;
    line-height: 18px;
    margin: 0;
    min-height: 18px;
    padding: 7px 20px 7px 10px;
}

#categoryBrowser {
    background: #666;
    border: 1px solid #666;
    border-radius: 1px;
    font-size: 12px;
    margin-bottom: 20px;
    padding: 10px;
    width: 958px;
}

#categoryBrowser div {
    background: #a0a0a0;
    border: 1px solid #a0a0a0;
    border-radius: 1px;
    height: 384px;
    position: relative;
    width: 280px;
}

table.pwListTable input, table.pwListTable select, table.pwListTable textarea {
    max-width: 280px;
    background-color: rgba(191, 191, 191, 1);
}

table.listing td {
    background-color: #f7f7f7;
    background-image: -webkit-linear-gradient(rgb(247, 247, 247), rgb(242, 242, 242));
    background-image: -moz-linear-gradient(#333, #333);
    background-image: linear-gradient(rgb(51, 51, 51), rgb(51, 51, 51));
    border-bottom: 1px solid #d9d9d9;
    border-top: 1px solid #fafafa;
    color: rgba(179, 117, 35, 1);
    line-height: 18px;
    padding: 10px 5px;
    text-align: left;
}

.fixedHeader .menuHeaderPopup {
    position: fixed;
    background-color: rgba(36, 36, 36, 1);
}

.reactieBody {
    border: 1px solid #d9d9d9;
    margin-bottom: 10px;
    max-width: 656px;
    padding: 10px 15px 8px;
    position: relative;
    box-sizing: border-box;
    background-color: #333;
}

body.hero #contentArea {
    background: none;
    background-image: -webkit-linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255)), -webkit-linear-gradient(rgba(255, 255, 255, 0.85), rgb(255, 255, 255));
    background-image: -moz-linear-gradient(#fff, #fff),-moz-linear-gradient(rgba(255,255,255,0.85), #fff);
    background-image: linear-gradient(rgb(51, 51, 51), rgb(51, 51, 51)), linear-gradient(rgba(255, 255, 255, 0.85), rgb(255, 255, 255));
    background-repeat: no-repeat, no-repeat;
    background-position: 0 100px,0 0;
    background-size: 100% 100%, 100% 100px;
    margin-top: -250px;
    position: relative;
}

/*thumbs up*/
.action_list li.rating .ratingcount {
    color: rgba(179, 117, 35, 1);
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    min-width: 30px;
    vertical-align: top;
}

/*modbreak*/
fieldset.modbreak {
    background-color: #f2dde1;
    background-image: -webkit-linear-gradient(rgb(242, 221, 225), rgb(240, 216, 221));
    background-image: -moz-linear-gradient(#f2dde1, #f0d8dd);
    background-image: linear-gradient(rgb(242, 221, 225), rgb(240, 216, 221));
    border: 1px solid #e5b8c3;
    border-radius: 1px;
    box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.2);
    font-size: 12px;
    line-height: 20px;
    margin: 0;
    padding: 5px 10px 10px 10px;
    width: auto;
    color: black;
}

/*modbreak legend tag*/
fieldset.modbreak legend {
    color: #b9133d;
    display: block;
    font-size: 13px;
    font-weight: 700;
    background-color: #f2dde1;
}

/*reviews*/
body.hero #contentArea {
    background: none;
    background-image: -webkit-linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255)), -webkit-linear-gradient(rgba(255, 255, 255, 0.85), rgb(255, 255, 255));
    background-image: -moz-linear-gradient(#333, #333),-moz-linear-gradient(rgba(255,255,255,0.85), #333);
    background-image: linear-gradient(rgb(51, 51, 51), rgb(51, 51, 51)), linear-gradient(rgb(51, 51, 51), rgb(51, 51, 51));
    background-repeat: no-repeat, no-repeat;
    background-position: 0 100px,0 0;
    background-size: 100% 100%, 100% 100px;
    margin-top: -400px;
    position: relative;
}

/*kleur dm lijst*/
table.listing.dm td {
    background-color: #333;
}

/*titel kleur (FP)*/
.articleColumn.wide .headingContent .subheading {
    color: rgb(53, 159, 35);
    font-size: 24px;
    line-height: 1.1;
    margin-bottom: 10px;
}

/*subtitel (FP)*/
#contentArea .centeredContent h2.chapter {
    color: rgb(53, 159, 35);
    font-size: 21px;
    line-height: 1.1;
}

h1{
    color: rgb(53, 159, 35);
}

/*in text kop (FP)*/
.streamer {
    color: rgb(53, 159, 35);
    float: right;
    font-size: 21px;
    font-style: italic;
    line-height: 28px;
    margin: 20px;
    margin-right: 0;
    padding: 6px 0 11px;
    quotes: none;
    text-align: left;
    width: 285px;
}

/*Reactie ingeklapt FP*/
.reactieBody.hidden .reactieHeader a {
    color: #a0a0a0;
    text-decoration: none;
}

/*search*/
@media screen and (min-width: 1500px) {

#search .keywordSearch {
    height: 28px;
    line-height: 28px;
    /* margin: 0 auto; */
    width: 248px;
    margin-top: -25px;
    z-index: 200;
    position: fixed;
}

body.customColor #searchbar {
    background-color: #1d1d1d;
    height: 0px;
    z-index: 200;
    margin-top: -20px;
        margin-right: -725px;
        float: right;
    /* width: 300px; */
}

/*background*/
#layout {
    clear: both;
    background-color: #1d1d1d;
        padding-top: 18px;
}
}
@media screen and (max-width: 1499px) {
  #searchbar {
    background-color: #1d1d1d !important;
}

/*background*/
#layout {
    clear: both;
    background-color: #1d1d1d;
}
}

/*pricewatch*/
#categoryBrowser .large li {
    height: 118px;
    width: 122px;
    background-color: #a0a0a0;
}

.filterGroup .filters {
    padding: 0 8px;
    background-color: #a0a0a0;
}

.filterOption label {
    color: #000;
    cursor: pointer;
}

.filterOption.collapsed h4 {
    color: #666;
}

.sliderLabel, .sliderSecondLabel {
    font-size: 12px;
    left: 0;
    position: absolute;
    top: -27px;
    white-space: nowrap;
    color: #000;
}

.filterOption .hideLink, .filterOption .showLink {
    cursor: pointer;
    display: block;
    margin-left: 2px;
    padding-left: 15px;
    color: blue;
}

.sliderBar .selected {
    background: #960505;
    left: 106px;
    position: absolute;
    top: 0;
    width: 60px;
}

table.listing thead th {
    border-bottom: 0;
    font-weight: bold;
    min-height: 25px;
    text-align: left;
    padding-top: 3px;
}

#entity > div {
    border-top: 0px solid #d9d9d9;
    margin: 0 auto;
    min-width: 980px;
    padding: 15px 0 10px 0;
    width: 90%;
}
/*eind pricewatch*/

.galleryHeadingContainer > div {
    border-top: 0x solid #d9d9d9;
    margin: 0 auto;
    min-width: 980px;
    padding: 15px 0 10px 0;
    width: 90%;
}
De css is te lang om =css mee te geven aan ubb code :P

Edit versie 5: Kleine verbeteringen

[Voor 255% gewijzigd door Zeehond op 18-04-2019 16:26]

select * from Fish;


  • Bas170
  • Registratie: april 2010
  • Laatst online: 17-04 17:04

Bas170

Sir Miss-a-Lot

@Creesch Je ene screenshot toont de zoekbalk wel, de andere niet. Wordt die ergens weggefilterd (ik zie het zo 123 niet in de code) of komt het door scrollen?

PSN: Bas170 | Hier had wat nuttigs kunnen staan
Mexicaans? Nee, daar krijg ik diarree van


Acties:
  • +1Henk 'm!

  • Creesch
  • Registratie: februari 2002
  • Laatst online: 22:27

Creesch

bla bla!

Bas170 schreef op vrijdag 15 maart 2019 @ 13:00:
@Creesch Je ene screenshot toont de zoekbalk wel, de andere niet. Wordt die ergens weggefilterd (ik zie het zo 123 niet in de code) of komt het door scrollen?
Dat komt door het scrollen. Mocht je die willen verbergen kan je twee dingen doen

Cascading Stylesheet:
1
2
3
body #search {
    display:none;
}


Dan houd je de grijze witruimte. Deze kan je aanpassen door de hoogte aan te passen van het parent element
Cascading Stylesheet:
1
2
3
body #searchbar {
    height: 55px;
}



Je kan als je helemaal geen witruimte wil ook onderstaande gebruiken.

Cascading Stylesheet:
1
2
3
body #searchbar {
    display:none;
}

  • Bas170
  • Registratie: april 2010
  • Laatst online: 17-04 17:04

Bas170

Sir Miss-a-Lot

Creesch schreef op vrijdag 15 maart 2019 @ 13:10:
[...]


Dat komt door het scrollen. Mocht je die willen verbergen kan je twee dingen doen

Cascading Stylesheet:
1
2
3
body #search {
    display:none;
}


Dan houd je de grijze witruimte. Deze kan je aanpassen door de hoogte aan te passen van het parent element
Cascading Stylesheet:
1
2
3
body #searchbar {
    height: 55px;
}



Je kan als je helemaal geen witruimte wil ook onderstaande gebruiken.

Cascading Stylesheet:
1
2
3
body #searchbar {
    display:none;
}
Dank je!
Ik wil hem niet verbergen, maar wel jouw code overnemen.
Ik was bang dat de searchbar dan zou verdwijnen, maar dat is gelukkig niet zo :)

PSN: Bas170 | Hier had wat nuttigs kunnen staan
Mexicaans? Nee, daar krijg ik diarree van


  • Royy90
  • Registratie: februari 2010
  • Laatst online: 17-04 17:46
Ik heb de menubar een volledig black/white theme gegeven en ben bijna tevreden over het eindresultaat. Maar toch zijn er nog een paar dingen die ik niet kan fixen. Hopelijk kan iemand me hier verder helpen.

De css:
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
/* - - - Menubar - - - */


@media (min-width: 1185px) {
a{
  color: #000;
}

/*menubar zwart maken en border toevoegen i.v.m. geselecteerd item*/
#menubar {
  height: 48px;
  box-shadow: none;
  background: #000;
  border-bottom: solid 3px #000;
}

/*carriere weghalen uit het menu*/
#navMenu li a[href^="https://tweakers.net/carriere/it-banen/zoeken/"]{ 
 display: none;
}

/*menu over de breedte van de content page verbreden*/
#menu {
  padding-left: 39px;
  padding-right: 39px;
}

/* - - - Logo - - - */
/*Logo iets lager zetten*/
#menu #logo {
  margin-top: 3.5px;
}

/*geen hover bij het logo(achtergrond zwart)*/
#logo:hover,#menu>ul>li:not(.selected):hover {
  background-color:#000;
  border-bottom:1px solid #000;
}

/* - - - Menu - - - */
/*menu items in lowercase*/
  ul#navMenu{
  text-transform: lowercase;
}

/*witte text color when hover*/
#menu :hover{
  color: #000;
}

/*reverse text color when hover "dropdowns" */
#menu li.more.last :hover{
  color: #000;
  border-bottom: none;
}

#menu>ul>li:not(.selected):hover{
  background-color: #fff;
  height: 100%;
  border-bottom: solid 3px #fff;
}

/*reverse color active item*/
#menu>ul>li.active :hover{
  background-color: #fff;
  color: #000;
  border-bottom: solid 3px #fff;
}

#menu>ul>li {
  line-height: 46px;
}

#menu .sitename+ul, #menu>ul>li, #menu>ul>li>a {
  height: 48px;
}

#menu>ul>li:not(.selected):hover { 
  height: 48px;
  border-bottom: solid 3px #fff;
}

 /* Menu Dropdowns black/white */
#menu li.dropdown li:hover {
  background-image:-webkit-linear-gradient(#000, #000);
}

/*witte underline bij actieve item*/
#menu li.active a {  
   border-bottom: solid 3px #fff;
}

/*witte tekst kleur actieve menu-item*/
#menu>ul>li.active a{
  color: #fff;
}

/* - - - Userbar - - - */
#userbar li.icon a {
  margin-top: 9px;
}

/*user>activiteit correct color */
#menu li.indent.more :hover{
  color: #fff;
}

#menubottombar{
  display: none;
}

/*onderstaande css maakt de icons zwart bij hover*/
#userbar li.compare :hover{
    background-position: -24px -152px;
}
#userbar li.icon.messages :hover{
    background-position: -24px 0;
}
#userbar li.notifications :hover{
    background-position: -24px -24px;
}
#userbar li.display :hover{
    background-position: -24px -128px
}

/*Usermenu lowercase*/
.profileNavigation{
    text-transform: lowercase;
}

/*pijltjes zwart bij hover*/
#menu > ul > li.more > span:hover::after {
    background: url("../../../g/hidpi/icons/chevron_black.svg") no-repeat center / 6px 10px;
    content: '';
    display: inline-block;
    height: 10px;
    margin-left: 4px;
    transform: rotate(90deg);
    vertical-align: middle;
    width: 10px
}
}

Nu de "bugs"…

- Bij het usermenu worden de icons prima zwart bij een hover. Alleen zodra je te ver boven het icon zit met je muis is het icoontje niet zwart.

Nu heb ik het volgende geprobeerd maar dan verspringt het icoontje halverwege de menubar en zie je een 2e icoon erbij.
Cascading Stylesheet:
1
2
3
4
5
  #userbar li.icon :hover{
   background-color: #fff;
   height: 100%;
   margin-top: -3px;
}

- Het actieve menu item is underlined met een witte lijn(border). Alleen wanneer je in een submenu zit van “meer”, bijvoorbeeld “profielen”, dan is “meer” niet wit onderstreept?

- Omdat er een border zit onder de menubar(3px) wordt de text niet zwart wanneer je precies hovert op deze border. Het zou mooier zijn als de text dan ook al zwart wordt.

- Kan je de radiobuttons ook zwart maken? Volgens mij ligt dit meer aan het os/browser dan dat het een css dingetje is.

De reden dat ik een border gebruik voor de underline is omdat de menu items anders omhoog springen wanneer het geselecteerd is. Als dit anders kan, maar er precies hetzelfde uitziet dan hoor ik het ook graag.

Acties:
  • +6Henk 'm!

  • Mic2000
  • Registratie: december 2006
  • Laatst online: 21-03 12:44
Druk bezig met een custom css te creëren, valt me nog tegen hoeveel qua css aangepast moet worden om de hele site goed te krijgen... Mijn css-skills zijn ook aardig roestig... lukt me al niet om de bovenste header "Vergelijk producten en prijzen" wat tevens een link is die visited is, toch de blauwe kleur te krijgen. Andere bezochte links doe ik wel grijs maken...

Ik heb nu
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
/* rode headers */
h1, h2, header .subheading {
    color: #0091ea;
}
h1 a, h2 a, header .subheading a:visited {
    color: #0091ea;
}
     h1, h2, h3{
       a{
         color:#0091ea !important;
         &:visited{ color:#0091ea !important;}
       }
     }


Als iemand een tip heeft :) Ook de paarse kleur bij bezochte linkjes wilt niet grijs worden... heb simpel:
code:
1
2
3
a:visited {
  color: #afafaf;
}




Edit: oke ik heb er al
code:
1
2
3
table a:visited {
  color: #afafaf;
}


Nu is gelijk de header opgelost... man man man, wat een tijd geleden die css stuff... Maar wel leuk als het allemaal lukt aan te passen :)

Edit 23-3-2019:
---------------------------------------------------------------

Ondertussen al weer wat meer feeling met CSS gekregen. Het begint aardig leuk te worden. Ik dacht ik houd jullie up to date met de vorderingen. Ik release de CSS wanneer ik het meeste van de site heb weten te veranderen naar de 'dark side'. :Y)

[Voor 32% gewijzigd door Mic2000 op 23-03-2019 21:35]


  • MarnickS
  • Registratie: februari 2016
  • Laatst online: 21:20
MarnickS schreef op vrijdag 15 februari 2019 @ 16:18:
Ik heb hier nog een hele simpele dark mode voor Tweakers die aardig compleet is. Werkt ook volledig op mobiel (ook de pricewatch filters).

https://del.dog/tweakersdarkcss
Een grote update van de bovenstaande css:
https://del.dog/d/tweakerscss_v26-3-2019
Ik heb behoorlijk wat veranderd, maar nog niet alles werkt super goed.



Dell XPS 15 9560 · Xiaomi Mi Mix 2S (Evolution X ROM) · NVIDIA SHIELD TV


  • Nielless
  • Registratie: december 2016
  • Laatst online: 19:13

Nielless

Born at a very young age.

Mic2000 schreef op zondag 17 maart 2019 @ 19:23:
Druk bezig met een custom css te creëren, valt me nog tegen hoeveel qua css aangepast moet worden om de hele site goed te krijgen... Mijn css-skills zijn ook aardig roestig... lukt me al niet om de bovenste header "Vergelijk producten en prijzen" wat tevens een link is die visited is, toch de blauwe kleur te krijgen. Andere bezochte links doe ik wel grijs maken...
Benieuwd naar het resultaat en de code _/-\o_

Website: NdeM.nl // XBL: Nielless // STEAM: Nielles™


  • mschol
  • Registratie: november 2002
  • Niet online
de "wij stellen technologie op de proef" balk was een mooie break tussen menu en content, heel irritant dat die weg is

hoe lossen jullie dat op?

[Voor 10% gewijzigd door mschol op 27-03-2019 23:59]


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Als je dat wilt, #layout een padding-top geven van hoe groot je 't wilt hebben. Of #top padding-bottom.

[Voor 13% gewijzigd door Hero of Time op 28-03-2019 07:56]

Commandline FTW | Tweakt met mate


  • mschol
  • Registratie: november 2002
  • Niet online
Hero of Time schreef op donderdag 28 maart 2019 @ 07:56:
Als je dat wilt, #layout een padding-top geven van hoe groot je 't wilt hebben. Of #top padding-bottom.
vanavond eens knutselen.

beetje offtopic wellicht, maar stelt tweakers technologie niet meer op de proef? dat die balk met slogan verwijderd is? :P

  • Bas170
  • Registratie: april 2010
  • Laatst online: 17-04 17:04

Bas170

Sir Miss-a-Lot

mschol schreef op donderdag 28 maart 2019 @ 08:29:
[...]

beetje offtopic wellicht, maar stelt tweakers technologie niet meer op de proef? dat die balk met slogan verwijderd is? :P
Die is verwijderd om ruimte te besparen: plan: Bugbash en weghalen zwarte balk - Development-iteratie #152

PSN: Bas170 | Hier had wat nuttigs kunnen staan
Mexicaans? Nee, daar krijg ik diarree van


  • Jogai
  • Registratie: juni 2004
  • Laatst online: 17-04 09:09
Een vermelding waard.
LankHoar schreef op maandag 14 januari 2019 @ 15:20:
Al enige tijd gebruik het thema van @EotT en die bevalt me prima: https://userstyles.org/st.../tweakers-dark-v2-by-eott

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

Native ondersteuning zou uiteraard nog steeds beter zijn!
Een user met maar 100 reacties op heel tweakers, maar wel een netjes gepubliceerd via userstyles. Fijn voor mij is dat hij ook als userscript is te installeren, zodat ik niet een extensie extra hoef te installeren (ik heb alleen uBlock origin, Cookie autodelete,en violentmonkey).

Full time freelance sinds 2020! Link me =====> www.linkedin.com/in/wdingemanse


  • Fidelity
  • Registratie: januari 2006
  • Laatst online: 00:44
Mic2000 schreef op zondag 17 maart 2019 @ 19:23:
Druk bezig met een custom css te creëren [...]
Wouw! Dat ziet er gelikt uit. Zou het graag willen gebruiken zodra je er klaar mee bent :)

  • Mic2000
  • Registratie: december 2006
  • Laatst online: 21-03 12:44
Fidelity schreef op woensdag 17 april 2019 @ 22:24:
[...]


Wouw! Dat ziet er gelikt uit. Zou het graag willen gebruiken zodra je er klaar mee bent :)
Ja man, ik moet er nog eens even verder mee aan de slag :)

  • Zeehond
  • Registratie: juni 2015
  • Niet online

Zeehond

Frontpage Admin & PowerMod / Mod WG

Seal with it!

Vandaag heb ik wat bugs geplet in mijn dark CSS, de boel wat gepolijst en de searchbar verhuist naar rechts boven voor grotere schermen (min 1500px).



Code zie: Zeehond in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'"

Zo te zien hing mijn muis net op het pricewatch linkje :P

[Voor 30% gewijzigd door Zeehond op 18-04-2019 16:04]

select * from Fish;


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

@Zeehond, heh, ik zie groen en oranje voor linkjes. Zou dat bij een van mijn eerste versies vandaan komen? :P

Commandline FTW | Tweakt met mate


  • Zeehond
  • Registratie: juni 2015
  • Niet online

Zeehond

Frontpage Admin & PowerMod / Mod WG

Seal with it!

Hero of Time schreef op donderdag 18 april 2019 @ 15:57:
@Zeehond, heh, ik zie groen en oranje voor linkjes. Zou dat bij een van mijn eerste versies vandaan komen? :P
Nee, zelf bij uit gekomen dus we hebben toevallig gewoon dezelfde smaak :P. ik had in een van mijn eerste versies (niet hier neer gezet) lichtblauw voor linkjes en lichtgrijs voor de tekst, maar dat leest niet prettig op een duistere achtergrond voor langere tijd.

Ik weet eigenlijk niet of ik jouw eerste versie ooit gezien heb?

select * from Fish;


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Zeehond schreef op donderdag 18 april 2019 @ 16:02:
[...]

Nee, zelf bij uit gekomen dus we hebben toevallig gewoon dezelfde smaak :P. ik had in een van mijn eerste versies (niet hier neer gezet) lichtblauw voor linkjes en lichtgrijs voor de tekst, maar dat leest niet prettig op een duistere achtergrond voor langere tijd.

Ik weet eigenlijk niet of ik jouw eerste versie ooit gezien heb?
Plaatjes ervan vind je ergens in dit topic. Nu heb ik witte tekst, grijze links onbezocht en iets donkerder grijs voor bezocht.

Commandline FTW | Tweakt met mate


  • Zeehond
  • Registratie: juni 2015
  • Niet online

Zeehond

Frontpage Admin & PowerMod / Mod WG

Seal with it!

Hero of Time schreef op donderdag 18 april 2019 @ 16:12:
[...]

Plaatjes ervan vind je ergens in dit topic. Nu heb ik witte tekst, grijze links onbezocht en iets donkerder grijs voor bezocht.
Dan heb je het zo te zien meerdere keren gewijzigd, jouw eerste post hier is Hero of Time in "[verzamel] CSS-styles; 'Hoe ziet jouw T.net eruit?'" Maar daar zijn de linkjes nog niet groen.

Ook nog even snel het pricewatch/ v&a stuk onder handen genomen, elke keer als ik daar keek bedacht ik mij dat ik die nog moest aanpakken :P.

https://tweakers.net/ext/f/SB5aR3MTFdBytcwwECIH4PJJ/thumb.jpg

[Voor 5% gewijzigd door Zeehond op 18-04-2019 16:30]

select * from Fish;


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

@Zeehond, iig met https://tweakers.net/ext/f/NRiDDDXNkzG61SH7dMH5s9OB/full.png had ik oranje. :P Is dan wel voor de datum, maar het was wel voor meer zaken oranje iig. Nu heb ik nog voor de TS de datum van de post groen.

Reden dat ik het niet meer ben gaan gebruiken, was dat het wat rommelig oogde en soms slecht leesbaar was. Het contrast was net niet goed genoeg, bijvoorbeeld als het zonnetje of een andere lichtbron direct op je scherm scheen.

Commandline FTW | Tweakt met mate


  • Zeehond
  • Registratie: juni 2015
  • Niet online

Zeehond

Frontpage Admin & PowerMod / Mod WG

Seal with it!

@Hero of Time jij hebt zo te zien meer de huisstijl groen van Tweakers gebruikt. Met dat oranje lastig leesbaar is heb ik geen las van, maar ik heb wel een andere tint oranje en een andere kleur voor de achtergrond gebruikt dus dat heeft wellicht nog invloed. Een forum topic ziet er bij mij zo uit: https://tweakers.net/ext/f/SF2MgTHtGPuQeRDPBByNk66l/full.jpg. (blauwe username is enkel bij mods).

[Voor 10% gewijzigd door Zeehond op 18-04-2019 21:13]

select * from Fish;


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

@Zeehond, kijk eens goed naar de datum van de posts in m'n plaatje. Dat oranje. Niet op andere plekken, zoals in de post zelf. Die zijn idd huisstijl 'groen'.

En het plaatje waar je naar linkt, kan niet in mijn fotoalbum gevonden worden. ;)

Commandline FTW | Tweakt met mate


  • Zeehond
  • Registratie: juni 2015
  • Niet online

Zeehond

Frontpage Admin & PowerMod / Mod WG

Seal with it!

Hero of Time schreef op donderdag 18 april 2019 @ 19:51:
@Zeehond, kijk eens goed naar de datum van de posts in m'n plaatje. Dat oranje. Niet op andere plekken, zoals in de post zelf. Die zijn idd huisstijl 'groen'.
Dat had ik gezien, vandaar ook: "Met dat oranje lastig leesbaar is heb ik geen las van, maar ik heb wel een andere tint oranje en een andere kleur voor de achtergrond gebruikt dus dat heeft wellicht nog invloed." :P
En het plaatje waar je naar linkt, kan niet in mijn fotoalbum gevonden worden. ;)
Fixed :P

select * from Fish;


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Zeehond schreef op donderdag 18 april 2019 @ 19:54:
[...]

Dat had ik gezien, vandaar ook: "Met dat oranje lastig leesbaar is heb ik geen las van, maar ik heb wel een andere tint oranje en een andere kleur voor de achtergrond gebruikt dus dat heeft wellicht nog invloed." :P
Wat voor mij de exacte reden was om het te veranderen weet ik niet meer, maar het gebruik ervan was om meer 'kleur' op de pagina's te krijgen. Maar echt succesvol was dat dus niet.
[...]

Fixed :P
Heb je er ook een vergrootglas microscoop bij? :P Het idee is iig wel duidelijk, dat zag ik op je eerdere plaatjes al.

Commandline FTW | Tweakt met mate


  • Zeehond
  • Registratie: juni 2015
  • Niet online

Zeehond

Frontpage Admin & PowerMod / Mod WG

Seal with it!

Hero of Time schreef op donderdag 18 april 2019 @ 19:58:
[...]

Wat voor mij de exacte reden was om het te veranderen weet ik niet meer, maar het gebruik ervan was om meer 'kleur' op de pagina's te krijgen. Maar echt succesvol was dat dus niet.
Opzicht vind ik het er niet verkeerd uit zien. Wellicht had je hooguit de blauwe linkjes gewoon licht grijs kunnen laten? Dat scheelt één kleur per post. Heb jij de reacties overigens breder gemaakt of waren ze eerst gewoon breder?
Heb je er ook een vergrootglas microscoop bij? :P Het idee is iig wel duidelijk, dat zag ik op je eerdere plaatjes al.
Geeft gaf toch een mooi in één oog opslag overzicht weer? :+

select * from Fish;


  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

Bij die plaatjes had ik de boel zelf breder gemaakt. Op m'n PC en HTPC doe ik dat ook met m'n browser via de ingebakken functionaliteit (HTPC vergroot ik ook de tekst naar een leesbare grootte :P), maar in m'n standaard CSS in m'n profiel doe ik dat niet. Zie m'n Gdrive link eerder dit topic, daar heb ik twee CSS bestanden staan, met eentje dus als 't goed is tweaks e.d. met ook het breder maken van wat zaken.

Commandline FTW | Tweakt met mate


  • Zeror
  • Registratie: september 2003
  • Laatst online: 22:18

Zeror

Ik Henk 'm!

Laatste alinea bij plan: Upgrade naar Symfony 4 - Development-iteratie #154
We hebben een aantal ideeën om het uitwisselen van custom CSS, zoals dat nu al gebeurt in het Forum, beter te facilitieren, zodat jullie je eigen tweaks makkelijker kunnen delen. Zodra we daarover iets concreters kunnen melden, laten we het weten.
Ben erg benieuwd wat dit gaat zijn. :)

[Voor 16% gewijzigd door Zeror op 23-04-2019 15:09]

Nintendo ID: Zeror_rk | SW-6670-3316-6323
Stem op 👍: 'Henk' knop (uitproberen?) | Betrouwbare reviews in PW


Acties:
  • +1Henk 'm!

  • ikloon
  • Registratie: juni 2010
  • Laatst online: 19:36

ikloon

Product Owner
Een opvolging op de aankondiging hiervan doen we in Custom CSS snippets. :)

“Internet is een internationaal verschijnsel” (minister Piet-Hein Donner, 6 sept 2011)


Acties:
  • +8Henk 'm!

  • Creesch
  • Registratie: februari 2002
  • Laatst online: 22:27

Creesch

bla bla!

Geen idee waarom het nodig was maar sommige css classes hebben bij de laatste iteratie een andere naam gekregen. Gelijk maar even de boel wat gefinetuned.

Dat ziet er dan zo uit:

https://tweakers.net/ext/f/F2xAEUQbjIb8NpnxGuPZyoCP/thumb.png


Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
@media (min-width: 1200px) {

    /* blurry achtergrond weg */
    body .fpAnkeiler::before {
        display: none;
    }

    /* Het algehele component */
    body .fpAnkeiler {
        background: rgba(0,18,41);
        width: 639px;
    }

    /* Comment count mag ook weg */
    body .fpAnkeiler > a.commentCount {
      display: none;
    }

    /* "Lees verder", prijzen, etc. */
    body .fpAnkeiler .meta {
      display: none;
    }

    body .fpAnkeiler.large {
        height: 60px;
    }


    /* Plaatje in een normaal formaat naast de headline */
    body .fpAnkeiler .image {
      display: inline-block;
      width: auto;
      height: 60px !important;
      vertical-align: top;
      float: right;
    }

    body .fpAnkeiler .image img {
        height: 60px;
        width: auto;
    }

    body .fpAnkeiler .fpaImage::before {
      display: none
    }
    
    /* Aangezien de top banner hebben gefixed kan de rechter sidebar ook iets omhoog */
    .secondColumn.frontpage.top {
        margin-top: -60px;
    }
    
    /* Ik kijk elke dag al nieuws, dit klinkt als een tweakers filter bubble om makkelijk dingen te missen die in de rest van medialand ook niet aan bod komen... */
    #popular_news {
        display: none;
    }
    
    /* Ik weet dat er een nieuwsbrief is, hoef ik niet */
    #newsletter {
        display: none;
    }
}

/* Ik hoef geen promo te zien */

body #fpPromo {
    display: none;
}

/* Ik hoef ook geen video suggesties die kom ik wel tegen in de artikelen zelf.  */
body .fpItem#videos {
    display: none;
}

/* de category bar gebruik ik eigenlijk ook helemaal niet */
#categoryBar {
    display: none;
}

/* En waarom zou ik eigenlijk willen zien hoeveel twitter en facebook dingen er zijn? */
.socialcount {
    display: none;
}

[Voor 16% gewijzigd door Creesch op 07-05-2019 16:13]


Acties:
  • +1Henk 'm!

  • Felyrion
  • Registratie: november 2001
  • Laatst online: 17-04 18:25

Felyrion

goodgoan!

Mic2000 schreef op zondag 17 maart 2019 @ 19:23:
Druk bezig met een custom css te creëren, valt me nog tegen hoeveel qua css aangepast moet worden om de hele site goed te krijgen... Mijn css-skills zijn ook aardig roestig... lukt me al niet om de bovenste header "Vergelijk producten en prijzen" wat tevens een link is die visited is, toch de blauwe kleur te krijgen. Andere bezochte links doe ik wel grijs maken...

Ik heb nu
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
/* rode headers */
h1, h2, header .subheading {
    color: #0091ea;
}
h1 a, h2 a, header .subheading a:visited {
    color: #0091ea;
}
     h1, h2, h3{
       a{
         color:#0091ea !important;
         &:visited{ color:#0091ea !important;}
       }
     }


Als iemand een tip heeft :) Ook de paarse kleur bij bezochte linkjes wilt niet grijs worden... heb simpel:
code:
1
2
3
a:visited {
  color: #afafaf;
}


[Afbeelding: Tweakers theme css dark futuristic]

Edit: oke ik heb er al
code:
1
2
3
table a:visited {
  color: #afafaf;
}


Nu is gelijk de header opgelost... man man man, wat een tijd geleden die css stuff... Maar wel leuk als het allemaal lukt aan te passen :)

Edit 23-3-2019:
---------------------------------------------------------------

Ondertussen al weer wat meer feeling met CSS gekregen. Het begint aardig leuk te worden. Ik dacht ik houd jullie up to date met de vorderingen. Ik release de CSS wanneer ik het meeste van de site heb weten te veranderen naar de 'dark side'. :Y)

[Afbeelding]
Zou je hem anders niet vrij willen geven zoals je hem nu hebt? Dit is wel een stijl die me wel bevalt :9

sleep: a completely inadequate substitute for caffeine


Acties:
  • +2Henk 'm!

  • Mic2000
  • Registratie: december 2006
  • Laatst online: 21-03 12:44
Felyrion schreef op zaterdag 11 mei 2019 @ 21:45:
[...]


Zou je hem anders niet vrij willen geven zoals je hem nu hebt? Dit is wel een stijl die me wel bevalt :9
Bij deze, maar hij is nog verre van af ;)
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
/* achtergrond kleur */
body, #bottom div.hr, #entity, #heroBlock, #searchbar, .galleryHeadingContainer, .pageTabsContainer, .notificationsContainer {
    background-color: rgb(27,31,40);
}

/* outline content area */
#contentArea, #top, #mainSearch, #entity > div, #toc.fixed .reviewToc .tocContent, .entityHeader .thumb, .galleryHeading .thumb, .pageTabs li, .pageTabs .more > ul {
    border-color: #252d3c;
}

/* kleur contect area */
#contentArea {

    background: #2e3441;
 filter: drop-shadow(0px 36px 27px #030c14);
}

/* search bar top */
#searchbar {
background-color:transparant;
}

/* menu balk Tweakers */
#menubar {
    background-color: #202530;
    background-image: -webkit-linear-gradient(top, #202530, #202530 68px);
    background-image: -moz-linear-gradient(#202530, #202530 68px);
    background-image: linear-gradient(to bottom, #202530, #202530 68px);
    background-repeat: no-repeat;
    border-bottom: 1px solid #202530;
  /*  box-shadow: inset 0 -1px 0 #404758;*/
    height: 44px;
    left: 0;
    position: relative;

    filter: drop-shadow(0px 4px 4px #030a17);
    z-index: 110;
}

/* menubalk onder */
#menubottombar {
    background-color: #161b24;
    height: 34px;
    line-height: 1.4;
    overflow: hidden;
    position: relative;
    z-index: 16;

    filter: drop-shadow(0px 4px 4px #030a17);
}

/*bottom balk onderaan site*/
#bottom {
    background: #161b24;
}

/* rode headers */
h1, h2, header .subheading {
    color: #0091ea;
}
h1 a, h2 a, header .subheading a:visited {
    color: #0091ea;
}
    

/* zwarte headers */
#header h1 .subtitle {
    color: #afafaf;
    display: block;
    font-size: 16px;
}

/* headline dag */
#news .dailyHeadlines:not(:first-of-type) > h2 {
    color: #ff5630;
    font-size: 14px;
    font-family: "arial","helvetica","Liberation Sans",sans-serif;
}

/* logo hosted by  tru */
#search #true {
 filter: invert(100%)  hue-rotate(190deg) saturate(3);
}

/*tekst categorie balk*/
#categoryBar ul li a {
    color: #221b0d;
}

/* tekste 'alle categorieën' */
#categoryBar p.more a {
    color: #dde4f2;
}

/* hele categorie balk */
#categoryBar ul {
    display: flex;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0;

filter: invert(100%);
}

/*pijltje meer */
#categoryBar p.more {
    background: url("../../../g/hidpi/icons/chevron_blue.svg") no-repeat right center/8px 13px;
    margin: 0;
    padding-right: 12px;
    position: absolute;
    top: 3px;
    right: 0;

 filter:  brightness(2.00);

}

/* links */
a {
    color: #dde4f2;
}
.useVisitedState a:visited {
 color:#959dad
}


/*Table laatste nieuws */
table.highlights {
    border-top: 1px solid #3a455a;

    
}
table.highlights td {
    border-bottom: 1px solid #3a455a;
  
}
.mainColumn.frontpage {
    border-right: 1px solid #3a455a;
  
}
#recentlyTested ul {
    border-top: 1px solid #3a455a;
   
}
#recentlyTested li {
    border-bottom: 1px solid #3a455a;
  
}
#bestBuyGuides .description {
    border-bottom: 1px solid #3a455a;
    color: #666;
  
}
/* tijd */
table.highlights .title span, table.highlights .publicationTime {
    color: #485b7f;

}

/* icoontje voor artikel*/
table.highlights .type .contentIcon {
    filter: brightness(1.50);
}

/* stripballon comment */
td.replies .commentCount {
filter: invert(100%);
}


/* Score bord rood*/
#recentlyTested li .scorecard {
/*filter: hue-rotate(55deg) saturate(1.8) brightness(1.4);*/

}

/* ankeiler drop shadow */

.fpAnkeiler {
outline: 1px solid #3f485c;
 filter: drop-shadow(0px 8px 10px #141821);
}

/* INPUT FIELDS - zoek balk bovenaan */

/* zoek veld achtergrond en tekst*/
#search input.text {
    background-color: #1b1f28;
    font-size: 14px;
   color: #8e9fc4;
}

/* border om zoek veld */
input.text, select.text, textarea, .keywordSearch {
    border: 1px solid #d9d9d9;
    border-radius: 0px;
}

/* vakje met zoek loop icoon*/
.keywordSearch input.submit {
background: #1b1f28 url("../../../g/if/v3/framework/menu_icons_v2.png") no-repeat -48px -106px;
    background-position-x: -48px;
    background-position-y: -106px;
border: 0;
    border-left-color: currentcolor;
    border-left-style: none;
    border-left-width: 0px;
border-left: 1px solid #252d3c;
}

/* NIEUWS PAGINA ---------------------------------------------------------- */
.article {
color:#b9c3d7;
}

/* heel article blok */
.newsPortal .newsContentBlock {
    border-bottom: 1px solid #3a455a;
}

/*border van plaatje in artikel */
.article img.border {
    background: #1b1f28;

    border: 1px solid #2b3242;

    filter: drop-shadow(0px 8px 10px #141821);


}

/* REACTIES ------------------------ */

#reacties #reactieContainer {

    border-left: 2px dashed #3a455a;

}

.reactieBody {

    border: 1px solid #2b3242;
   background-color: #161b24;

color: #b9c3d7;

    filter: drop-shadow(0px 8px 10px #141821);

}

.reactieBody.informative {

    background: #1d3135;
    border-color: #294347;

}
.reactieBody.spotlight {

    background: #37595c;
    border-color: #3a6664;

}

/* naam user reactie */
.reactieHeader .userLink {

    color: #ff5630;
    font-weight: bold;

}

  • segil
  • Registratie: januari 2003
  • Laatst online: 17-04 14:46
Hoe verwijder ik de .Actie topics van de frontpage? Bijvoorbeeld deze:

.Actie - Vakantiegadget Weggeefweken dag 6 en 7

Ik heb in mijn custom CSS het volgende opgenomen:

.adv {display:none;}
.plan {display:none;}
.deals {display:none;}
.actie {display:none;}

Voor adv, plan en deals werkt dit wel, maar voor actie niet.

Kan iemand mij helpen?

  • Dannisi
  • Registratie: februari 2005
  • Laatst online: 05:49
.Actie is .promo
Dus
code:
1
.promo{display:none;}

There is no place like 127.0.0.1


  • segil
  • Registratie: januari 2003
  • Laatst online: 17-04 14:46
Dannisi schreef op zaterdag 8 juni 2019 @ 09:28:
.Actie is .promo
Dus
code:
1
.promo{display:none;}
Top, het werkt. Thanks!

Acties:
  • +1Henk 'm!

  • Nielless
  • Registratie: december 2016
  • Laatst online: 19:13

Nielless

Born at a very young age.

Ooit een stukje code gekopieerd van iemand en vanuit daar zelf verder gegaan. Op wat kleine schoonheidsfoutjes na best een prima layout. Try yourself.

PS. Let niet op de zooi. Niks geordend etc.

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014
1015
1016
1017
1018
1019
1020
1021
1022
1023
1024
1025
1026
1027
1028
1029
1030
1031
1032
1033
1034
1035
1036
1037
1038
1039
1040
1041
1042
1043
1044
1045
1046
1047
1048
1049
1050
1051
1052
1053
1054
1055
1056
1057
1058
1059
1060
1061
1062
1063
1064
1065
1066
1067
1068
1069
1070
1071
1072
1073
1074
1075
1076
1077
1078
1079
1080
1081
1082
1083
1084
1085
1086
1087
1088
1089
1090
1091
1092
1093
1094
1095
1096
1097
1098
1099
1100
1101
1102
1103
1104
1105
1106
1107
1108
1109
1110
1111
1112
1113
1114
1115
1116
1117
1118
1119
1120
1121
1122
1123
1124
1125
1126
1127
1128
1129
1130
1131
1132
1133
1134
1135
1136
1137
1138
1139
1140
1141
1142
1143
1144
1145
1146
1147
1148
1149
1150
1151
1152
1153
1154
1155
1156
1157
1158
1159
1160
1161
1162
1163
1164
1165
1166
1167
1168
1169
1170
1171
1172
1173
1174
1175
1176
1177
1178
1179
1180
1181
1182
1183
1184
1185
1186
1187
1188
1189
1190
1191
1192
1193
1194
1195
1196
1197
1198
1199
1200
1201
1202
1203
1204
1205
1206
1207
1208
1209
1210
1211
1212
1213
1214
1215
1216
1217
1218
1219
1220
1221
1222
1223
1224
1225
1226
1227
1228
1229
1230
1231
1232
1233
1234
1235
1236
1237
1238
1239
1240
1241
1242
1243
1244
1245
1246
1247
1248
1249
1250
1251
1252
1253
1254
1255
1256
1257
1258
1259
1260
1261
1262
1263
1264
1265
1266
1267
1268
1269
1270
1271
1272
1273
1274
1275
1276
1277
1278
1279
1280
1281
1282
1283
1284
1285
1286
1287
1288
1289
1290
1291
1292
1293
1294
1295
1296
1297
1298
1299
1300
1301
1302
1303
1304
1305
1306
1307
1308
1309
1310
1311
1312
1313
1314
1315
1316
1317
1318
1319
1320
1321
1322
1323
1324
1325
1326
1327
1328
1329
1330
1331
1332
1333
1334
1335
1336
1337
1338
1339
1340
1341
1342
1343
1344
1345
1346
1347
1348
1349
1350
1351
1352
1353
1354
1355
1356
1357
1358
1359
1360
1361
1362
1363
1364
1365
1366
1367
1368
1369
1370
1371
1372
1373
1374
1375
1376
1377
1378
1379
1380
1381
1382
1383
1384
1385
1386
1387
1388
1389
1390
1391
1392
1393
1394
1395
1396
1397
1398
1399
1400
1401
1402
1403
1404
1405
1406
1407
1408
1409
1410
1411
1412
1413
1414
1415
1416
1417
1418
1419
1420
1421
1422
1423
1424
1425
1426
1427
1428
1429
1430
1431
1432
1433
1434
1435
1436
1437
1438
1439
1440
1441
1442
1443
1444
1445
1446
1447
1448
1449
1450
1451
1452
1453
1454
1455
1456
1457
1458
1459
1460
1461
1462
1463
1464
1465
1466
1467
1468
1469
1470
1471
1472
1473
1474
1475
1476
1477
1478
1479
1480
1481
1482
1483
1484
1485
1486
1487
1488
1489
1490
1491
1492
1493
1494
1495
1496
1497
1498
1499
1500
1501
1502
1503
1504
1505
1506
1507
1508
1509
1510
1511
1512
1513
1514
1515
1516
1517
1518
1519
1520
1521
1522
1523
1524
1525
1526
1527
1528
1529
1530
1531
1532
1533
1534
1535
1536
1537
1538
1539
1540
1541
1542
1543
1544
1545
1546
1547
1548
1549
1550
1551
1552
1553
1554
1555
1556
1557
1558
1559
1560
1561
1562
1563
1564
1565
1566
1567
1568
1569
1570
1571
1572
1573
1574
1575
1576
1577
1578
1579
1580
1581
1582
1583
1584
1585
1586
1587
1588
1589
1590
1591
1592
1593
1594
1595
1596
1597
1598
1599
1600
1601
1602
1603
1604
1605
1606
1607
1608
1609
1610
1611
1612
1613
1614
1615
1616
1617
1618
1619
1620
1621
1622
1623
1624
1625
1626
1627
1628
1629
1630
1631
1632
1633
1634
1635
1636
1637
1638
1639
1640
1641
1642
1643
1644
1645
1646
1647
1648
1649
1650
1651
1652
1653
1654
1655
1656
1657
1658
1659
1660
1661
1662
1663
1664
1665
1666
1667
1668
1669
1670
1671
1672
1673
1674
1675
1676
1677
1678
1679
1680
1681
1682
1683
1684
1685
1686
1687
1688
1689
1690
1691
1692
1693
1694
1695
1696
1697
1698
1699
1700
1701
1702
1703
1704
1705
1706
1707
1708
1709
1710
1711
1712
1713
1714
1715
1716
1717
1718
1719
1720
1721
1722
1723
1724
1725
1726
1727
1728
1729
1730
1731
1732
1733
1734
1735
1736
1737
1738
1739
1740
1741
1742
1743
1744
1745
1746
1747
1748
1749
1750
1751
1752
1753
1754
1755
1756
1757
1758
1759
1760
1761
1762
1763
1764
1765
1766
1767
1768
1769
1770
1771
1772
1773
1774
1775
1776
1777
1778
1779
1780
1781
1782
1783
1784
1785
1786
1787
1788
1789
1790
1791
1792
1793
1794
1795
1796
1797
1798
1799
1800
1801
1802
1803
1804
1805
1806
1807
1808
1809
1810
1811
1812
1813
1814
1815
1816
1817
1818
1819
 .mainSearchSuggest .twk li p a {
    color: #fff !important;
}

.toggleable .toggleBtn {
    background-color: #294C7F !important;
}

#rightSidebar .icon.selected a::after, #rightSidebar .profileNavigationActive .username::after, #leftSidebar .toggleMenuButton.active::after {
    border-bottom: 9px solid #fff;
}

#rightSidebar h3 {
    background-color: #011532 !important;
}

#rightSidebarMenu>li.more {
    background-color: #011532 !important;
}

#rightSidebarMenu>li.more>span {
    color: #ffffff !important;
}

#rightSidebarMenu>li.icon {
    background-color: #011532 !important;
}

#rightSidebarMenu>li.icon.notifications a {
    background-position: 0px -44px;
}

#rightSidebarMenu>li.icon.messages a {
    background-position: 0 0;
}


table.forumlisting>tbody>tr:first-child>td {
    background: #011532 !important;
}

table.forumlisting>tbody>tr>td {
    background: #011532 !important;
}

#leftSidebar .toggleMenuButton {
    background: #011532 !important;
}

.site-sidebar ul li.more>span {
    background: #011532 !important;
}

#leftSidebar .toggleMenuButton.active {
    background: #011532 !important;
}

#leftSidebar .sidebarContent>.active {
    background: #00001a !important;
}

#rightSidebar .profileNavigationActive .username {
    background: #011532 !important;
}

ul.profileNavigation li a {
    background: #00001a !important;
}

body.rightSidebar #rightSidebar {
    background: #011532 !important;
}

.mainSearchSuggest .twk li p a {
    color: #000000;
}

a.laptops {
    background: #011532 !important;
}

a.smartphones {
    background: #011532 !important;
}

a.desktops {
    background: #011532 !important;
}

a.ssds {
    background: #011532 !important;
}

#bestBuyGuides .highlightedProduct {
    background: #011532!important;
}

#bestBuyGuides {
    background: #011532 !important;
}

.messagecontent .message-quote-div {
    background: #294C7F !important;
    color: #FFFFFF;
}

.bestTestedContainer .bestTestedProduct .info .intro {
    background-color: #294C7F !important;
    border-radius: 2px;
    font-size: 14px;
    line-height: 1.6em;
    margin-bottom: 20px;
    padding: 15px;
}

.popup .popupContent {
    padding: 15px 15px 5px 15px;
    background-color: #294C7F !important;
}

.aboShop .sideBar .subscriptionInfo {
    float: right;
    font-size: 14px;
    width: 315px;
    background-color: #294C7F !important;
}

.overviewFilter #filter {
    background: #294C7F !important;
    border: 1px solid #d9d9d9;
    border-radius: 1px;
}

.aboShop .sideBar .subscriptionInfo .perks {
    padding-bottom: 0;
    background-color: #00001a !important;
}
.mainColumn table.itemList {
    background: #294C7F !important;
}
.aboShop form .subscriptionType input[type=radio][value='1337']+label {
    background-image: url(../../../g/abo/tweakshield_elite.svg);
    background-color: #294C7F !important;
}

.aboShop form input[type=radio]+label {
    width: 254px;
    background-color: #294C7F !important;
}

.aboShop form .subscriptionType input[type=radio][value='16']+label {
    background-image: url(../../../g/abo/tweakshield_hero.svg);
    background-color: #294C7F !important;
}

.aboShop form .subscriptionType input[type=radio][value='15']+label {
    background-image: url(../../../g/abo/tweakshield_supporter.svg);
    background-color: #294C7F !important;
}

.aboShop form input[type=radio]:checked+label {
    background-position: 240px;
    background-color: #294C7F !important;
}


.aboShop form>.greyContainer {
    background-color: #294C7F;
    background-image: linear-gradient(#294C7F, #294C7F);
    border: 1px solid #d9d9d9;
    border-radius: 1px;
    box-shadow: 0 0 0 1px rgba(255,255,255,0.33) inset;
    margin-bottom: 25px;
    padding: 15px 15px 17px;
}

.reactieHeader .date, .reactieHeader .replyTo, .reactieHeader .replyToFlat {
    color: #fff !important;
    font-size: 11px;
    font-weight: normal;
}

.reactieBody {
    background: #294C7F !important;
}

.messageheader .date a {
    color: #008800 !important;
}

table.highlights .title span, table.highlights .publicationTime {
    color: white !important;

}

.article .infoBox .title {
    color: #fff !important;
}

.article h2 {
    color: #fff !important;
}

.article.fullWidth .breakOut.alignRight, .article.fullWidth .streamer {
    background-color: #294C7F;
}


.alternative_products.large .item .specline {
    color: white;
    
}

form table.tweakblog {
    background: #00001a !important;
}

h2.koophulp {
    color: #fff !important;
}

h2.chapter {
    color: #fff !important;
}

table.shop-listing.nonmatch .shop-name a, table.shop-listing.nonmatch .shop-price a, table.shop-listing .shop-bare-price a {
    color: white;
}

.bulletSeparatedList.sortLinks .current a {
    color: #294C7F !important;
    font-weight: bold;
}
.filterOption.collapsed h4 {
    color: #fff;
}
#campaignMenu .pageTabs>ul li.active a {
    border-color: #00001a
}

.filterGroup .filters {
    padding: 0 8px;
    background-color: #00001a;
}

.filterGroup .filters .filterOption {
    padding-left: 0;
    padding-right: 0;
    background-color: #294C7F !important;
}

#filterForm .filterOption:first-child {
    border-top: none;
    background-color: #294C7F !important;
}

table.pwListTable.profileLabels textarea.custom {
    height: 400px;
    max-width: 500px;
    width: 93%;
}


.article table {
    background: #294C7F !important;
}

.articleColumn.wide .headingContent .subheading {
    color: #294C7F;
}

.reviewToc .tocContent ul li.active a {
    color: #fff;
}

.authorBlock .info .name a {
    color: #294C7F;
}

.article .ScoreCard.Editorial .ScorecardView {

    background-color: #00001a !important;
}

.nextPrevLinks.large .label {
    color: #fff;
}

#toc.fixed.bottom {
    background-color: #00001a;
}

.article .ScoreCard.Editorial .productInfo .thumb {
    background-color: #00001a;
}

.article .ScoreCard.Editorial .productInfo {
    background-color: #00001a;
}

.tweakersElect {
    background: #294C7F !important; url(../../../g/gallery/tweakers_elect_bg.png) no-repeat right 18%;

}
form table td.label {
    color: #fff !important;
    vertical-align: top;
}

tr.activeSubscription td {
    background-color: #294C7F !important;
    color: white;
}

.jobListingContainer .jobItem .jobInfo .title h2 a.free {
    color: #fff !important;
}

.productSpecifications tbody tr:hover, .productSpecifications tbody tr.diff:hover {
    background-color: #00398e !important;
}

.specs td.spec-label, .specs td.spec {
    color: #fff !important;
    background-color: #011532 !important; 
}

@media (max-width: 1424px)
html.js body.hasTracker {
    min-width: 1000px;
    backgroud-color: #011532 !important; 
}

.filterGroup .filters {
    padding: 0 8px;
    background-color: #00001a;
}

table.listing td.topic a:hover {
    color: #00398e !important;
}

.jobListingContainer .jobItem.topJob {
    background-color: #eaf3f6;
    border: 1px solid #ccc;
    background-color: #00001a;
}
.fancySelect {

    background-color: #00398e;
}

Style Attribute {
    text-align: left;
    position: relative;
    width: 300px;
    height: 240px;
    background-color: #011532 !important;
}
#title p.mods a {
    color: #fff !important;
    text-decoration: none;
}

.videoGallery .videoPlayer {
    background-color: #011532;
}

.videoGallery {
    background-color:#011532;
    border-radius: 1px;
    height: 550px !important;
    margin-bottom: 20px;
}

.menuHeaderPopup .quickSetting label {
    color: #fff !important;
    line-height: 23px;
}

.toggleable .toggleBtn {
    color: #fff !important;
    display: inline-block;
}

.menuHeaderPopup .quickSetting {
    border-bottom: 1px solid #e6e6e6;
    padding: 12px;
    background-color: #011532;
}

div.message.ownpost, div.message.admin.ownpost {
    background-image: linear-gradient(#014a93 10px, #014a93 40px) !important;

}
div.message, div.faq, form.form1, form.form2, #folders, #myprofilecontainer, table.info {
    background: #00001a !important;
    color: #FFFFFF !important;
}

.textButton {
    background: none;
    border: none;
    color: #fff !important;
    cursor: pointer;
    margin: 0;
    padding: 40;
}
.galleryBody h2 {
    color: #fff !important;
}

/*####KARMA####*/

.galleryHeading .karmaCount+p {
    font-size: 13px;
    margin: 0;
    color: white !important;
}

.c3 svg {
    font-family: 'arial', 'helvetica', 'Liberation Sans', sans-serif;
    font-size: 10px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #014a93;
}

.galleryHeading .karmaCount {
    font-weight: bold;
    margin: 0 0 12px;
    color: white !important;
}

.galleryHeading .registered {
    color: #fff !important;
    
}



.pageTabs li a {
    color: #fff !important;
    background-color: #014a93 !important;
}

.galleryHeadingContainer, .pageTabsContainer {
    background-color: #011532 !important;
}

#top #entity, #top .pageTabsContainer {
    background: #011532 !important;
}

.scrollableList .no-items, .scrollableList .listItem {
    background-color: #011532 !important;
}

.menuHeaderPopup .footer {
    border-top: 1px solid #e6e6e6;
    padding: 10px;
    background-color: #011532;
}
.scrollableList .listItem:hover {
    background: #00398e !important;
}

.menuHeaderPopup .notification .postInfo .date {
    color: white !important;

}
.menuHeaderPopup .header {
    border-bottom: 1px solid #011532;
    background-color: #011532;
}

.menuHeaderPopup .scrollArea {
    max-height: 460px;
    background-color: #011532;
}

table.listing td.poster a {
    color: #fff !important;
}

table.listing td.title a:hover {
    color: #00398e !important;
}

table.listing td.tags a {
    color: #fff !important;
}

.rateButtons span {
    color: #fff !important;
    font-size: 14px;
}

#forum_tabs li a {
    color: #fff !important;
}

#forum_tabs li#tab_reset a {
    background-color: #014a93 !important; 
    padding: 5px;
}

#forum_tabs li.active a {
    color: #FFFFFF;
    background-color: #011532;
}

#forum_tabs li a {
    color: #fff;
    background-color: #014a93;
}

a:visited {
    color: #fff !important;
    font-weight: 600;
}

table.listing th {
    background: #014a93 !important;
}

table.listing td, table.listing td a {
    background: #011532 !important; 
    color: #EDEEEE;
}
.searchAanbod #nearbyAdForm {
    background: #011532;
    border: 1px solid #fff;
}

#categoryBrowser li.active.more {
    background: url(../../../g/if/categories/arrows.png) no-repeat 212px -18px,linear-gradient(#00398e, #00398e);
}

#categoryBrowser .images li:hover {
    box-shadow: inset 0 0 25px #011532, inset 0 0 0 1px rgba(0,0,0,0.1);
}

#categoryBrowser .images li a {
    color: #fff !important; 

}

form span.upperlabel, form span.lowerlabel {
    clear: both;
    color: #fff !important;
    display: block;
    font-size: 11px;
    padding-top: 3px;
}

#community .communityReviews .userReview .reviewContent .userReviewDescription {
    background-color: #f7f7f7;
    background-image: linear-gradient(#011532, #011532);
    border: 1px solid #d9d9d9;
}
.frontpage #community .userReview .userReviewDescription, .userReview {
    background: #011532 !important; 
    color: #EDEEEE;
}

#bestBuyGuides .description {
    border-bottom: 1px solid #e6e6e6;
    color: #fff !important;
}

div#menubar div#menu ul#userbar.loggedin li.more.last.dropdown, ul.profileNavigation li.indent a {
    background-color: #00001a !important;
    color: #e6e6e6;
}
#recentlyTested .price a, #recentlyTested .review a {
    color: #fff !important;
}

#menu .dropdown div ul li.indent:hover {
   background-color: #fff !important;
}

ul.profileNavigation, ul.profileNavigation li.indent, .dropdown ul {
    background-color: #00001a !important;
    color: #EDEEEE;
}

.dropdown ul li:hover, .dropdown ul li.active, #menu .dropdown ul li:hover {
    background-color: #00001a;
    background-image: linear-gradient(#00398e, #00398e);
}

ul.profileNavigation li.indent a:hover {
    background-color: #00398e !important;
}

#categoryBar ul li a {
    color: #fff;
    display: block;
    height: 42px;
    line-height: 17px;
    text-align: center;
}

a:visited {
    color: #fff !important;
}

#logo:hover, #menu>ul>li:hover {
    background: #00398e;
    border-bottom: 1px solid #0049b7;
    height: 43px;
}

a:hover, a.highlightlink {
    color: #0077ff;
    text-decoration: underline;
}

::-webkit-input-placeholder { /* Edge */
  color: #fff !important;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #fff !important;
}

::placeholder {
 color: #fff !important;
}

.keywordSearch input.submit {   
    background: #014a93 url(../../../g/if/v3/framework/menu_icons_v2.png) no-repeat 2px -106px !important; 
    border-left: 1px solid #d9d9d9;

}


h1, h2 {
color: #fff;
}

.bar.notice {
    background: #f0fdaf !important;
    border: 1px solid #d4ed5a; */
    color: #fff !important;
    font-size: 12px;
    padding-right: 10px;
}
.bar.ok {
    /* background: #cdeb56; */
    /* border: 1px solid #a2c417; */
    color: #000;
    font-size: 12px;
}

select, select.text, #footer div.buttonnav select, #quotemessages div.buttonnav select {
    background: #294C7F !important;
    color: #EDEEEE;
}

#categoryBrowser.sidebar li.active.more {
    background: url(../../../g/if/categories/arrows.png) no-repeat 572px -18px,linear-gradient(#00398e, #00398e) repeat !important;
}

#categoryBrowser div, #categoryBrowser .sublist {
    background: #294C7F !important;
}

#categoryBrowser {
    background: #182C4A !important;  
}

#categoryBrowser li:hover {
    background: #00001a;
}

.bar {
    background-color: #294C7F !important;
    color: #EDEEEE;
}

.fancyButton {
    background-color: #0a95cd;
    background-image: linear-gradient(#0a95cd, #0884b4);
    /* border: 1px solid #0884b4; */
    border-radius: 1px;
    color: #fff;
    cursor: pointer;
    font-size: 12px;
    height: 24px;
    padding: 0 10px;
    /* text-shadow: -1px -1px 0 #07729c; */
    white-space: nowrap;
}

/*########################
MENU BAR
########################*/

#search #true {
display: none !important;
}

#menubar {
    background-color: #00001a;
    background-image: -webkit-linear-gradient(top, #a41e39, #9a0e36 68px);
    background-image: -moz-linear-gradient(#a41e39, #9a0e36 68px);
    background-image: linear-gradient(to bottom, #00001a, #00001a);
    background-repeat: no-repeat;
    border-bottom: 1px solid #afafaf;
    box-shadow: inset 0 -1px 0 #afafaf;
    height: 44px;
    left: 0;
    position: relative;
    z-index: 110;
}

/*################################
ICOONTJES RECHTSBOVEN
################################*/

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

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

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

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

.icon.compare.empty{
width: 0px !important;
height: 0px !important;
visibility: hidden;
left: 100000000px;
}


/*******
 General
 ********/
/** Screw #layout and #contentArea height, give #html the same background colour */
html, body {
    background: #0E0E0E;
    color: #F0F0F0;
}

/***************
** New header **
***************/
.galleryInnerTable .title {
    color: #fff !important;
    white-space: nowrap;
}

/* Search field */
#searchbar {
    background: #00001a !important;
}
#search input.text {
    background: #fff;
}
#search .options, #search .options .dropdown ul {
    background: #323333;
}
#search .fancySelect span {
    color: #EDEEEE;
}

/* User menu */
ul.profileNavigation, ul.profileNavigation li.indent, .dropdown ul {
    background-color: #212323;
    color: #EDEEEE;
}
ul.profileNavigation li a {
    color: #EDEEEE;
}
ul.profileNavigation li.indent a:hover {
    background: #813;
}
.dropdown li a, #menu .dropdown ul a {
    color: #FFFFFF;
}

div#menubar div#menu ul#userbar.loggedin li.more.last.dropdown, ul.profileNavigation li.indent a {
    background-color: #212323;
    color: #e6e6e6;
}
div#menubar div#menu ul#userbar.loggedin li.more.last.dropdown span.username {
    color: #E6E6E6;
}
.dropdown li, .dropdown li>a {
    color: inherit !important;
}

/** Menu */
.unread .newNotificationsCount {
    color: #000000;
}
#menu li a {
    color: #C8CBCB;
}
#menu li.active a {
    color: #D9FF26;
}
#menu .dropdown > span, .dropdown li, .dropdown li a, #menu .dropdown ul a {
    color: #E5E5E5;
}

/** Notifications */
.notificationsPopup .header h3 {
    color: #000000;
}
div.popup {
    background: #323131;
}
.scrollableList .listItem, .scrollableList .listItem:hover {
    color: #EDEEEE;
}
.scrollableList .listItem:hover {
    background: #323434;
}
.menuHeaderPopup .notification.unread:hover {
    background: #454444;
}
.menuHeaderPopup .notification.unread {
    background: #414040;
}

/*******************
** End new header **
*******************/

/** Overall background */
#layout {
    background: #00001a;
    padding-top: 5px;
    height: 100%;
}

/** Give the actual content a different background colour */
#contentArea {
    background: #011532;
    padding: 5px 5px 10px 5px;
/*  padding-bottom: 25px;*/
    position: relative;
/*  margin: 0px 5px; */
}

/* For some reason, certain articles have a different #contentarea */
body.hero #contentArea {
    background: #011532;
}


/* Global .bar style */
.bar {
    background-color: #323333;
    color: #EDEEEE;
}

/* Gallery */
.galleryHeadingContainer>div {
    border-top: none;
}
.galleryHeadingContainer, .pageTabsContainer {
    background-color: #212323;
}
div.galleryBody h3.bar {
    background: #212323;
}
.galleryTable.karma td {
    background: #323434;
}
ul.galleryProfile li.checked {
    color: #EDEEEE;
}

/** Unsorted meuk */
h3, h3 a {
    color: #FFFFFF;
}

/** Bottom */
#bottom div.hr {
    background: #202020;
}

/** Text boxes (search, reply) */
textarea#messageBox, input {
    color: #FFFFFF;
    background: #294C7F !important;
}

/** Tracker */
#tracker .trackeritem li a { 
    color: #B7B4B2;
}
#tracker .trackeritem li .new, #tracker .trackeritem li a:hover, #tracker .trackeritem li a:hover .time { 
    color: #d9ff26;
}
#tracker .trackeritem h4, #tracker .trackeritem h4 a { 
    color: #D7D6D4;
}

/* Background color of tabs */
.pageTabs li {
    background: #212323;
}
.pageTabs li.active {
    background: #323434;
}

/* Hyperlinks */
a {
    color: #EDEEEE;
}
a:visited {
    color: #878888;
}

/* New DM/PM message */
form.insertMessage {
    background: inherit;
}
/* DM overview table */
table.listing.dm td {
    background: inherit;
}

/* Badges */
.labelCard, ul.topKarma.show {
    background: #000000;
}
.karmaPopup ol li.highlight {
    color: #FFFFFF;
}

/*******
   FP
 *******/
/** Main content */
/* Tabs */
#fp_tabs li a {
    color: #ABAAAA;
}
#fp_tabs li.active a {
    color: #FFFFFF;
}

/* Whitepapers */
.itknowledgebasewrapper {
    background: #212323;
}

/** Tile items */
.fpaItem>a {
    background: rgba(0,0,0,0.8);
}
.fpaTitle h2 {
    color: #b9133d;
}

/** Article Listing */
table.highlights td a {
    color: #EDEEEE;
}
table.highlights td a:visited {
    color: #888888;
}

table.highlights {
    border-top: 1px solid #000;
}
table.highlights td {
    border-bottom: 1px solid #000;
}
table.highlights .publicationTime span.new {
    color: #A9CC0B;
}
table.article {
    background: inherit;
}
/* More items popup */
.moreItems .popupContent {
    background: #2E2F2F;
}

/* Link to Replies on frontpage */
td.replies a.commentCount:visited {
    color: inherit;
}

/** Second Column - PW, Jobs, Newsletter, etc. */
#pricewatch, #jobs, #poll, .pollWrapper, #newsletter, #textlink, #social .twitterButton, #social .facebookButton {
    background: #011532;
}

#news .dailyHeadlines:not(:first-of-type)>h2 {
    color: #fff;
}

/* Poll option highlight */
.poll label:hover {
    background-color: #545656;
}

.secondColumn p, .secondColumn h3 {
    color: #EDEEEE;
}
#poll, .poll {
    color: #EDEEEE;
    background: none;
}
.poll.jsenabled label:hover {
    background: #18AE43;
}

/* Highlighted Products (Het bekijken waard) */
#highlightedProducts .description, #highlightedProducts .price {
    color: #EDEEEE;
}

/* Uitgelichte User reviews */
.frontpage #community .userReview .userReviewDescription, .userReview {
    background: #454646;
    color: #EDEEEE;
}

/** Articles */
.article, .content {
    color: #EDEEEE;
}
.article h2 {
    color: #B9133D;
}
.article h3 {
    color: #FFFFFF;
}
/* Tables in articles */
.article table {
    background: #232525;
}

/* Author information next to article */
.authorBlock div.info {
    background-color: inherit;
}
.relatedAuthor .authorInfo td {
    color: #868686;
}

/* Inhoudsopgave reviews */
.tocContent {
    background: #323434;
/*    width: 100%; */
}

/* Next/Prev article date colour */
table.nextPrevious tr td {
    color: #B7B4B2;
}

/* Modfilter text and width */
.modFilter {
    color: #B7B4B2;
}

/* Meuk sidebar */
.meukDetail .sidebar .section {
    background: #323434;
    color: #EDEEEE;
}
table.meuklist {
    color: #EDEEEE;
}

/* IT Jobs */
.relatedItProContent {
    background-color: inherit;
}

/** Comments */
.reactieBody {
    background: #212323;
}
.reactieHeader .userLink {
    color: #EDEEEE;
}
.reactie {
    color: #EDEEEE;
    border-left: 1px solid #545454;
}
/* +2 comments */
.reactieBody.informative {
    background: #323535;
    border: 1px solid #4D4F4F;
}
/* +3 comments */
.reactieBody.spotlight {
    background: #454747;
    border: 1px solid #6D6F6F;
}
/* Odd white line at last comment*/
.reactie.last > .reactieContainer {
    border-left: 1px solid #545454;
}
/* Blockquote colour a bit lighter */
.reactieContent blockquote {
    color: #A9A9A9;
}

/** Userreacties search */
.searchTable {
    background: #014a93 !important;
    width: 100%;
}
/** User tab V&A */
div.pwLinks ul li, div.pwLinks ul li a {
    color: #EDEEEE;
}
.pwLinks {
    background: #323434;
}
/* Wishlist */
.tabContent .article table {
    background: #2E2F2F;
}
div.inventory h3.title, div.inventory h3.titleShow {
    color: #0067A2;
}

/** Gallery fotoalbum */
form table td label {
    color: #FFFFFF;
}
#fotoalbum .sidebar {
    background: #212323;
}

/** Tweakblog admin table */
form table.tweakblog {
    background: #2E2F2F;
}

/** Karmastore */
.mainColumn table.itemList {
    background: #2E2F2F;
}

/* Abbo page info */
.aboShop .info {
    background: inherit;
}

/* Change text background below article
   in case we do want to have the buttons */
#toggleButtonTxt {
    background: #212323;
}

/** Pricewatch */
#header h1 .subtitle {
    color: #EDEEEE;
}

#categoryBrowser li a, #categorvyBrowser .images li a {
    color: #EDEEEE;
}

/* Product display list */
/* White top bar */
#top #entity, #top .pageTabsContainer {
    background: #323434;
}
#entity>div {
    border-top: none;
}

/* Add to wishlist or inventaris */
.popup_style .bar.header {
    color: #EDEEEE;
}
.popup_style .collectionAddForm .extraLabel .primaryLabel {
    color: gray;
}

/** Filters */
/* Box below filters */
.filterBlock {
    background: inherit;
}

#categoryBrowser div, #categoryBrowser .sublist {
    background: #323434;
    border: 1px solid #171818;
}
#categoryBrowser .large li {
    border-bottom: 1px solid #171818;
    border-right: 1px solid #171818;
}
#categoryBrowser {
    background: #282929;
    border: 1px solid #171818;
}

.popularProductListing table.listing tr td, .popularProductListing table.listing tr td a, .articleColumn table.listing tr td, .articleColumn table.listing a {
    background: #323434;
}
#tweakbase {
    margin-top: 51px;
}
.listOptions .pageIndex {
    color: #EDEEEE;
}
.productCompare table.listing tr td, .productCompare table.listing tr td a, .productCompare table.listing th, .itemFilter table.listing tr td, .itemFilter table.listing tr td a, table.spec-detail tr.diff td {
    background: #323434;
}
.productCompare table.listing tr th.compare {
    background-position: 14px 19px;
}
.productCompare table.listing tr td.compare {
    background-position: 14px -1px;
    border: none;
}
.productCompare table.listing .compare { 
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAABUAQMAAABnUf89AAAABlBMVEUAGAXDxsa+Z6rqAAAAAXRSTlMAQObYZgAAABZJREFUCFtjXMXAwMDA0DBAJFZBepEAjDwVLKcRyjUAAAAASUVORK5CYII=") no-repeat transparent;
}

table.listing th .listOptions .sortable.sortorder .dropdown li, table.listing th .listOptions .sortable.sortorder .dropdown li a {
    color: #000000;
}

.relatedBlock table.listing tr td, .relatedBlock table.listing a, .relatedBlock {
    background: #2D2E2E;
}
.relevancyColumn .relationboxBlock .thumb a, .relatedBox .thumb a {
    background: #484848;
    border: 1px solid #595959;
}
/* Sort dropdown */
div.sortable.sortorder ul li a {
    color: #000000;
}

/* Bestelkosten berekenen */
/* Right column colour */
#costTypeSelect, .costFilter {
    background: none;
}
/* Article table */
.priceTable tbody tr.even {
    background: #454548;
}
.priceTable tbody tr {
    background: #343437;
}
/* Shop table */
table.shoppingCart tr.even td {
    background: #454548;
    color: #EDEEEE;
}
table.shippingCart tr td {
    background: #343437;
    color: #EDEEEE;
}
table.shoppingCart .pricelisthead td, table.shoppingCart .pricelist td {
    color: #EDEEEE;
}

/* Specs */
td.spec-column, table.spec-detail td.spec-group-name {
    color: #EDEEEE;
}
table.spec-detail td.spec-index-column {
    color: #838686;
}
.specs .popularSpecs, .fixedLabels .specs .popularSpecs td.spec-label span {
    background: #343232;
}
.specs h3.bar {
    background: #232121;
}
.specs td.spec-label, .specs td.spec {
    color: #EDEEEE;
}
#productSpecifications tbody tr:hover td, .fixedLabels #productSpecifications tbody tr:hover td.spec-label span, #productSpecifications tbody tr.diff:hover td {
    background-color: #323282;
}

/* Shop Review */
#reacties.shopSurvey .reactie {
    border: 1px solid #DBDEDE;
}

/* User Review */
.ScoreCard, .ScoreCard .ScorecardView {
    background-color: #232121;
    color: #EDEEEE;
}
.ScoreCard .ScorecardView h3 {
    color: #EDEEEE;
}
.articleColumn.userreview .reactieHeader .username {
    color: #FFFFFF;
}


/* Review tab has some black text colour */
.articleColumn.userreview .userReviewPageInfo {
    color: #EDEEEE;
}

/* Product comparison */
#compareSpecsHeader.fixed .wrap {
    background-color: #313232;
}
/* Add product */
#compareSpecsHeader table td.add a {
    background: none;
}
#compareSpecs .addToCompareSearch .wrap {
    background: #313232;
}
div#productSpecifications.specs.toggle tr th .bar {
    background: #565656;
}

/* Specs same */
div#productSpecifications.specs.toggle tr td.spec, div#productSpecifications.specs.toggle tr td.spec-label {
    color: #EDEEEE;
}
/* Specs differ */
div.productSpecifications.specs.toggle tr.diff {
    background: #545454;
    color: #EDEEEE;
}
div#productSpecifications.specs.toggle table.popularSpecs tr td.spec, div#productSpecifications.specs.toggle table.popularSpecs tr td.spec-label {
    background: #545454;
}

/* Downloads */
.downloadDetails {
    background: inherit;
}

/*******
   GoT
 *******/
/* Breadcrumbs */
.breadcrumb a, .action_list a {
    color: #828585;
}
.bulletSeparatedList > li:first-child::before { 
    content: "";
}

/** Forum tabs */
#forum_tabs li a {
    color: #ABAAAA;
}
#forum_tabs li.active a {
    color: #FFFFFF;
}

/* Bookmarks */
.faux p {
    color: #FFFFFF;
}

/** Search results */
table.forumlisting .preview .content {
    background: #212323;
}
table.forumlisting>tbody>tr>td {
    background: #323434;
}
/* Search filter */
#filter, .filterOption.active {
    background: #212323;
}
.filterBlock h4, .filterOption h4 {
    color: #EDEEEE;
}
.filterOption li, .filterOption label {
    color: #919494;
}
.filterOption label.selected {
    color: #000000;
}

/* Topic listing heading colour */
table.listing th a {
    color: #FEFEFE;
}
/* Border around image */
.channelHeader .thumb {
    border: none;
}

/** Listing borders */
table.listing td {
    border-top: 0px solid #000000;
    border-bottom: 1px solid #000000;
}
table.listing td.last {
    border-right: 1px solid #000000;
}
table.listing td.ind, table.listing td.ind2 {
    border-left: 1px solid #000000;
}

/** Forum Description */
#title p.forumdesc {
    color: #EDEEEE;
}
/** GoT Topic listings  */
table.listing td, table.listing td a {
    background: #121212;
    color: #EDEEEE;
}
table.listing td.topic a, table.listing td.title a { 
    color: #EDEEEE;
}
/* Listing height */
table.listing td, table.listing th {
    padding: 4px 5px;
}
table.listing th {
    background: #3E3E3E;
}

/* Mijn Topics bar .find_topics.poster*/
div.info {
    background: #232121;
    color: #edeeee;
}

/** Forum replies */
/* Viewcounter colour */
.action_list li.viewcount {
    color: gray;
}

/* Message content */
div.message, div.faq, form.form1, form.form2, #folders, #myprofilecontainer, table.info {
    background: #212323;
    color: #EDEEEE;
}

.messageheader .date a {
    color: #828585;
}

/* Hyperlinks in messages Tweakers green */
div.messagecontent a, .messagecontent .message-quote-div a {
    color: #D9FF26;
}
/* Members Only */
.membersonly {
    background: #00A000;
}
div.membersonly a {
    color: #000000;
}
/* Hyperlinks in RML list */
table.rml a {
    color: #DDDD00;
}
/* RML list background */
table.rml td {
    background: #505050;
}
table.rml th {
    background: #606060;
}

/* Make your own post more visible, now with gradient! */
div.message.ownpost, div.message.admin.ownpost {
    background-image: linear-gradient(#404040 10px, #212323 40px);
}
/* Give the header of the TS a different colour */
div.message.topicstarter {
    background-image: linear-gradient(#323434 10px, #212323 40px);
}
/* And the date a different colour */
div.topicstarter div.messageheader div.date a {
    color: #008800;
}

/* Add same bullet point before rating to increase spacing between 'Quote' and rating */
.action_list li.rating .ratingcount::before {
    content: '\2022';
    margin: 0 6px;
}
/* Make the counter readable */
.action_list li.rating .ratingcount {
    color: #828585;
}
/* Question topic tip bar */
.bar.tip {
    background: #545454;
}

/* Best answer */
div.message.bestAnswer {
    background: #232929;
}

/* New Messages notification bar */
#newMessageNotification {
    background: #000000;
}
#newMessageNotification:hover {
    background: #232121;
}

/* Some padding for the post */
div.message div.post {
    padding: 5px 2px 4px 10px;
}
/* Post version on diff */
div.message div.poster {
    color: #EDEEEE;
}

/** Quote boxes */
div.messagecontent blockquote div {
    color: #FFFFFF;
}
.messagecontent .message-quote-div {
    background: #060606;
    color: #FFFFFF;
}
/* Quote user link */
div.messagecontent div.message-quote-div a.messagelink, div.messagecontent div.message-quote-div a.messagelink:hover {
    color: #FFFFFF;
}

/** Code boxes */
table.phphighlight td.phphighlightline, table.phphighlight td.phphighlightcode {
    border: 1px solid #FFFFFF;
}
table.phphighlight td, table.phphighlight td pre, table.phphighlight td code {
    color: #000000;
    background: #DDDDDD;
}

/* Pre-box */
div.pre pre {
    background: #323434;
}

/* /me tag */
.me, div.messagecontent span.me a {
    color: #00AA00;
}

/* Modbreak text */
.mbr {
    color: #AD0009;
}

/** Spoilers */
/* Don't show URLs in spoilers until hovered or clicked */
.spoiler, .messagecontent div.spoiler a, .messagecontent .message-quote-div div.spoiler a {
    color: #000000;
}

.spoiler:hover, .messagecontent div.spoiler a:hover, .spoiler img:hover, .messagecontent div.spoiler a:hover, .messagecontent .message-quote-div div.spoiler a:hover, .spoiler>*:hover {
    color: white;
    visibility: visible;
}

/* lazy image loading */
img.lazyimg {
    background: #0a0a0a;
}
/* image broken */
img.error {
    background: #3f1111;
}

/** User info **/
/* Ugly klipklap arrow */
.userklipklap {
    background: none;
    border: none;
}
.userklipklap > div {
    background: #202121;
}
.userklipklap .online {
    color: #63C000;
}

/* Username */
.user {
    color: #FFFFFF;
}

/* Crew username*/
.crew, .crew:visited {
    color: #B9133C;
}

/* Pimp user, aka luser :+ */
.pimp, a.pimp:hover, .pimp:visited {
    color: #DE47DC;
}

/* Pagenumbers */
.pagecounter {
    margin: 5px 0px 0px;
}

/** Quick Reply */
#reageer.bar {
    background: #303030;
    border: 0px solid #D2D4D4;
    border-top: 1px solid #D2D4D4;
    border-left: 1px solid #D2D4D4;
    border-right: 1px solid #D2D4D4;
}
/* Topicwarning */
fieldset.modbreak {
    background: #800000;
}
fieldset.modbreak legend {
    color: #FFE900;
}
fieldset.modbreak a {
    color: #09FF26 
}
.bar.warning {
    background-color: #880000;
    color: #FFFFFF;
}

/* Report post */
form#message_form.insertMessage {
    background: #232121;
}
div.wrap div#content h3.bar {
    background: #232121;
}
textarea#messageBox.report {
    background: #322121;
}

/* Toon Voorbeeld - make it true visible button */
form input.forumlink { 
    cursor: pointer;
    background: #0A93CA;
    border: 1px solid #0987B8;
    border-radius: 1px;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.102);
    color: #FFFFFF;
    font-size: 12px;
    height: 26px;
    padding: 0px 10px;
    text-shadow: -1px -1px 0px rgba(0, 0, 0, 0.149);
}
/* Reply dropdown for page selection */
#footer div.buttonnav select, #quotemessages div.buttonnav select {
    color: #EDEEEE;
}
/* Button toolbar */
#toolbar img {
    background: #FFFFFF;
}

/* Make sure Reageer has correct text colour */
.fancyButton {
    color: #FFFFFF;
}

/* New topic and topic page navigation buttons */
.fancyButton.grey {
    background: linear-gradient(to bottom, #0A93CA, #0A8ABD) #0A93CA;
    color: #EDEEEE;
    border: 1px solid #0987B8;
}

.fancyButton:hover { 
    background: linear-gradient(to bottom, #0CA3D4, #0B98C5) #0CA3D4;
    color: #EDEEEE;
    border-bottom-color: #0B94BF;
    border-left-color: #0B94BF;
    border-right-color: #0B94BF;
    border-top-color: #0B94BF;
}

.fancyButton:focus { 
    box-shadow: 0px 0px 4px rgba(9, 135, 184, 0.749);
}
a.fancyButton.grey.next {
    color: #FFFFFF;
}

/* Topic nav */
.pageDistribution .previous, .pageDistribution .next, .pageDistribution .last { 
    background: no-repeat linear-gradient(to bottom, #0A93CA, #0A8ABD) #0A93CA;
    border: 1px solid #0A88BA ;
    height: 15px;
    line-height: 15px;
    color: #FFFFFF;
}
.pageDistribution .previous { 
    background-image: url("https://tweakimg.net/g/prev_arrow.png");
    background-position: 5px 3px;
}

/* Relationeditor (Onderwerpen koppelen) */
.relationManager dd ul.bulletSeparatedList, ul.bulletSeparatedList {
    color: #EDEEEE;
}
#relationeditor table tr td {
    background: #2F3131;
}
#relationeditor h3 {
    color: #327398;
}
form.insertMessage.relationManager {
    background: #232121;
}

.relationeditor input[type=text] {
    color: #EDEEEE;
    background: #323131;
}

.relationeditor .resultItem, .relationeditor .resultFooter, .relationeditor .resultItemSimple {
    color: #EDEEEE;
    background: #424141;
}
.relationeditor .resultItem .title, .relationeditor .resultItemSimple .title, .relationeditor .resultItem .type, .relationeditor .resultItemSimple .type {
    color: #EDEEEE;
}

/* Dropdowns */
select, select.text, #footer div.buttonnav select, #quotemessages div.buttonnav select {
    background: #000000;
    color: #EDEEEE;
}
/* "Zut" */
h3.inverted {
    color: #FFFFFF;
}

#about {
    background-color: #00001a !important;
}
#bottom div.hr {
    background: #000d21 !important;
}

#about .social .button {
    background-color: #294C7F !important;
}

#about .social .count {
    background-color: #294C7F;
    border: 1px solid #fff;
}

form a {
    color: #045bdb;
}

.commentCount {
    background: url(../../../g/icons/commentcounter_small.svg) no-repeat;
    background-size: cover;
    color: #fff !important;

}

#community .communityItem .user a, #community .communityItem .category a {
    color: #fff !important;
}
#jobs li p.info a, #training li p.info a {
    color: white;
}

.sliderTick {
    color: #fff !important;

}
#bottom {
    background: #00001a;
}

div.info {
    background: #011532 !important; 
    color: #edeeee;
}

Website: NdeM.nl // XBL: Nielless // STEAM: Nielles™


Acties:
  • +3Henk 'm!

  • Hero of Time
  • Registratie: oktober 2004
  • Laatst online: 16-04 17:12

Hero of Time

Moderator NOS

There is only one Legend

@Nielless, heh, vanaf het punt dat er comments staan (regel 762) met uitleg herken ik mijn code. :P Graag gedaan. :)

Commandline FTW | Tweakt met mate


Acties:
  • 0Henk 'm!

  • Nielless
  • Registratie: december 2016
  • Laatst online: 19:13

Nielless

Born at a very young age.

Hero of Time schreef op zondag 9 juni 2019 @ 00:13:
@Nielless, heh, vanaf het punt dat er comments staan (regel 762) met uitleg herken ik mijn code. :P Graag gedaan. :)
Hahaha nogmaals dank hiervoor! _/-\o_

Website: NdeM.nl // XBL: Nielless // STEAM: Nielles™


Acties:
  • +1Henk 'm!

  • iApp
  • Registratie: februari 2011
  • Niet online

iApp

Say cheese

Ik weet nu waarom een donker thema vanuit Tweakers.net langer op zich laat wachten: zie al die productfoto's, foeilelijk! Witte achtergrond. Ieuw. :o

An  a day keeps the doctor away.


  • MarnickS
  • Registratie: februari 2016
  • Laatst online: 21:20
iApp schreef op vrijdag 14 juni 2019 @ 08:00:
[...]

Ik weet nu waarom een donker thema vanuit Tweakers.net langer op zich laat wachten: zie al die productfoto's, foeilelijk! Witte achtergrond. Ieuw. :o
Klopt, ik kan er zelf ook heel slecht tegen.
Maar liever wat witte vlakken in m'n scherm dan alles wit.

Dell XPS 15 9560 · Xiaomi Mi Mix 2S (Evolution X ROM) · NVIDIA SHIELD TV


Acties:
  • +1Henk 'm!

  • Caseum
  • Registratie: januari 2016
  • Laatst online: 15-04 13:36

Caseum

Thinking about IT

DaMoUsYs schreef op vrijdag 15 december 2017 @ 10:39:
@Hero of Time en @matroosoft beide bedankt voor de CSS
Ik ben ook begonnen aan een donker thema

[Afbeelding]

en hier "mijn" css, zoals je ziet in de screenshot nog wel een aantal schoonheidsfoutjes
Zoals de zoekbalk en de menubalk bijvoorbeeld


[...]
Ik heb een paar aanpassingen aan gedaan en wilde die graag delen met jullie.

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014
1015
1016
1017
1018
1019
1020
1021
1022
1023
1024
1025
1026
1027
1028
1029
1030
1031
1032
1033
1034
1035
1036
1037
1038
1039
1040
1041
1042
1043
1044
1045
1046
1047
1048
1049
1050
1051
1052
1053
1054
1055
1056
1057
1058
1059
1060
1061
1062
1063
1064
1065
1066
1067
1068
1069
1070
1071
1072
1073
1074
1075
1076
1077
1078
1079
1080
1081
1082
1083
1084
1085
1086
1087
1088
1089
1090
1091
1092
1093
1094
1095
1096
1097
1098
1099
1100
1101
1102
1103
1104
1105
1106
1107
1108
1109
1110
1111
1112
1113
1114
1115
1116
1117
1118
1119
1120
1121
1122
1123
1124
1125
1126
1127
1128
1129
1130
1131
1132
1133
1134
1135
1136
1137
1138
1139
1140
1141
1142
1143
1144
1145
1146
1147
1148
1149
1150
1151
1152
1153
1154
1155
1156
1157
1158
1159
1160
1161
1162
1163
1164
1165
1166
1167
1168
1169
1170
1171
1172
1173
1174
1175
1176
1177
1178
1179
1180
1181
1182
1183
1184
1185
1186
1187
1188
1189
1190
1191
1192
1193
1194
1195
1196
1197
1198
1199
1200
1201
1202
1203
1204
1205
1206
1207
1208
1209
1210
1211
1212
1213
1214
1215
1216
1217
1218
1219
1220
1221
1222
1223
1224
1225
1226
1227
1228
1229
1230
1231
1232
1233
1234
1235
1236
1237
1238
1239
1240
1241
1242
1243
1244
1245
1246
1247
1248
1249
1250
1251
1252
1253
1254
1255
1256
1257
1258
1259
1260
1261
1262
1263
1264
1265
1266
1267
1268
1269
1270
1271
1272
1273
1274
1275
1276
1277
1278
1279
1280
1281
1282
1283
1284
1285
1286
1287
1288
1289
1290
1291
1292
1293
1294
1295
1296
1297
1298
1299
1300
1301
1302
1303
1304
1305
1306
1307
1308
1309
1310
1311
1312
1313
1314
1315
1316
1317
1318
1319
1320
1321
1322
1323
1324
1325
1326
1327
/**************
   A few width items
   using @media query
**************/
/* Set the width of various elements placed in #contentArea */
/* #menu, #contentArea, .content .tab, .content .tab_active {  */
        /* width: 1475px !important; */
/* } */

/* Bottom */
/* #ticker, #about { */
        /* width: 1450px !important; */
/* } */

/* @media only screen and (min-width: 1200px) { */
    /* #contentArea { */
        /* width: 70% !important; */
    /* } */
    /* #menu {  */
        /* width: 70% !important; */
    /* } */
/* } */

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

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


/*******
 General
 ********/
/** Screw #layout and #contentArea height, give #html the same background colour */
html, body {
    background: #0E0E0E !important;
    color: #5050F0 !important;
}

/***************
** New header **
***************/
#top {
    border: none !important;
}

/* Remove the useless minibar with #slogan and #socialcount 
#menubottombar {
    display: none;
}*/

/* Default gray bar holding the search form and true logo
    Do not use display: none, search will disappear */
#searchbar {
    height: 0px !important;
    z-index: 111 !important;
}
/* Search form 
#search {
    position: fixed !important;
    top: -5px;
    left: 85%;
    width: 150px;
}
#search .keywordSearch {
    width: 300px;
    border: 1px solid #323333;
}
#search input.text {
    background: #232222 !important;
}
#search .options, #search .options .dropdown ul {
    background: #323333 !important;
}
#search .fancySelect span {
    color: #EDEEEE !important;
}
*/

body, #searchbar, #bottom div.hr{
background-color:#0E0E0E !important;
}

#search input.text, .keywordSearch input.submit, .keywordSearch, textarea, .labelCard, .thumb{
background-color:#8F8F8F !important;
}

.keywordSearch input.submit{
background:#8F8F8F url(../../g/if/v3/framework/menu_icons_v2.png) no-repeat 2px -106px !important;
}


/* User menu */
ul#userbar.loggedin li.more.last span.username {
    background-size: contain !important;
    padding-left: 45px !important;
    background-position: left !important;
}

#search #true, #search #streamone {
    display: none;
}

ul.profileNavigation {
    background-color: #212323;
    color: #EDEEEE;
}

div#menubar div#menu ul#userbar.loggedin li.more.last.dropdown, ul.profileNavigation li.indent a {
    background-color: #212323;
    color: #EDEEEE;
}
#menubar {
    background: #0E0E0E;
    color: #e6e6e6;
    background-image: -webkit-linear-gradient(#0E0E0E,#0E0E0E 68px);
    background-image: -moz-linear-gradient(#0E0E0E,#0E0E0E 68px);
    background-image: linear-gradient(#0E0E0E,#0E0E0E 68px);
    -webkit-box-shadow: 0 1px 6px rgba(0,0,0,.35);
    box-shadow: 0 1px 6px rgba(0,0,0,.35);
    border-bottom: 3px solid #3D4E56;
}


#logo:hover {
    background-image: -webkit-linear-gradient(#0E0E0E,#0E0E0E 68px);
    background-image: -moz-linear-gradient(#0E0E0E,#0E0E0E 68px);
    background-image: linear-gradient(#0E0E0E,#0E0E0E 68px);
}


#userbar li.icon:hover {
    background-image: -webkit-linear-gradient(#0E0E0E,#0E0E0E 68px);
    background-image: -moz-linear-gradient(#0E0E0E,#0E0E0E 68px);
    background-image: linear-gradient(#0E0E0E,#0E0E0E 68px);
}

#userbar li.icon.selected:hover {
    background: #f7f9f9;
}

/*******************
** End new header **
*******************/

/** Overall background */
#layout {
    background: #0E0E0E !important;
    padding-top: 5px !important;
    height: 100% !important;
}

/** Give the actual content a different background colour */
#contentArea {
    background: #323434 !important;
    padding: 5px 5px 10px 5px !important;
/*  padding-bottom: 25px !important;*/
    position: relative !important;
/*  margin: 0px 5px !important; */
}

/* Global .bar style */
.bar {
    background-color: #0E0E0E;
    color: #EDEEEE;
}

/* Gallery */
.galleryHeadingContainer>div {
    border-top: none !important;
}
.galleryHeadingContainer, .pageTabsContainer {
    background-color: #212323 !important;
}
div.galleryBody h3.bar {
    background: #212323 !important;
}
.galleryTable.karma td {
    background: #323434 !important;
}
ul.galleryProfile li.checked {
    color: #EDEEEE !important;
}

/** Unsorted meuk */
h3, h3 a {
    color: #FFFFFF !important;
}

/* No background for user icons */
.thumb {
    background: none !important;
}

/** Bottom */
#bottom div.hr {
    background: #202020 !important;
}

/** Text boxes (search, reply) */
textarea#messageBox, input {
    color: #FFFFFF;
    background: #1E1E1E;
}

/** Menu */
.unread .newNotificationsCount {
    color: #fff !important;
    background: #1E1E1E;
}
#menu li a {
    color: #fff !important;
    background: #1E1E1E;
}
#menu li.active a {
    color: #D9FF26 !important;
}
#menu .dropdown > span, .dropdown li, .dropdown li a, #menu .dropdown ul a {
    color: #fff !important;
    background: #1E1E1E;
}
#menu li.hoover a {
    background: #fff !important;
}
/*
*/

/** Notifications */
.notificationsPopup .header h3 {
    color: #000000 !important;
}
div.popup {
    background: #323131 !important;
}
.scrollableList .listItem:hover {
    background: #323434 !important;
}
.menuHeaderPopup .notification.unread:hover {
    background: #454444 !important;
}
.menuHeaderPopup .notification.unread {
    background: #414040 !important;
}
#webPushContainer {
    display: none;
}

/** Tracker */
#tracker .trackeritem li a { 
    color: #B7B4B2 !important;
}
#tracker .trackeritem li .new, #tracker .trackeritem li a:hover, #tracker .trackeritem li a:hover .time { 
    color: #d9ff26 !important;
}
#tracker .trackeritem h4, #tracker .trackeritem h4 a { 
    color: #D7D6D4 !important;
}
#tracker {
    padding-top: 0px !important;
    top: 45px !important;
}
.fakeTop {
    display: none;
}

/* Background color of tabs */
.pageTabs li {
    background: #212323 !important;
}
.pageTabs li.active {
    background: #323434 !important;
}

/* Hyperlinks */
a {
    color: #EDEEEE !important;
}
a:visited {
    color: #878888 !important;
}

/* Badges */
.labelCard, ul.topKarma.show {
    background: #000000 !important;
}

/* Fix anchor location due to fixed header */
/* More likely in GoT */
a[name] {
    display: block;
    padding-top: 45px;
    margin-top: -45px;
}

/*******
   FP
 *******/
/** Main content */
.fpHighlightedProduct {
    background-color: #333;
    background-image: linear-gradient(rgba(51, 51, 51, 1), #333 15px, #333 156px, rgba(51, 51, 51, 1) 240px),linear-gradient(90deg, rgba(51, 51, 51, 1), #333 20%, #333 80%, rgba(51, 51, 51, 1) 100%);
    border-radius: 3px;
    padding: 15px;
    position: relative;
}

/* Tabs */
#fp_tabs li a {
    color: #ABAAAA !important;
}
#fp_tabs li.active a {
    color: #FFFFFF !important;
}

/* Whitepapers */
.itknowledgebasewrapper {
    background: #212323 !important;
}

/** Tile items */
.fpaItem>a {
    background: rgba(0,0,0,0.8);
}
.fpaTitle h2 {
    color: #b9133d !important;
}

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

table.highlights {
    border-top: 1px solid #000 !important;
}
table.highlights td {
    border-bottom: 1px solid #000 !important;
}
table.highlights .publicationTime span.new {
    color: #A9CC0B !important;
}
/* More items popup */
.moreItems .popupContent {
    background: #2E2F2F !important;
}

/** Second Column - PW, Jobs, Newsletter, etc. */
#pricewatch, #jobs, #poll, .pollWrapper, #newsletter, #textlink, #social .twitterButton, #social .facebookButton {
    background: #212323 !important;
}

/* Poll option highlight */
.poll label:hover {
    background-color: #545656;
}

.secondColumn p, .secondColumn h3 {
    color: #EDEEEE !important;
}
#poll, .poll {
    color: #EDEEEE;
    background: none !important;
}
.poll.jsenabled label:hover {
    background: #18AE43 !important;
}

/* remove Newsletter subscription box */
#newsletter {
    display: none;
}

/* Highlighted Products (Het bekijken waard) */
#highlightedProducts .description, #highlightedProducts .price {
    color: #EDEEEE !important;
}

/* User reviews */
.frontpage #community .userReview .userReviewDescription, .userReview {
    background: #454646 !important;
    color: #EDEEEE;
}

/** Articles */
.article, .content {
    color: #EDEEEE !important;
}
.article h2 {
    color: #B9133D;
}
.article h3 {
    color: #FFFFFF !important;
}
/* Tables in articles */
.article table {
    background: #232525 !important;
}

/* Author information next to article */
.relatedAuthor p {
    color: #868686 !important;
}
.relatedAuthor .authorInfo td {
    color: #868686 !important;
}

/* Social buttons and Related Articles */
#socialButtonsContainer {
    display: none;
}
div.relatedContent {
    display: none;
}

/* Next/Prev article date colour */
table.nextPrevious tr td {
    color: #B7B4B2 !important;
}

/* Modfilter text and width */
.modFilter {
    color: #B7B4B2 !important;
}

/* Meuk sidebar */
.meukDetail .sidebar .section {
    background: #323434 !important;
    color: #EDEEEE !important;
}
table.meuklist {
    color: #EDEEEE;
}

/** Comments */

/* Modfilter 'ongemodereerd' to question mark */
.modFilter .scoreButton.scorenone, .modFilter .scoreButton.wide {
    word-spacing: -999px;
    letter-spacing: -999px;
    display: none;
}
.modFilter .scoreButton.scorenone:after, .modFilter .scoreButton.wide:after {
    content: '?';
    word-spacing: normal;
    letter-spacing: normal;
    background: linear-gradient(to bottom, #C8CBCB, #BEC1C1) #C8CBCB;
    padding: 3px 3px;
}

/* Collapse buttons */
#collapseButtons {
    display: none;
}

/* Bar top of comment */
.reactie .topBorder {
    height: 0 !important;
}
.reactieBody {
    background: #212323;
}
.reactie {
    color: #EDEEEE;
    border-left: 1px solid #545454;
}
/* +2 comments */
.reactieBody.informative {
    background: #323535 !important;
    border: 1px solid #4D4F4F !important;
}
/* +3 comments */
.reactieBody.spotlight {
    background: #454747 !important;
    border: 1px solid #6D6F6F !important;
}
/* Odd white line at last comment*/
.reactie.last > .reactieContainer {
    border-left: 1px solid #545454 !important;
}
/* Blockquote colour a bit lighter */
.reactieContent blockquote {
    color: #A9A9A9 !important;
}

/** Userreacties search */
.searchTable {
    background: #323434 !important;
    width: 100% !important;
}
/** User tab V&A */
div.pwLinks ul li, div.pwLinks ul li a {
    color: #EDEEEE !important;
}
.pwLinks {
    background: #323434 !important;
}
/* Wishlist */
.tabContent .article table {
    background: #2E2F2F !important;
}
div.inventory h3.title, div.inventory h3.titleShow {
    color: #0067A2 !important;
}


/** Gallery fotoalbum */
form table td {
    color: #FFFFFF !important;
}
#fotoalbum .sidebar {
    background: #212323;
}

/** Tweakblog admin table */
form table.tweakblog {
    background: #2E2F2F !important;
}

/** Karmastore */
.mainColumn table.itemList {
    background: #2E2F2F !important;
}


/* No social */
#social, .social, #modernSocialButtonsContainer {
    display: none !important;
}
/* Change text background below article
   in case we do want to have the buttons */
#toggleButtonTxt {
    background: #212323 !important;
}
/* Do not show the buttons at all below the article */
#socialButtons {
    display: none !important;
}
/* Kill LOI block */
div#loi {
    display: none;
}

/** Pricewatch */
#header h1 .subtitle {
    color: #EDEEEE !important;
}

/* Product display list */
/* White top bar */
#top #entity, #top .pageTabsContainer {
    background: #323434 !important;
}
#entity>div {
    border-top: none !important;
}

#categoryBrowser div, #categoryBrowser .sublist {
    background: #323434 !important;
    border: 1px solid #171818 !important;
}
#categoryBrowser .large li {
    border-bottom: 1px solid #171818 !important;
    border-right: 1px solid #171818 !important;
}
#categoryBrowser {
    background: #282929 !important;
    border: 1px solid #171818 !important;
}

.popularProductListing table.listing tr td, .popularProductListing table.listing tr td a, .articleColumn table.listing tr td, .articleColumn table.listing a {
    background: #323434 !important;
}
#tweakbase {
    margin-top: 51px;
}
.listOptions .pageIndex {
    color: #EDEEEE;
}
.productCompare table.listing tr td, .productCompare table.listing tr td a, .productCompare table.listing th, .itemFilter table.listing tr td, .itemFilter table.listing tr td a, table.spec-detail tr.diff td {
    background: #323434 !important;
}
.productCompare table.listing tr th.compare {
    background-position: 14px 19px !important;
}
.productCompare table.listing tr td.compare {
    background-position: 14px -1px !important;
    border: none !important;
}
.productCompare table.listing .compare { 
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAABUAQMAAABnUf89AAAABlBMVEUAGAXDxsa+Z6rqAAAAAXRSTlMAQObYZgAAABZJREFUCFtjXMXAwMDA0DBAJFZBepEAjDwVLKcRyjUAAAAASUVORK5CYII=") no-repeat transparent !important;
}

table.listing th .listOptions .sortable.sortorder .dropdown li, table.listing th .listOptions .sortable.sortorder .dropdown li a {
    color: #000000 !important;
}

.relatedBlock table.listing tr td, .relatedBlock table.listing a, .relatedBlock {
    background: #2D2E2E !important;
}
.relevancyColumn .relationboxBlock .thumb a, .relatedBox .thumb a {
    background: #484848 !important;
    border: 1px solid #595959 !important;
}
/* Sort dropdown */
div.sortable.sortorder ul li a {
    color: #000000 !important;
}

/* Bestelkosten berekenen */
/* Right column colour */
#costTypeSelect, .costFilter {
    background: none !important;
}
/* Article table */
.priceTable tbody tr.even {
    background: #454548 !important;
}
.priceTable tbody tr {
    background: #343437 !important;
}
/* Shop table */
table.shoppingCart tr.even td {
    background: #454548 !important;
    color: #EDEEEE !important;
}
table.shippingCart tr td {
    background: #343437 !important;
    color: #EDEEEE !important;
}
table.shoppingCart .pricelisthead td, table.shoppingCart .pricelist td {
    color: #EDEEEE !important;
}

/* Specs */
td.spec-column, table.spec-detail td.spec-group-name {
    color: #EDEEEE !important;
}
table.spec-detail td.spec-index-column {
    color: #838686 !important;
}
.specs .popularSpecs, .fixedLabels .specs .popularSpecs td.spec-label span {
    background: #343232 !important;
}
.specs h3.bar {
    background: #232121 !important;
}
.specs td.spec-label, .specs td.spec {
    color: #EDEEEE !important;
}
#productSpecifications tbody tr:hover td, .fixedLabels #productSpecifications tbody tr:hover td.spec-label span, #productSpecifications tbody tr.diff:hover td {
    background-color: #323282 !important;
}

/* Shop Review */
.secondColumn {
    float: right !important;
}
.rightInfoBlock {
    background: none !important;
}
#reacties.shopSurvey .reactie {
    border: 1px solid #DBDEDE;
}

/* User Review */
.ScorecardView {
    background-color: #232121 !important;
    color: #EDEEEE;
}
/* Review tab has some black text colour */
.articleColumn.userreview .userReviewPageInfo {
    color: #EDEEEE;
}

/* Product comparison */
#compareSpecsHeader.fixed .wrap {
    background-color: #313232 !important;
}

div#productSpecifications.specs.toggle tr th .bar {
    background: #565656 !important;
}

/* Specs same */
div#productSpecifications.specs.toggle tr td.spec, div#productSpecifications.specs.toggle tr td.spec-label {
    color: #EDEEEE !important;
}
/* Specs differ */
div.productSpecifications.specs.toggle tr.diff {
    background: #545454 !important;
    color: #EDEEEE !important;
}
div#productSpecifications.specs.toggle table.popularSpecs tr td.spec, div#productSpecifications.specs.toggle table.popularSpecs tr td.spec-label {
    background: #545454 !important;
}


/*******
   GoT
 *******/
/* Breadcrumbs */
.breadcrumb a, .action_list a { 
    color: #E1E3D7 !important; 
}
.bulletSeparatedList > li:first-child::before {  
    content: "" !important; 
}

/* Kutslogan weg. */
span.slogan { display: none }

/** Forum tabs */
#forum_tabs li a {
    color: #ABAAAA !important;
}
#forum_tabs li.active a {
    color: #FFFFFF !important;
}

/* Bookmarks */
.faux p {
    color: #FFFFFF !important;
}

/** Search results */
table.forumlisting .preview .content {
    background: #212323 !important;
}
table.forumlisting>tbody>tr>td {
    background: #323434 !important;
}
/* Search filter */
#filter, .filterOption.active {
    background: #212323 !important;
}
.filterBlock h4, .filterOption h4 {
    color: #EDEEEE !important;
}
.filterOption li, .filterOption label {
    color: #919494 !important;
}
.filterOption label.selected {
    color: #000000 !important;
}

/** Colourize headers */
.channelHeader h2 {
    color: #FFFFFF !important;
}
.thumb.category {
    background: 50% 5px no-repeat !important;
}
.forumList:nth-child(2) table.listing th  {
    background: #0044EE !important;
}
/* Computers */
.forumList:nth-child(3) .channelHeader, .thumb.category.core {
    background-color: #A30028 !important;
}
.thumb.category.core { 
    background-image: url("https://tweakimg.net/g/if/categories/computers_x2.png") !important;
}
/* IT Pro */
.forumList:nth-child(4) .channelHeader, .thumb.category.pro {
    background-color: #400072 !important;
}
.thumb.category.pro { 
    background-image: url("https://tweakimg.net/g/if/categories/itpro_x2.png") !important;
}
/* Games */
.forumList:nth-child(5) .channelHeader, .thumb.category.games {
    background-color: #0E8F1D !important;
}
.thumb.category.games { 
    background-image: url("https://tweakimg.net/g/if/categories/games_x2.png") !important;
}
/* Beeld en Geluid */
.forumList:nth-child(6) .channelHeader, .thumb.category.electronics {
    background-color: #BD3500 !important;
}
.thumb.category.electronics { 
    background-image: url("https://tweakimg.net/g/if/categories/electronics_x2.png") !important;
}
/* Tablets en Telefoons */
.forumList:nth-child(7) .channelHeader, .thumb.category.mobile {
    background-color: #04926C !important;
}
.thumb.category.mobile { 
    background-image: url("https://tweakimg.net/g/if/categories/mobile_x2.png") !important;
}
/* General Chat */
.forumList:nth-child(8) .channelHeader, .thumb.category.chat {
    background-color: #8A33CC !important;
}
.thumb.category.chat { 
    background-image: url("https://tweakimg.net/g/if/categories/chat_x2.png") !important;
}
/* Tweakers Feedback */
.forumList:nth-child(9) .channelHeader, .thumb.category.feedback {
    background-color: #A57D00 !important;
}
.thumb.category.feedback { 
    background-image: url("https://tweakimg.net/g/if/categories/heart_x2.png") !important;
}
/* A51 */
.forumList:nth-child(10) .channelHeader, .thumb.category.area51 {
    background-color: #99FF00 !important;
}
.thumb.category.area51 { 
    background-image: url("https://tweakimg.net/g/if/categories/alien_x2.png") !important;
}

/* Topic listing heading colour */
table.listing th a {
    color: #FEFEFE !important;
}
/* Border around image */
.channelHeader .thumb {
    border: none !important;
}

/** Listing borders */
table.listing td {
    border-top: 0px solid #000000 !important;
    border-bottom: 1px solid #000000 !important;
}
table.listing td.last {
    border-right: 1px solid #000000 !important;
}
table.listing td.ind, table.listing td.ind2 {
    border-left: 1px solid #000000 !important;
}
/* Decrease space between forum sections */
.forumList table.listing {
    margin-bottom: 5px !important;
}

/** Forum Description */
#title p.forumdesc {
    color: #EDEEEE !important;
}
/** GoT Topic listings  */
table.listing td, table.listing td a {
    background: #121212 !important;
    color: #EDEEEE !important;
}
table.listing td.topic a, table.listing td.title a { 
    color: #EDEEEE !important;
}
/* Listing height */
table.listing td, table.listing th {
    padding: 4px 5px !important;
}
table.listing th {
    background: #3E3E3E !important;
}
table.listing td.topic a[title="Laatste reactie geplaatst door Hero of Time"] {
    font-style: italic;
}

/* Mijn Topics bar .find_topics.poster*/
div.info {
    background: #232121;
    color: #edeeee;
}

/** Forum replies */
/* Forum heading on top for working links */
#forumheading { 
    position: relative;
    z-index: 1;
}
/* Viewcounter colour */
.action_list li.viewcount {
    color: gray;
}

#content #sidebar #tweakbase_relations {
    margin: 0px 5px;
}

/* Message content */
div.message, div.faq, form.form1, form.form2, #folders, #myprofilecontainer, table.info {
    background: #212323 !important;
    color: #EDEEEE !important;
}
#messages, .topic_actions {
    padding-left: 5px !important;
}
div.message div.post div.messagecontent {
    margin-right: 5px !important;
}
/* Hyperlinks in messages Tweakers green */
div.messagecontent a {
    color: #D9FF26 !important;
}
/* Members Only */
.membersonly {
    background: #00A000 !important;
}
div.membersonly a {
    color: #000000 !important;
}
/* Hyperlinks in RML list */
table.rml a {
    color: #DDDD00 !important;
}
/* RML list background */
table.rml td {
    background: #505050 !important;
}
table.rml th {
    background: #606060 !important;
}
/* Remove space between messages */
div.message, div.faq {
    margin-bottom: 0px !important;
}

/* Make your own post more visible, now with gradient! */
div.message.ownpost {
    background-image: linear-gradient(#404040 10px, #212323 40px) !important;
}
/* Give the header of the TS a different colour */
div.message.topicstarter {
    background-image: linear-gradient(#323434 10px, #212323 40px) !important;
}
/* And the date a different colour */
div.topicstarter div.messageheader div.date a {
    color: #008800 !important;
}

/* Add same bullet point before rating to increase spacing between 'Quote' and rating */
.action_list li.rating .ratingcount::before {
    content: '\2022' !important;
    margin: 0 6px !important;
    color: #828585 !important;
}

/* Change big thumb icon to smaller one that looks better */
.action_list li.rating .ratingcount {
    font-size: inherit;
}
.action_list li.rating .thumbsup.rated, .action_list li.rating.can_be_rated .thumbsup {
    background: inherit;
    background-image: inherit;
    border: none;
}
.action_list li.rating .thumbsup {
    width: 14px;
    height: 14px;
    vertical-align: initial;
    top: 0;
    position: inherit;
    top: inherit;
    background: none;
    background-image: none;
    border: none;
    border-radius: initial;
}
.action_list li.rating .thumbsup:before {
    background: url(https://static.tweakers.net/ext/f/N3fRBdthYAVi027KASIL2LG8/full.png) no-repeat -30px -269px;
}
.action_list li.rating .thumbsup.rated:before {
    background-position: -45px -269px;
}
.action_list li.rating.can_be_rated .thumbsup:not(.rated):hover {
    background: none;
    background-image: none;
    border: none;
}
.action_list li.rating .ratingcount {
    min-width: initial;
    color: #828585;
}

/* Some padding for the post */
div.message div.post {
    padding: 5px 2px 4px 10px !important;
}
/* Post version on diff */
div.message div.poster {
    color: #EDEEEE !important;
}

/** Quote boxes */
div.messagecontent blockquote {
    color: #FFFFFF !important;
}
div.message-quote-div {
    background: #616464 !important;
    color: #FFFFFF !important;
}
/* Disable quote folding */
.messagecontent .message-quote-div.large-quote {
    height: auto !important;
    overflow: visible;
    padding-bottom: 10px !important;
}
.messagecontent .toggle-quote {
    display: none;
}
/* Quote user link */
div.messagecontent div.message-quote-div a.messagelink, div.messagecontent div.message-quote-div a.messagelink:hover {
    color: #FFFFFF !important;
}

/** Code boxes */
    table.phphighlight td.phphighlightline, table.phphighlight td.phphighlightcode {
    border: 1px solid #FFFFFF !important; 
}
table.phphighlight td, table.phphighlight td pre, table.phphighlight td code {
     color: #000000 !important; 
    background: #DDDDDD !important; 
}

/* Pre-box */
div.pre pre {
    background: #323434 !important;
}

/* [ME=Caseum]tag */[/ME]
.me, div.messagecontent span.me a {
    color: #00AA00 !important;
}

/* Modbreak text */
.mbr {
    color: #AD0009 !important;
}

/** Spoilers */
/* Don't show URLs in spoilers until hovered or clicked */
.spoiler, .messagecontent div.spoiler a, .messagecontent .message-quote-div div.spoiler a {
    color: #000000;
}

.spoiler:hover, div.spoiler a:hover, .spoiler img:hover, .messagecontent div.spoiler a:hover, .messagecontent .message-quote-div div.spoiler a:hover, .spoiler>*:hover {
    color: white !important;
    visibility: visible !important;
}

/* lazy image loading */
img.lazyimg {
    background: #0a0a0a !important;
}
/* image broken */
img.error {
    background: #3f1111;
}

/** User info **/
/* Ugly klipklap arrow */
.userklipklap {
    background: none !important;
    border: none !important;
}
.userklipklap > div {
    background: #202121 !important;
}
.userklipklap .online {
    color: #63C000 !important;
}
/* Show user reg date and postcount */ 
div.message div.post div.userdetails div.userdata div.extra { 
    display: block !important;
}

/* Username */
.user {
    color: #FFFFFF !important;
}

/* Crew username*/
.crew, .crew:visited {
    color: #B9133C !important;
}

/* Pimp user, aka luser :+ */
.pimp, a.pimp:hover, .pimp:visited {
    color: #DE47DC !important;
}

/* Pagenumbers */
.pagecounter {
    margin: 5px 0px 0px !important;
}

/** Quick Reply */
#reageer.bar {
    background: #303030 !important;
    border: 0px solid #D2D4D4 !important;
    border-top: 1px solid #D2D4D4 !important;
    border-left: 1px solid #D2D4D4 !important;
    border-right: 1px solid #D2D4D4 !important;
}
/* Topicwarning */
fieldset.modbreak {
    background: #800000 !important;
}
fieldset.modbreak legend {
    color: #FFE900 !important;
}
fieldset.modbreak a {
    color: #09FF26 !important
}
.bar.warning {
    background-color: #224726 !important;
    color: #FFFFFF !important;
}

/* Report post */
form#message_form.insertMessage {
    background: #232121 !important;
}
div.wrap div#content h3.bar {
    background: #232121 !important;
}
textarea#messageBox.report {
    background: #322121 !important;
}

/* Toon Voorbeeld - make it true visible button */
form input.forumlink { 
    cursor: pointer;
    background: #0A93CA !important;
    border: 1px solid #0987B8;
    border-radius: 1px;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.102);
    color: #FFFFFF !important;
    font-size: 12px;
    height: 26px;
    padding: 0px 10px;
    text-shadow: -1px -1px 0px rgba(0, 0, 0, 0.149);
}
/* Reply dropdown for page selection */
#footer div.buttonnav select, #quotemessages div.buttonnav select {
    color: #EDEEEE !important;
}
/* Button toolbar */
#toolbar img {
    background: #FFFFFF;
}
/* test*/

.fancyButton {
    border: 0px solid #0987b8;
    border-radius: 2px;
    background: #3E3E3E;
    background-image: -webkit-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: -moz-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: linear-gradient(#3E3E3E,#3E3E3E);
}

.fancyButton:hover {
    color: #fff;
    border-color: 0px solid #F16400;
    background: #3E3E3E;
    background-image: -webkit-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: -moz-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: linear-gradient(#3E3E3E,#3E3E3E);
}

.fancyButton.grey {
    background: #3E3E3E;
    background-image: -webkit-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: -moz-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: linear-gradient(#3E3E3E,#3E3E3E);
}

.fancyButton.grey:hover {
    background: #3E3E3E;
    background-image: -webkit-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: -moz-linear-gradient(#3E3E3E,#3E3E3E);
    background-image: linear-gradient(#3E3E3E,#3E3E3E);
    color: #333;
}

a.fancyButton.grey.next {
    color: #FFFFFF !important;
}
.fancyButton:focus { 
    box-shadow: 0px 0px 4px rgba(9, 135, 184, 0.749) !important;
}

/* Make sure Reageer has correct text colour */
.fancyButton {
    color: #FFFFFF !important;
    background: linear-gradient(to bottom, #3E3E3E, #3E3E3E) #3E3E3E !important;
    border: 1px solid #3E3E3E !important;
}

/* New topic and topic page navigation buttons */
.fancyButton.grey {
    background: linear-gradient(to bottom, #3E3E3E, #3E3E3E) #3E3E3E !important;
    border: 1px solid #3E3E3E !important;
}

.fancyButton:hover { 
    background: linear-gradient(to bottom, #3E3E3E, #3E3E3E) #3E3E3E !important;
    border-bottom-color: #3E3E3E !important;
    border-left-color: #3E3E3E !important;
    border-right-color: #3E3E3E !important;
    border-top-color: #3E3E3E !important;
}


/* Topic nav */
.pageDistribution .previous, .pageDistribution .next, .pageDistribution .last , .pageDistribution b{ 
    background: no-repeat linear-gradient(to bottom, #3E3E3E, #3E3E3E) #3E3E3E !important;
    border: 1px solid #3E3E3E  !important;
    height: 15px !important;
    line-height: 15px !important;
    color: #FFFFFF !important;
}
.pageDistribution .previous { 
    background: no-repeat linear-gradient(to bottom, #3E3E3E, #3E3E3E) #3E3E3E !important;
    border: 1px solid #3E3E3E  !important;
    height: 15px !important;
    line-height: 15px !important;
    color: #FFFFFF !important;
}

/* Relationeditor (Onderwerpen koppelen) */
.relationManager dd ul.bulletSeparatedList, ul.bulletSeparatedList {
    color: #EDEEEE !important;
}
#relationeditor table tr td {
    background: #2F3131 !important;
}
#relationeditor h3 {
    color: #327398 !important;
}
form.insertMessage.relationManager {
    background: #232121 !important;
}

.relationeditor input[type=text] {
    color: #EDEEEE !important;
    background: #323131 !important;
}

.relationeditor .resultItem, .relationeditor .resultFooter, .relationeditor .resultItemSimple {
    color: #EDEEEE !important;
    background: #424141 !important;
}
.relationeditor .resultItem .title, .relationeditor .resultItemSimple .title, .relationeditor .resultItem .type, .relationeditor .resultItemSimple .type {
    color: #EDEEEE !important;
}

/** Mod tools */
/* Show diffs */
div.diff address {
    color: #000000;
}
div.diff pre {
    background-color: #555555;
}
div.diff pre del, div.diff pre ins {
    color: #000000;
}


/* Dropdowns */
select {
    background: #000000 !important;
    color: #EDEEEE !important;
}
/* "Zut" */
h3.inverted {
    color: #FFFFFF !important;
}
.aboShop .info {
    background: #000000;
}

.wrap {
  background-color: #313232;
}
.darkBlock {
    background: #313232;
    font-size: 13px;
    padding: 15px;
}

.fancyButton.secondary {
    background: rgba(0,0,0,0);
    border: 1px solid #9a0e36;
    border-radius: 3px;
    color: #9a0e36 !important;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    padding: 0 12px;
    text-shadow: none;
}

.fancyButton.secondary:hover {
    background: rgba(0,0,0,0);
    border: 1px solid #fff;
    border-radius: 3px;
    color: #fff !important;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    padding: 0 12px;
    text-shadow: none;
}

#bestBuyGuides .allBestBuys li {
    background: rgba(194, 190, 190, 0.288);
    border-radius: 3px;
    margin-bottom: 6px;
}

Kaas is baas


  • ThinkPad
  • Registratie: juni 2005
  • Laatst online: 22:03

ThinkPad

Moderator Duurzame Energie & Domotica
Hoe maak ik de link 'Hosting door True' onderaan elke pagina onklikbaar?

De Brave browser op m'n telefoon klikt daar per ongeluk op als ik op het Tweakers knopje 'ga naar einde pagina' klik. Als ik op telefoon dus naar onderkant van de pagina wil springen dan opent 8/10 keer www.true.nl :F

[Voor 20% gewijzigd door ThinkPad op 24-06-2019 15:18]

Gas besparen door CV-tuning | Elektriciteit besparen
Geen vragen via privébericht die ook via het forum kunnen a.u.b.


Acties:
  • +1Henk 'm!

  • Hahn
  • Registratie: augustus 2001
  • Laatst online: 22:42
ThinkPad schreef op maandag 24 juni 2019 @ 15:17:
Hoe maak ik de link 'Hosting door True' onderaan elke pagina onklikbaar?

De Brave browser op m'n telefoon klikt daar per ongeluk op als ik op het Tweakers knopje 'ga naar einde pagina' klik. Als ik op telefoon dus naar onderkant van de pagina wil springen dan opent 8/10 keer www.true.nl :F
Snelste oplossing die ik kan bedenken is om display: none; op .colofon te zetten. Dan is heel dat blok verborgen en kan je er ook niet op klikken :P

Of je doet display: none; alleen op .colofon a:last-child, dan is het woordje 'True' verborgen (maar dan staat er nog 'Hosting door', zonder iets erachter).

[Voor 12% gewijzigd door Hahn op 24-06-2019 15:39]

The devil is in the details.

Pagina: 1 ... 18 19 20 Laatste


Apple iPhone 12 Microsoft Xbox Series X LG CX Google Pixel 5 Sony XH90 / XH92 Samsung Galaxy S21 5G Sony PlayStation 5 Nintendo Switch Lite

Tweakers vormt samen met Hardware Info, AutoTrack, Gaspedaal.nl, Nationale Vacaturebank, Intermediair en Independer DPG Online Services B.V.
Alle rechten voorbehouden © 1998 - 2021 Hosting door True