source: extensions/simple_themes/simple/content.css @ 13557

Last change on this file since 13557 was 13557, checked in by plg, 12 years ago

import theme Simple version 2.5.2

  • more flexible layout for thumbnails
  • more flexible layout for categories
  • restore the possibility to hide thumbnails caption.
  • center image in slideshow
File size: 6.2 KB
Line 
1/*
2 CSS for all pages
3*/
4
5body {
6  font: 75% "Bitstream Vera Sans", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
7  margin: 0;
8  padding: 0;
9}
10
11img { border: 0; max-width: 100%; }
12a { text-decoration: none; }
13hr { border: 1px #999999 solid; }
14
15h1, h2, h3 {
16  margin: 0;
17  padding: 0;
18  font-size: 1em;
19}
20h1 { font-size: 1.6em; }
21
22#menuswitcher {
23  cursor: pointer;
24}
25
26/* hide javascript stuff */
27
28.js #menubar, .js #theComments > div {
29  display: none;
30}
31
32/* Layout */
33
34#the_page {
35  width: 85%;
36  margin: 0 auto;
37  padding: 0;
38}
39
40#theHeader h1 {
41  padding: 1em 0 0;
42}
43#theHeader p {
44  padding: 0;
45  margin: 0;
46}
47
48.titrePage {
49  margin: 1em 0;
50  line-height: 1.5em;
51}
52
53.titrePage h2 {
54  margin: 1em 0;
55  padding: 0;
56  display: inline;
57}
58.subcontent h2 {
59  margin: 0 0 1em;
60}
61
62.titrePage .button {
63  float: none;
64}
65
66.titrePage img {
67  float: left;
68  max-height: 16px;
69  margin: 0 5px;
70}
71
72.titrePage .categoryActions {
73  float: right;
74  margin: 0;
75  padding: 0;
76  list-style: none;
77  width: auto;
78}
79
80.categoryActions li {
81  display: inline;
82}
83
84#content {
85  margin: 1em 0 0;
86  padding: 1em;
87}
88
89/* tags */
90
91.tagLevel5 { font-size: 130%; }
92.tagLevel4 { font-size: 120%; }
93.tagLevel3 { font-size: 110%; }
94.tagLevel2 { font-size: 100%; }
95.tagLevel1 { font-size: 90%; }
96
97#fullTagCloud {
98  text-align: center;
99  margin: 1em 2em;
100}
101
102#fullTagCloud span {
103  white-space: nowrap;
104  margin: 0 0.5em;
105}
106
107#fullTagCloud a {
108  padding: 2px;
109}
110
111.tagLetterContent {
112  width: 100%;
113}
114
115.tagSelection li {
116  display:  inline;
117}
118
119/* Messages */
120
121.errors, .infos {
122  color: #e04040;
123  border: 1px dashed;
124  margin: 1em;
125}
126
127/* Forms */
128
129form {
130  margin: 0;
131}
132
133#content form li, .subcontent form li {
134  list-style: none;
135  margin: 0.2em 0;
136}
137
138.property {
139  display: inline-block;
140  width: 180px;
141}
142
143#quicksearch {
144  margin: 1em 0 0;
145}
146#quicksearch p {
147  margin: 0;
148}
149#quicksearch #q {
150  width: 150px;
151}
152
153/* Menubar */
154
155#menubar {
156  margin: 0 2em 0 0;
157  padding: 0;
158  float: left;
159  width: 15%;
160}
161
162#menubar ul {
163  margin: 0;
164  padding: 1em 0 1em 2em;
165}
166#menubar dd {
167  margin: 0;
168  padding: 0;
169}
170
171#menubar ul ul {
172 margin: 0;
173 padding: 0 0 0 1em;
174}
175
176/* images thumbnails */
177
178#thumbnails {
179  width: auto;
180  text-align: center;
181  padding: 1em 0;
182}
183
184#thumbnails ul, .middle_block > ul {
185  margin: 0;
186  padding: 0;
187  overflow: hidden;
188  list-style: none;
189}
190
191#thumbnails li, .middle_block > ul li {
192  margin: 1em;
193  padding: 0;
194  display: inline-block;
195  vertical-align: middle;
196}
197
198.nb-comments, .nb-hits {
199  font-weight: normal;
200}
201.zero {
202  display: none;
203}
204
205/* categories thumbnails */
206
207.thumbnailCategories {
208  margin: 0;
209  padding: 0;
210  overflow: hidden;
211  list-style: none;
212}
213
214.thumbnailCategories li {
215  display: inline-block;
216  overflow: hidden;
217  vertical-align: top;
218  margin: 1em;
219  width: 29%;
220  text-align: center;
221}
222
223.illustration {
224}
225
226.description {
227  overflow: auto;
228}
229
230.description h3 {
231  margin: 0;
232}
233
234.thumbCatDescNfoDate, .thumbCatDescNbImg {
235  margin: 0;
236  font-size: 80%;
237}
238
239.thumbCatDesc {
240  margin: 0;
241  padding-top: 4px;
242  word-wrap: break-word;
243}
244
245/* page : title bar */
246
247#additional_info {
248  margin: 1em 5em;
249}
250
251.navigationBar {
252  padding: 0.5em;
253  text-align: right;
254}
255
256/* pictures pages */
257
258#thePicturePage #theHeader {
259  display: none;
260}
261#thePicturePage #content {
262  padding: 1em 0 0;
263}
264
265.imageNumber {
266  float: right;
267  padding: 0 3px;
268  font-size: 0.9em;
269}
270
271.navButtons {
272  font-size: 1.5em;
273  text-align: center;
274}
275
276#navThumbPrev, #navThumbNext {
277  text-align: center;
278  margin: 1em auto;
279}
280
281#imageToolBar {
282  height: 25px;
283}
284
285#imageInfoBar {
286  float: right;
287  clear: right;
288  width: 25%;
289}
290
291#randomButtons ul {
292  padding: 0;
293  list-style-type: none;
294}
295
296#imageInfos dt, #imageMeta dt {
297  font-weight: bold;
298}
299#imageInfos dd, #imageMeta dd {
300  margin-left: 1em;
301  overflow: hidden;
302}
303
304#theImage {
305  float: left;
306  width: 75%;
307  text-align: center;
308  padding: 1em 0 2em;
309  margin: 0 auto;
310  overflow: hidden;
311}
312
313#rateForm {
314  margin: 0;
315}
316#rateForm input, #rateForm input:active {
317  cursor: pointer;
318  border: none;
319  padding: 0;
320}
321#rateForm input.rateButtonStarFull  {
322  background:  url('icon/rating-stars.png') no-repeat scroll -16px center;
323  width: 16px;
324}
325#rateForm input.rateButtonStarEmpty {
326  background:  url('icon/rating-stars.png') no-repeat scroll 0 center;
327  width: 16px;
328}
329
330/* slideshow */
331
332#slideshow {
333  margin: 1em auto;
334}
335#slideshow .titrePage {
336  width: 600px;
337  margin: 0 auto;
338}
339
340#slideshow .navButtons {
341  display: inline;
342  font-size: 1em;
343  float: right;
344  margin-right: 1em;
345}
346#slideshow #theImage {
347  float: none;
348  width: 100%;
349}
350
351/* comments */
352
353#theComments h3 {
354  height: 25px;
355  line-height: 25px;
356  padding-left: 1em;
357  cursor: pointer;
358}
359
360#commentAdd, #commentList {
361  width: 48%;
362  padding: 1%;
363}
364#commentAdd  { float: left; }
365#commentList { float: right; }
366
367#commentAdd input[type="text"], #commentAdd textarea {
368  width: 400px;
369}
370
371#commentList ul {
372  list-style: none;
373  padding: 0;
374}
375#commentList li {
376  clear: both;
377  display: block;
378  border-top: 1px dotted #606060;
379  padding: 0.5em 0;
380}
381#commentList li ul {
382  list-style-type: none;
383  padding: 4px;
384}
385
386ul.actions {
387  float: right;
388}
389
390#commentList .author {
391  font-weight: bold;
392  font-variant: small-caps;
393}
394#commentList .date {
395  font-style: italic;
396}
397
398#theCommentsPage #comments li {
399  list-style: none;
400  display: table-row;
401}
402
403#theCommentsPage form label {
404  display: inline-block;
405  line-height: 25px;
406}
407
408#comments .description {
409  vertical-align: top;
410  display: inline-block;
411}
412#comments .illustration {
413  width: auto;
414}
415
416/* calendar */
417
418.calendarViews, .calendarCalBar {
419  margin: 1em 0;
420}
421
422.calCalHead {
423  font-size: 1.1em;
424  font-weight: bold;
425}
426
427.calMonth {
428  width: 80%;
429  margin: 1em auto;
430}
431
432.calendarBar {
433  text-align: center;
434}
435.calendarBar span {
436  margin: 0 0.5em;
437}
438
439/* Footer */
440
441#copyright {
442  padding: 2px;
443  clear: both;
444}
445
446/* PWG stuff */
447
448.personal_block { padding: 0 !important; }
449
450
451/*  */
452
453@media only screen and (max-width: 957px) {
454  #the_page {
455    width: 100%;
456    margin: 0;
457  }
458
459  #thePicturePage #content {
460    position: relative;
461  }
462
463  #theHeader { margin: 0 1em; }
464  .titrePage { margin: 1em; }
465
466  #theImage {
467    width: 100%;
468    float: none;
469  }
470
471  #imageInfoBar {
472    float: none;
473    clear: both;
474    width: 100%;
475    margin: 0 10px;
476  }
477  #navThumbPrev, #navThumbNext {
478    float: left;
479    margin: 1em;
480  }
481}
482
Note: See TracBrowser for help on using the repository browser.