source: trunk/themes/Sylvia/theme.css @ 29482

Last change on this file since 29482 was 25232, checked in by rvelices, 11 years ago

simplified clandar bar template and css (also better alignment)

  • Property svn:eol-style set to LF
File size: 10.0 KB
Line 
1/* thumbnail wrap size */
2.thumbnailCategory .illustration { 
3        min-width:165px !important; /* Usable range 162px-360px , optimal : Thumbnail width + 40px */ 
4}
5 .commentElement .illustration { 
6        min-width:220px !important; /* Usable range 219px-360px , optimal : Thumbnail width + 95px */ 
7}
8
9/**
10 * Menubar
11 */
12#menubar DL { 
13        background:transparent url(images/menuBox_top.gif) no-repeat scroll left top;
14        margin:0 0 5px 40px; 
15        padding:0; 
16        width: 231px; 
17        min-width: 231px; 
18        border: 0; 
19        min-height: 32px; 
20        overflow-x: hidden;
21}
22#menubar DT { 
23        background-color:#111; 
24        border:0; 
25        display:inline; 
26        margin-left:8px; 
27        text-align:left; 
28}
29#menubar DD { 
30        background:transparent url(images/menuBox_bottom.gif) no-repeat scroll left bottom;
31        margin:14px 0 0 0; 
32        padding:0 0 22px; 
33        width: 231px; 
34        min-width: 231px; 
35        border: 0; 
36        overflow-x: hidden;
37}
38#menubar DD P {
39  background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom; 
40  padding: 2px 16px 0; 
41  margin: 0;
42}
43#menubar UL, #menubar #mbCategories p, #menubar .illustration  { 
44        background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom;
45        margin:0; 
46}
47#menubar DT A { 
48        font-size: 100%; 
49}
50#menubar UL { 
51        color:#333; 
52        font-size: 16px; 
53        line-height: 15px; 
54}
55#menubar UL SPAN.menuInfoCat { 
56        color:#666;
57}
58#menubar LI { 
59        padding-left: 12px; 
60}
61#menubar LI UL {
62  background: transparent url(images/transparent.gif);
63}
64#menubar A, .menuInfoCat { 
65        font-size: 13px; 
66}
67#menubar form { 
68        background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom; 
69        margin:0; 
70}
71#menubar p { 
72        padding: 16px 16px 0; 
73}
74
75.menubarFilter {
76        position: relative; 
77        right: 8px; 
78        top: 16px; 
79}
80
81#menubar #mbIdentification { 
82        background:transparent url(images/menuId_top.gif) no-repeat scroll left top !important;
83}
84#menubar #mbIdentification DD { 
85        background:transparent url(images/menuId_bottom.gif) no-repeat scroll left bottom; 
86}
87#menubar #mbIdentification UL, #menubar #mbIdentification p, #menubar #mbIdentification .illustration  { 
88        background:transparent url(images/menuId_sides.gif) repeat-y scroll left bottom; 
89}
90#menubar #mbIdentification form { 
91        background:transparent url(images/menuId_sides.gif) repeat-y scroll left bottom; 
92}
93#menubar #mbIdentification form  p { 
94        background:transparent none repeat-y scroll left bottom; 
95}
96#menubar #mbIdentification p { 
97        padding: 2px 16px 0; 
98        margin: 0;
99}
100#menubar #mbIdentification fieldset div input[type="text"] { 
101        margin: 0 0 3px; 
102        width: 174px; 
103        display: inline; 
104}
105#menubar #mbIdentification .button { 
106        height:24px; 
107        width:24px; 
108        right:0px; 
109        top:-40px; 
110}
111#menubar #mbIdentification fieldset { 
112        border:0; 
113        margin:0 24px 0 23px; 
114}
115#menubar #mbIdentification legend { 
116        display: none; 
117}
118#mbIdentification p, .totalImages { 
119        color:#666; 
120}
121
122#menubar #menuTagCloud { 
123        background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom;
124        margin:0; 
125        padding: 0 12px; 
126}
127
128#qsearchInput:focus, input:focus, select:focus, textarea:focus, input.focus, form .focus { 
129        background-color:#444;
130        color:#999; 
131}
132#qsearchInput { 
133        color:#999;
134}
135
136
137/**
138 * Content
139 */
140.content { 
141        background:#222 url(images/fillet.gif) repeat-x scroll left top; 
142        min-height:466px; 
143        border: 1px solid #000; 
144        border-top: 0; 
145        margin:21px 7px 0 290px !important; 
146        padding-top:7px; 
147}
148
149#the_page { 
150        background:transparent url(images/top-left-bg.jpg) no-repeat scroll left top;
151        left:0; 
152        margin:0; 
153        padding:0; 
154        position:absolute; 
155        top:0; 
156        z-index:0; 
157        width: 100%; 
158        min-width: 100%; 
159}
160
161.content h2 { 
162        padding:0px 10px 15px 15px; 
163        border:0;
164}
165.content .navigationBar {
166        color:#666;
167}
168/* contentWithMenu */
169.contentWithMenu {
170    margin-left: 290px;
171}
172.contentWithMenu #comments {
173  padding: 0 0 5px 0;
174}
175.contentWithMenu #imageToolBar {
176  padding-left: 0;
177}
178.contentWithMenu #imageHeaderBar .browsePath {
179    margin-left: 0;
180}
181
182/* Category thumbnails on main page */
183.thumbnailCategories li {
184        background:#222 url(images/cat_bottom-right.gif) no-repeat scroll right bottom; 
185        width:49%; 
186        margin: 0; 
187        padding:0; 
188}
189.thumbnailCategory { 
190        background:transparent url(images/cat_bottom-left.gif) no-repeat scroll left bottom; 
191        padding: 0 0 2px; 
192        margin:0; 
193}
194.thumbnailCategory .illustration { 
195        background:transparent url(images/cat_top-left.gif) no-repeat scroll left top; 
196        padding: 0 5px 0 10px; 
197        margin: 0 !important;
198  text-align: center;
199}
200.thumbnailCategory .illustration a { 
201        display: block; 
202  margin: 0 auto;
203  padding: 20px 4px 0;
204  border:0;
205}
206.thumbnailCategory .description { 
207        background:transparent url(images/cat_top-right.gif) no-repeat scroll right top;
208        margin: 0; 
209        padding:15px 10px 3px 0; 
210        overflow: hidden !important; 
211  height:158px;
212}
213.thumbnailCategory .description .text { 
214        display:block; 
215        margin:10px 2px 0 0;
216        overflow: auto; 
217        overflow-x:hidden; 
218        padding:0 0 5px; 
219}
220.thumbnailCategory .description p.dates { 
221        margin: 0 15px 0 15px; 
222        text-align: right; 
223}
224.thumbnailCategory .description H3 { 
225        display: block; 
226}
227.thumbnailCategories li:hover { 
228        background-color:#111; 
229}
230
231/* header */
232#theHeader { 
233        min-height:110px;
234        height:110px; 
235}
236
237.header_msgs { 
238        background:transparent url(images/header_msgs-bg.gif) repeat scroll left top;
239        border:0; 
240        color:#333; 
241        font-size:24px; 
242        left:0; 
243        margin:0; 
244        padding:10px 0 6px 0; 
245        text-align:center; 
246        top:0; 
247        width:100%; 
248        z-index:99; 
249}
250.header_notes {
251        background:transparent url(images/header_msgs-bg.gif) repeat scroll left top;
252        border:0 none;
253        color:#333;
254        font-size:16px;
255        margin:0;
256        padding:0;
257        position:absolute;
258        top:0;
259        width:100%;
260        z-index:99;
261}
262.infos { 
263        color:#f70; 
264        border:0; 
265        background:transparent url(icon/infos.png) no-repeat center right;
266        margin-left:40px;
267        text-align:left; 
268}
269.errors { 
270        color:#f33; 
271        border:0; 
272        background:transparent url(icon/errors.png) no-repeat center right;
273        margin-left:40px;
274        text-align:left; 
275        font-weight:bold; 
276}
277.infos li, .errors li { 
278        list-style-type:none; 
279}
280
281/* User comments */
282#comments {
283        margin: 0 10px 5px 10px;
284}
285.content .commentElement {
286        border: 1px solid #666; 
287}
288.content .commentElement.odd { 
289        background-color: #222; 
290}
291.content .commentElement.even { 
292        background-color: #111; 
293}
294.content .commentElement .illustration { 
295        margin: 2px;
296  text-align: center;
297}
298.content .commentElement .description { 
299        padding:15px 10px 3px 0; 
300        overflow-x: hidden !important; 
301}
302
303#comments .commentsList hr {display:none;}
304#comments .filter input[type="submit"] { margin-top:1.8em; }
305
306/* Thumbnails */
307.thumbnails .wrap2 {
308        border: 1px solid #666; /* thumbnails border color and style */
309        border-radius: 4px 4px; /* round corners with CSS3 compliant browsers */ 
310}
311.thumbnails .wrap2:hover { 
312        color:#666;
313        background-color:#111; 
314        border:1px solid #ff3363;       /* thumbnails border color when mouse cursor is over it */ 
315}
316.calItem {
317        border:1px solid #666; 
318        margin:0 5px; 
319        padding:2px 5px 0 8px;
320}
321SPAN.calItem, td.calDayCellEmpty, td.calDayCellFull {
322        border:1px solid #666;
323}
324
325
326/**
327 * Picture
328 */
329#imageToolBar { 
330        padding:0 7%; 
331}
332#imageHeaderBar .imageNumber { 
333        margin-right:7%; 
334}
335#imageHeaderBar .browsePath { 
336        margin-left:7%; 
337}
338#imageHeaderBar, #imageToolBar A:hover { 
339        background-color: transparent; 
340}
341#imageHeaderBar H2 { 
342        border: 0; 
343}
344
345#theImage A, .illustration A, A.navThumb, A.navThumb { 
346        border-bottom-width: 0; 
347}
348.rateButtonStarFull, .rateButtonStarEmpty {     
349        background-image: url('icon/rating-stars.gif'); 
350}
351
352#thePicturePage .commentElement {
353        padding: 15px 2px 6px 12px; 
354        border: 1px solid #666; 
355}
356#thePicturePage .commentsList { 
357        padding-left: 12px; 
358        padding-right: 12px; 
359  overflow: visible;
360  width: auto;
361}
362#thePicturePage .odd { 
363        background-color: #222; 
364}
365
366.pictureContent {
367        margin:0 7px 7px 290px;
368}
369
370#addComment fieldset {
371  color: #f70;
372        border-color: #f70;
373}
374#addComment fieldset  label {
375  color: #666;
376}
377
378
379/**
380 * Default Layout
381 */
382*, *:focus, *:active, input:active, a:active, input:focus, a:focus { 
383        outline: none; 
384}
385BODY { 
386        background:#111 url(images/bottom-left-bg.jpg) no-repeat fixed left bottom;
387        margin:0; 
388        min-height: 100%; 
389        height: 100%; 
390        padding:0; 
391}
392BODY, H1, H3, DT, INPUT.rateButtonSelected, H2, #menubar DT { 
393        color:#666; 
394}
395
396/* forms */
397FIELDSET, INPUT, SELECT, TEXTAREA { 
398        border: 1px solid #666; 
399}
400input[type="text"], input[type="password"], input[type="button"], input[type="submit"], input[type="reset"], input[type="file"] {
401        background-color:#444; 
402        color:#999; 
403} /* stupid Line but needed  due to inpact on other themes and deadline of Piwigo 2.0 */
404input[type="file"] {
405        background-color:#222; 
406        border: 1px solid #666;
407}
408INPUT, select, textarea { 
409        color:#999; 
410        background-color:#444; 
411}
412input[type="radio"], input[type="checkbox"], input[type="button"].rateButtonStarEmpty, input[type="button"].rateButtonStarFull { 
413        background-color: transparent; 
414}
415input[type="button"], input[type="submit"], input[type="reset"] {
416        color:#ff3363; 
417        background-color:#222; 
418        border-color:#ff3363; 
419}
420input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {
421        color:#999; 
422        border-color:#666; 
423}
424
425/* links */
426A, .rateButton { 
427        color:#f70; 
428        border-width: 0; 
429}
430A:hover, A:active { 
431        color:#f33; 
432        border-bottom: 1px solid #ff3363; 
433        cursor: pointer; 
434}
435a.external { 
436        color:#ff3363; 
437        border:0; 
438        text-decoration: none; 
439}
440a.external:hover { 
441        color:#ff7700; 
442        border:0; 
443}
444a.Piwigo {
445  font-family: verdana, arial, helvetica, sans-serif !important;
446  font-size: 11px; font-weight: normal; letter-spacing: 0;
447  color : #F33; text-decoration: none; border: 0; }
448a.Piwigo:hover {
449  border-bottom: 1px solid #ff3363;
450}
451
452.titrePage img.button[alt="x"] { margin: 0 3px 3px; }
453tr.tagLine, fieldset.tagLetter, legend.tagLetterLegend {
454        border-color: #666;
455}
456#debug { 
457        margin: 15px 15px 5px 248px; 
458        font-size:12px; 
459        clear: both; 
460}
461
462/* sprites */
463.pwg-icon {
464        background-image: url(../default/s26/outline_ff3363.png);
465}
466A:hover .pwg-icon {
467        background-image: url(../default/s26/outline_ff7700.png);
468}
469
470.message {
471  color:white;
472  background-color:#666;
473}
474
475.switchBox {
476    background-color: #222222;
477    border: 1px solid #FF3363;
478    border-radius: 0 15px 0 15px;
479}
480
481.switchBoxTitle {
482  border-color:#666;
483}
Note: See TracBrowser for help on using the repository browser.