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

Last change on this file since 14504 was 14504, checked in by mistic100, 12 years ago

correct and simplify comments displaying with Sylvia

  • Property svn:eol-style set to LF
File size: 9.9 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        margin:0; 
163        padding:0px 10px 15px 15px; 
164        border:0;
165}
166.content .navigationBar {
167        color:#666;
168}
169/* contentWithMenu */
170.contentWithMenu {
171    margin-left: 290px;
172}
173.contentWithMenu #comments {
174  padding: 0 0 5px 0;
175}
176.contentWithMenu #imageToolBar {
177  padding-left: 0;
178}
179.contentWithMenu #imageHeaderBar .browsePath {
180    margin-left: 0;
181}
182
183/* Category thumbnails on main page */
184.thumbnailCategories li {
185        background:#222 url(images/cat_bottom-right.gif) no-repeat scroll right bottom; 
186        width:49%; 
187        margin: 0; 
188        padding:0; 
189}
190.thumbnailCategory { 
191        background:transparent url(images/cat_bottom-left.gif) no-repeat scroll left bottom; 
192        padding: 0 0 2px; 
193        margin:0; 
194}
195.thumbnailCategory .illustration { 
196        background:transparent url(images/cat_top-left.gif) no-repeat scroll left top; 
197        padding: 0 0 0 10px; 
198        margin: 0 !important; 
199}
200.thumbnailCategory .illustration a { 
201        display: block; 
202        margin: 0; 
203        padding:20px 0 0 8px; 
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-x: 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.content .commentElement {
283        border: 1px solid #666; 
284}
285.content .commentElement.odd { 
286        background-color: #222; 
287}
288.content .commentElement.even { 
289        background-color: #111; 
290}
291.content .commentElement .illustration { 
292        margin: 2px;
293  text-align: center;
294}
295.content .commentElement .description { 
296        padding:15px 10px 3px 0; 
297        overflow-x: hidden !important; 
298}
299
300#comments .commentsList hr {display:none;}
301#comments .filter input[type="submit"] { margin-top:1.8em; }
302
303/* Thumbnails */
304.thumbnails .wrap2 {
305        border: 1px solid #666; /* thumbnails border color and style */
306        border-radius: 4px 4px; /* round corners with CSS3 compliant browsers */ 
307}
308.thumbnails .wrap2:hover { 
309        color:#666;
310        background-color:#111; 
311        border:1px solid #ff3363;       /* thumbnails border color when mouse cursor is over it */ 
312}
313.calItem {
314        border:1px solid #666; 
315        margin:0 5px; 
316        padding:2px 5px 0 8px;
317}
318.calItemEmpty, td.calDayCellEmpty, td.calDayCellFull {
319        border:1px solid #666;
320}
321
322
323/**
324 * Picture
325 */
326#imageToolBar { 
327        padding:0 7%; 
328}
329#imageHeaderBar .imageNumber { 
330        margin-right:7%; 
331}
332#imageHeaderBar .browsePath { 
333        margin-left:7%; 
334}
335#imageHeaderBar, #imageToolBar A:hover { 
336        background-color: transparent; 
337}
338#imageHeaderBar H2 { 
339        border: 0; 
340}
341
342#theImage A, .illustration A, A.navThumb, A.navThumb { 
343        border-bottom-width: 0; 
344}
345.rateButtonStarFull, .rateButtonStarEmpty {     
346        background-image: url('icon/rating-stars.gif'); 
347}
348
349#thePicturePage .commentElement {
350        padding: 15px 2px 6px 12px; 
351        border: 1px solid #666; 
352}
353#thePicturePage .commentsList { 
354        padding-left: 12px; 
355        padding-right: 12px; 
356}
357#thePicturePage .odd { 
358        background-color: #222; 
359        border-top:0 !important; 
360}
361
362.pictureContent {
363        margin:0 7px 7px 290px;
364}
365
366#addComment fieldset {
367  color: #f70;
368        border-color: #f70;
369}
370#addComment fieldset  label {
371  color: #666;
372}
373
374
375/**
376 * Default Layout
377 */
378*, *:focus, *:active, input:active, a:active, input:focus, a:focus { 
379        outline: none; 
380}
381BODY { 
382        background:#111 url(images/bottom-left-bg.jpg) no-repeat fixed left bottom;
383        margin:0; 
384        min-height: 100%; 
385        height: 100%; 
386        padding:0; 
387}
388BODY, H1, H3, DT, INPUT.rateButtonSelected, H2, #menubar DT { 
389        color:#666; 
390}
391
392/* forms */
393FIELDSET, INPUT, SELECT, TEXTAREA { 
394        border: 1px solid #666; 
395}
396input[type="text"], input[type="password"], input[type="button"], input[type="submit"], input[type="reset"], input[type="file"] {
397        background-color:#444; 
398        color:#999; 
399} /* stupid Line but needed  due to inpact on other themes and deadline of Piwigo 2.0 */
400input[type="file"] {
401        background-color:#222; 
402        border: 1px solid #666;
403}
404INPUT, select, textarea { 
405        color:#999; 
406        background-color:#444; 
407}
408input[type="radio"], input[type="checkbox"], input[type="button"].rateButtonStarEmpty, input[type="button"].rateButtonStarFull { 
409        background-color: transparent; 
410}
411input[type="button"], input[type="submit"], input[type="reset"] {
412        color:#ff3363; 
413        background-color:#222; 
414        border-color:#ff3363; 
415}
416input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {
417        color:#999; 
418        border-color:#666; 
419}
420
421/* links */
422A, .rateButton { 
423        color:#f70; 
424        border-width: 0; 
425}
426A:hover, A:active { 
427        color:#f33; 
428        border-bottom: 1px solid #ff3363; 
429        cursor: pointer; 
430}
431a.external { 
432        color:#ff3363; 
433        border:0; 
434        text-decoration: none; 
435}
436a.external:hover { 
437        color:#ff7700; 
438        border:0; 
439}
440a.Piwigo {
441  font-family: verdana, arial, helvetica, sans-serif !important;
442  font-size: 11px; font-weight: normal; letter-spacing: 0;
443  color : #F33; text-decoration: none; border: 0; }
444a.Piwigo:hover {
445  border-bottom: 1px solid #ff3363;
446}
447
448.titrePage img.button[alt="x"] { margin: 0 3px 3px; }
449tr.tagLine, fieldset.tagLetter, legend.tagLetterLegend {
450        border-color: #666;
451}
452#debug { 
453        margin: 15px 15px 5px 248px; 
454        font-size:12px; 
455        clear: both; 
456}
457
458/* sprites */
459.pwg-icon {
460        background-image: url(../default/s26/outline_ff3363.png);
461}
462A:hover .pwg-icon {
463        background-image: url(../default/s26/outline_ff7700.png);
464}
465
466.message {
467  color:white;
468  background-color:#666;
469}
470
471.switchBox {
472    background-color: #222222;
473    border: 1px solid #FF3363;
474    border-radius: 0 15px 0 15px;
475}
476
477.switchBoxTitle {
478  border-color:#666;
479}
Note: See TracBrowser for help on using the repository browser.