source: extensions/floOS/OS_glass_dark/theme.css @ 15941

Last change on this file since 15941 was 15941, checked in by flop25, 12 years ago

tiptip popup displayed only if a title exists
css for menu
dimensions of thumbnails set to !important

File size: 9.9 KB
Line 
1/* ---------------------------------------------------------------------------
2Thème OS_glass_dark
3
4theme-enfant de OS_default
5
6by flop25 http://www.planete-flop.fr/
7------------------------------------------------------------------------------ */
8
9/* text color */
10BODY, H1, H2, H3, DT,
11INPUT.rateButtonSelected  {
12  color:#fff;
13}
14
15/* backgrounds */
16.throw {
17  background-color: #ffffff;    /* white */
18}
19body {
20        background-image: url(images/back1.jpg);
21        background-repeat: no-repeat;
22        background-position: bottom center;
23        background-attachment:fixed;
24        font-size:0.7em;
25        font-family: Verdana,Arial,Helvetica,sans-serif;
26        background-color: #000;
27}
28BODY#theCommentsPage .content,
29BODY#theUploadPage .content,
30BODY#theRegisterPage .content,
31BODY#theIdentificationPage .content,
32BODY#theProfilePage .content,
33BODY#theSearchPage .content,
34BODY#theAboutPage .content,
35BODY#thePopuphelpPage .content,
36BODY#thePasswordPage .content,
37BODY#theNotificationPage .content,
38BODY#theTagsPage .content,
39BODY#theNBMPage .content
40{
41background: transparent url(images/section_in.png) repeat top center;
42}
43H2, .row1 {
44  background-color: #d3d3d3;
45}
46
47.header_notes {
48  background-color: #eeeeee;
49}
50#the_page > #comments {
51background: transparent url(images/section_in.png) repeat top center;
52}
53#comments H3, .titrePage h2, #section_in h2 {
54        background-image: url(images/fondMenu2.gif);
55        background-repeat:repeat-x;
56        background-color:#000;
57        color: #fff;
58}
59
60.content DIV.thumbnailCategory {
61        background-image: url(../OS_default/icon/menu/folder.png);background-position: left bottom;
62        background-repeat:no-repeat;
63}
64.content ul.thumbnails span.wrap2 {
65background-image: url(images/vignette.png);
66background-color:transparent;
67background-repeat:no-repeat;
68background-position:top left;
69width:144px;
70height:144px;
71}
72.content ul.thumbnails span.wrap1 {
73        width:144px;
74        margin: 5px;
75}
76.thumbnails span, .thumbnails .wrap2 a, .thumbnails label {
77    width: 145px !important;;
78}
79.illustration IMG {
80        max-height:128px;
81}
82.wrap2 IMG {
83        max-height:128px;
84        max-width:128px;
85}
86
87/* header */
88#theHeader {
89        background-image: url(images/header3.jpg);
90        background-position:center top;
91        background-repeat:no-repeat;
92        background-color: #000000;
93        color:#FFFFFF;
94        font-size:1.2em;
95        font-weight:bold;
96        height:105px;
97}
98#theHeader H1 {
99        color:#FFFFFF;
100        font-weight:bold;
101}
102
103/* contenu "section" */
104#section_up_left{
105        background-image: url(images/section_up_left.png);
106        background-position:right bottom;
107        background-repeat:no-repeat;
108        height:50px;
109        width:18px;
110}
111#section_up {
112 background-image: url(images/section_up.png);
113 background-position:bottom;
114 background-repeat:repeat-x;
115 height:50px;
116}
117#section_up_right{
118 background-image: url(images/section_up_right.png);
119 background-position:left bottom;
120 background-repeat:no-repeat;
121 height:50px;
122 width:20px;
123}
124#section_left{
125 background-image: url(images/section_left.png);
126 background-position:right;
127 background-repeat:repeat-y;
128 width:18px;
129}
130#section_bottom_left{
131 background-image: url(images/section_bottom_left.png);
132 background-position:top right;
133 background-repeat:no-repeat;
134 height:20px;
135 width:18px;
136}
137#section_bottom {
138 background-image: url(images/section_bottom.png);
139 background-position:top;
140 background-repeat:repeat-x;
141 height:20px;
142}
143#section_bottom_right{
144 background-image: url(images/section_bottom_right.png);
145 background-position:left top;
146 background-repeat:no-repeat;
147 height:20px;
148 width:20px;
149}
150#section_right{
151 background-image: url(images/section_right.png);
152 background-repeat:repeat-y;
153 background-position:left;
154 width:18px;
155}
156
157
158/* menu Haut*/
159#div_Menu {
160        background-image: url(images/fondMenu2.gif);
161        background-repeat:repeat-x;
162}
163
164ul#Menu, ul#Menu li
165{
166        background:transparent;
167}
168ul#Menu li:hover
169{
170color: #fff;
171background-image: url(images/fondMenuSurvol.gif);
172background-repeat:repeat-x;
173background-position:center;
174background-color:transparent;
175        text-decoration: none;
176    border-bottom: none;
177}
178/* menubar */
179#menubar DL, #section_in{
180background: transparent url(images/section_in.png) repeat top center;
181}
182#menubar DT{
183        background-image: url(images/fondMenu2.gif);
184        background-repeat:repeat-x;
185        background-color:#002024;
186        }
187
188/* borders */
189#menubar DL {
190  border: 2px solid #002024;
191}
192
193#theImage IMG {
194  border-color: #fff;
195}
196#linkNext, #linkPrev {
197  border: 2px solid #fff;
198}
199
200.content UL.thumbnail IMG {
201    border: 1px solid #a0a0a0;
202}
203
204FIELDSET, INPUT, SELECT, TEXTAREA,
205.content DIV.comment  A.illustration IMG {
206  border: 1px solid #fff;
207}
208
209#comments DIV.comment BLOCKQUOTE {
210  border-left: 2px solid #696969;
211}
212
213/*
214.content UL.thumbnails SPAN.wrap2:hover,*/
215.content UL.thumbnailCategories DIV.thumbnailCategory:hover,
216.content UL.thumbnailCategories DIV.thumbnailCategory:hover A {
217  border-color: #002024;
218  color: #42B4FF;
219}
220.illustration IMG {
221        border: 2px solid #FFFFFF;
222}
223/* links */
224A, INPUT.rateButton {
225    color: #fff;
226    background: transparent;
227}
228
229A:hover, INPUT.rateButton:hover {
230        color: #42B4FF;
231        border-bottom: none;
232        font-weight:bold;
233}
234
235#imageToolBar A, #imageToolBar A:hover {
236    border-bottom: none;
237}
238
239A.navThumb, A.navThumb:hover {
240    border-bottom: none;
241}
242#div_Menu A {
243        color:#FFFFFF;
244        text-decoration: none;
245}
246#div_Menu A:hover {
247        text-decoration: none;
248    border-bottom: none;
249}
250.header_notes A {
251    color: #333;
252}
253/* Picture */
254#imageHeaderBar {
255        background-image: url(images/fondblack2.png);
256        background-repeat:repeat-x;
257        background-position: center top;
258        background-color: #000000;
259}
260#imageHeaderBar h2 {
261background:transparent;
262color:#FFFFFF
263}
264#imageHeaderBar, #imageHeaderBar A {
265color:#FFFFFF;
266}
267#imageToolBar .randomButtons, #imageToolBar .navButtons {
268background:transparent;
269}
270#imageToolBar .navButtons {
271background:transparent;
272
273}
274#imageToolBar {
275        background-image: url(images/fondblack_bas.png);
276        background-repeat:repeat-x;
277        background-position: center bottom;
278        background-color: #000000;
279}
280#imageToolBar A:hover {
281background-image: url(images/fondMenuSurvol.gif);
282background-repeat:repeat-x;
283background-position:center;
284background-color:transparent;
285}
286#action_pict {
287        border: 2px solid #FFFFFF;
288    background: transparent url(images/back_actionpict.png) bottom center no-repeat;
289    color:#fff;
290    font-weight:bold;
291}
292#imageToolBar {
293    height: 60px;
294}
295#imageToolBar #thumbPrev, #imageToolBar #thumbNext {
296        margin-left:5px;
297        margin-right:5px;
298        display:inline;
299        width:auto;
300}
301#imageToolBar #thumbCurrent {
302        margin-left:5px;
303        margin-right:5px;
304        display:inline;
305        width:auto;
306}
307#imageToolBar #linkPrev, #imageToolBar #thumbCurrent, #imageToolBar #linkNext {
308        border:#FFF solid 2px;
309        width:auto;
310}
311#derivativeSwitchBox, #sortOrderBox {
312        font-size: 11px;
313        color: #fff;
314        text-shadow: 0 0 2px #ccc;
315        padding: 4px 8px;
316        border: 1px solid rgba(255,255,255,0.25);
317        background-color: rgb(50,50,50);
318        background-color: rgba(50,50,50,0.92);
319        background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(#fff));
320        border-radius: 3px;
321        -webkit-border-radius: 3px;
322        -moz-border-radius: 3px;
323        box-shadow: 0 0 5px #555;
324        -webkit-box-shadow: 0 0 5px #555;
325        -moz-box-shadow: 0 0 5px #555;
326}
327#derivativeSwitchBox A:hover, #sortOrderBox A:hover {
328        text-shadow: 0 0 2px #000;
329        color: #fff;
330}
331
332/*calendar elements*/
333SPAN.calItem, SPAN.calItemEmpty
334{
335  border: 1px solid silver;
336}
337
338.virtual_cat { background: #fff !important; }
339#mbMenu #quicksearch > p { text-align: left; }
340form p { text-align:center; }
341#qsearchInput { color: #000; }
342#qsearchInput:focus { color: #000; }
343UL.tabsheet LI.normal_tab { background-color: #d3d3d3; }
344UL.tabsheet LI.selected_tab { background-color: #eeeeee; }
345
346UL.tabsheet, UL.tabsheet LI {border-color: gray;}
347UL.tabsheet LI.normal_tab:hover { border-color: black; }
348
349/* TipTip CSS - Version 1.2 */
350
351#tiptip_holder {
352        display: none;
353        position: absolute;
354        top: 0;
355        left: 0;
356        z-index: 99999;
357}
358
359#tiptip_holder.tip_top {
360        padding-bottom: 5px;
361}
362
363#tiptip_holder.tip_bottom {
364        padding-top: 5px;
365}
366
367#tiptip_holder.tip_right {
368        padding-left: 5px;
369}
370
371#tiptip_holder.tip_left {
372        padding-right: 5px;
373}
374
375#tiptip_content {
376        font-size: 11px;
377        color: #fff;
378        text-shadow: 0 0 2px #000;
379        padding: 4px 8px;
380        border: 1px solid rgba(255,255,255,0.25);
381        background-color: rgb(25,25,25);
382        background-color: rgba(25,25,25,0.92);
383        background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(#000));
384        border-radius: 3px;
385        -webkit-border-radius: 3px;
386        -moz-border-radius: 3px;
387        box-shadow: 0 0 3px #555;
388        -webkit-box-shadow: 0 0 3px #555;
389        -moz-box-shadow: 0 0 3px #555;
390}
391
392#tiptip_arrow, #tiptip_arrow_inner {
393        position: absolute;
394        border-color: transparent;
395        border-style: solid;
396        border-width: 6px;
397        height: 0;
398        width: 0;
399}
400
401#tiptip_holder.tip_top #tiptip_arrow {
402        border-top-color: #fff;
403        border-top-color: rgba(255,255,255,0.35);
404}
405
406#tiptip_holder.tip_bottom #tiptip_arrow {
407        border-bottom-color: #fff;
408        border-bottom-color: rgba(255,255,255,0.35);
409}
410
411#tiptip_holder.tip_right #tiptip_arrow {
412        border-right-color: #fff;
413        border-right-color: rgba(255,255,255,0.35);
414}
415
416#tiptip_holder.tip_left #tiptip_arrow {
417        border-left-color: #fff;
418        border-left-color: rgba(255,255,255,0.35);
419}
420
421#tiptip_holder.tip_top #tiptip_arrow_inner {
422        margin-top: -7px;
423        margin-left: -6px;
424        border-top-color: rgb(25,25,25);
425        border-top-color: rgba(25,25,25,0.92);
426}
427
428#tiptip_holder.tip_bottom #tiptip_arrow_inner {
429        margin-top: -5px;
430        margin-left: -6px;
431        border-bottom-color: rgb(25,25,25);
432        border-bottom-color: rgba(25,25,25,0.92);
433}
434
435#tiptip_holder.tip_right #tiptip_arrow_inner {
436        margin-top: -6px;
437        margin-left: -5px;
438        border-right-color: rgb(25,25,25);
439        border-right-color: rgba(25,25,25,0.92);
440}
441
442#tiptip_holder.tip_left #tiptip_arrow_inner {
443        margin-top: -6px;
444        margin-left: -7px;
445        border-left-color: rgb(25,25,25);
446        border-left-color: rgba(25,25,25,0.92);
447}
448
449/* Webkit Hacks  */
450@media screen and (-webkit-min-device-pixel-ratio:0) { 
451        #tiptip_content {
452                padding: 4px 8px 5px 8px;
453                background-color: rgba(45,45,45,0.88);
454        }
455        #tiptip_holder.tip_bottom #tiptip_arrow_inner { 
456                border-bottom-color: rgba(45,45,45,0.88);
457        }
458        #tiptip_holder.tip_top #tiptip_arrow_inner { 
459                border-top-color: rgba(20,20,20,0.92);
460        }
461}
Note: See TracBrowser for help on using the repository browser.