Un peu plus de structuration :
[Plinn.git] / skins / custom_generic / zpt_stylesheet.css.dtml
1 /* <dtml-with base_properties> */
2
3 html,
4 body {
5 background-color: &dtml-backgroundColor;;
6 color: &dtml-fontColor;;
7 font-family: &dtml-fontFamily;;
8 font-size : &dtml-fontBaseSize;;
9 margin: 0;
10 padding: 0;
11 }
12
13 h1, h2, h3, h4, h5, h6 {
14 font-family: &dtml-headingFontFamily;;
15 }
16
17 h1 {
18 font-size:120%;
19 }
20
21 h2 {
22 font-size:110%;
23 }
24
25 h3 {
26 font-size:100%;
27 }
28
29 h4 {
30 font-style: italic;
31 }
32
33 a:link,
34 a:visited,
35 a:active {
36 color: &dtml-linkColor;;
37 text-decoration: none;
38 }
39
40 a:hover {
41 color: &dtml-linkHoverColor;;
42 text-decoration: none;
43 }
44
45 form {
46 margin:0;
47 }
48
49 table.ContentsList tr td { }
50
51 table.ContentsList tr td img {
52 border: 0;
53 }
54
55 table.FormLayout {
56 width: 99% }
57
58 table.FormLayout dl.FieldHelp dd {
59 font-size : 90% ;
60 font-style : italic}
61
62 table.FormLayout td.ListDefinition {
63 font-style: italic }
64
65 table.FormLayout td.ListName {
66 color: &dtml-fontColor;;
67 font-weight: bold;
68 vertical-align: middle;
69 padding-left: 2px;
70 }
71
72 table.FormLayout th {
73 font-weight: bold;
74 text-align: right }
75
76 table.FormLayout tr {
77 vertical-align: top }
78
79 table.FormLayout tr td.TextField {
80 vertical-align: top }
81
82 table.FormLayout tr th.TextField {
83 vertical-align: top }
84
85 table.NewsItems {
86 border: 0 }
87
88 table.SearchResults {
89 width: auto }
90
91 table.SearchResults tr td img {
92 border: 0 }
93
94 table.SearchResults tr th {
95 text-align: left }
96
97 table.Wizard {
98 width: auto }
99
100 table.Wizard tr {
101 vertical-align: top }
102
103 table.Wizard tr th {
104 text-align: right }
105
106 td {
107 vertical-align: top }
108
109 td.NewsBorder {
110 background-color: #369 }
111
112 td.NewsByLine {
113 color: #369;
114 background-color: #ccc;
115 text-align: left;
116 vertical-align: top }
117
118 td.NewsListing {
119 color: #fff;
120 font-weight: bold;
121 background-color: #369 }
122
123 td.NewsTitle {
124 color: #fff;
125 font-weight: bold;
126 background-color: #369;
127 text-align: center }
128
129 /*
130 textarea {
131 width : 99%
132 }
133 */
134
135
136 /* Top bar */
137
138 #Masthead {
139 background-color: &dtml-topbarBackgroundColor;;
140 width: 100%;
141 }
142
143 #Masthead td {
144 vertical-align: middle;
145 padding:0;
146 }
147
148 #PortalLogo {
149 vertical-align: middle;
150 }
151
152 #PortalLogo img {
153 border: none;
154 }
155
156
157 #PortalTitle {
158 font-family: &dtml-headingFontFamily;;
159 font-size: 120%;
160 font-weight: bold;
161 }
162
163 #NavBar {
164 font-size: &dtml-fontSmallSize;;
165 font-weight: bold;
166 }
167
168 #NavBar a,
169 #NavBar a:link,
170 #NavBar a:visited,
171 #NavBar a:active {
172 color: &dtml-specialLinkColor;;
173 }
174
175 #NavBar a:hover {
176 color: &dtml-specialLinkHoverColor;;
177 }
178
179
180 /* User menu bar */
181
182 #MemberActionsBox {
183 width: 100%;
184 background-color: &dtml-memberActionsBoxBackground;;
185 color: &dtml-fontColor;;
186 font-weight: bold ;
187 font-size: &dtml-fontSmallSize;;
188 padding : 0 2px ;
189 }
190 #MemberActionsBox td {
191 vertical-align: middle;
192 }
193
194 .ActionTitle {
195 color: &dtml-fontColor;
196 }
197
198 .ActionLink a:link,
199 .ActionLink a:visited,
200 .ActionLink a:active {
201 color: &dtml-specialLinkColor;;
202 text-decoration: none
203 }
204
205 .ActionLink a:hover { color: &dtml-specialLinkHoverColor;}
206
207
208 /* Breadcrumbs + Search form */
209 #Breadcrumbs {
210 background: &dtml-breadcrumbsBackground;;
211 font-size: &dtml-fontSmallSize;;
212 padding: 0 2px 1px 2px;
213
214 }
215
216 /*
217 Main column
218 */
219
220
221 /* Status messages */
222 #DesktopStatusBar, .DesktopStatusBar {
223 background-color: &dtml-messageBackgroundColor;;
224 border: 1px solid &dtml-messageBorderColor;;
225 color: &dtml-messageFontColor;;
226 font-size: &dtml-fontSmallSize;;
227 font-weight: bold;
228 padding-left : 1em;
229 margin-bottom : 6px;
230 vertical-align: middle;
231 }
232
233 #DesktopStatusBar img, .DesktopStatusBar img {
234 vertical-align: middle;
235 }
236
237 /* Content tabs */
238 .contentTabs {
239 border-bottom : &dtml-tabsBorderWidth; solid &dtml-tabsBorderColor;;
240 border-collapse: collapse;
241 white-space: nowrap;
242 padding-left: 1em;
243 margin: 0;
244 }
245
246 .contentTabs li, .additionalTabs li {
247 display: inline;
248 font-size: &dtml-fontSmallSize;;
249 }
250
251 .contentTabs a,
252 .contentTabs a:visited {
253 background-color: &dtml-tabsBackgroundColor;;
254 color: &dtml-tabsFontColor;;
255 margin-right: 0.5em;
256 padding: 0 1em;
257 border-left : 1px dashed &dtml-tabsBorderColor;;
258 border-top : 1px dashed &dtml-tabsBorderColor;;
259 border-right : 1px dashed &dtml-tabsBorderColor;;
260 border-radius:7px 7px 0 0;
261 }
262
263 .contentTabs a:hover, .contentTabs a:active {
264 background-color: &dtml-tabsBorderColor;;
265 color: &dtml-tabsFontColor;;
266 }
267
268 .contentTabs .selected a,
269 .contentTabs .selected a:visited,
270 .contentTabs .selected a:hover {
271 border-left : &dtml-tabsBorderWidth; solid &dtml-tabsBorderColor;;
272 border-right : &dtml-tabsBorderWidth; solid &dtml-tabsBorderColor;;
273 border-top : &dtml-tabsBorderWidth; solid &dtml-tabsBorderColor;;
274 border-bottom : &dtml-tabsBottomBorderSelectedWidth; solid &dtml-selectedTabBackgroundColor;;
275 color: &dtml-tabsFontColor;;
276 background-color : &dtml-selectedTabBackgroundColor;;
277 }
278
279 .additionalTabs {
280 padding-right : 2em ;
281 text-align : right ;
282 margin : 0 ;
283 }
284
285 .additionalTabs a, .additionalTabs a:visited {
286 color: &dtml-tabsFontColor;;
287 padding: 0 1em;
288 border-left : 1px dashed &dtml-tabsBorderColor;;
289 }
290
291 .additionalTabs .selected a {
292 background-color : &dtml-tabsBorderColor;;
293 }
294
295
296 #mainCell {
297 padding: 12px 5px;
298 }
299 #ForematterCell {
300 background: &dtml-contentBackgroundColor;;
301 padding-bottom : 1px ;
302 }
303
304 /* Header */
305 .header {
306 font-family: &dtml-headingFontFamily;;
307 padding: 0 0.5em;
308 }
309
310 /* Title */
311 #DesktopTitle {
312 font-size: 120%;
313 font-weight: bold;
314 color: &dtml-fontColor;;
315 margin : 0 ;
316 padding: 2px;
317 vertical-align : bottom ;
318 }
319
320 #DesktopTitle img {
321 vertical-align:middle;
322 padding-right: 2px;
323 }
324 /* Description */
325 #DesktopDescription {
326 font-size: &dtml-fontSmallSize;;
327 color: &dtml-descriptionColor;;
328 }
329
330 /* Content Byline */
331 #ContentByLine {
332 color : &dtml-descriptionColor;;
333 background-color: &dtml-bylineBackgroundColor;;
334 font-size: &dtml-fontSmallSize;;
335 text-align: right;
336 padding: 0 1em;
337 }
338
339 #ContentByLine a {
340
341 }
342
343 /* Main content */
344 #Desktop {
345 padding: 0 0.5em;
346 text-align: justify ;
347 }
348
349 /* Search form */
350
351 #search_form {
352 font-size: &dtml-fontSmallSize;;
353 }
354
355 #Footer {
356 background-color : &dtml-footerBackgroundColor;;
357 color: &dtml-fontColor;;
358 font-size: 80%;
359 text-align: center;
360 padding : 3px 0;
361 position:absolute;
362 bottom:0;
363 width:100%;
364 height:1em;
365 }
366
367 /* Folder contents */
368
369 .listing {
370 font-size: &dtml-fontSmallSize;;
371 }
372
373 .listing th {
374 background-color: &dtml-listingHeaderBackgroundColor;;
375 text-align: left;
376 padding: 2px 0 1px 4px;
377 }
378
379 .listing th a,
380 .listing a:link,
381 .listing a:visited,
382 .listing a:active {
383 color: &dtml-linkColor;;
384 }
385
386 .listing th a:hover {
387 color: &dtml-linkHoverColor;;
388 }
389
390 .listing td {
391 padding : 2px ;
392 vertical-align : middle ;
393 }
394
395 .listing .odd {
396 background-color: &dtml-oddRowBackgroundColor;;
397 }
398 .listing .even {
399 background-color: &dtml-evenRowBackgroundColor;;
400 }
401
402 .listing span.upload-progress {
403 display: block;
404 position:absolute;
405 background:#ef8e32;
406 height:4px;
407 border-radius:2px;
408 width:0;
409 top:3px;
410 }
411
412
413 /* Batched navigation */
414
415 .listingBar {
416 background-color: &dtml-tabsBackgroundColor;;
417 font-size: &dtml-fontSmallSize;;
418 border: 1px solid &dtml-listingBarBorderColor;;
419 padding: 0em 1em;
420 margin:1em 0;
421 text-align: center;
422 vertical-align: top;
423 }
424
425 .listingBar a,
426 .listingBar a:link,
427 .listingBar a:visited,
428 .listingBar a:active {
429 color : &dtml-linkColor;;
430 }
431
432 .listingBar a:hover {
433 color : &dtml-linkHoverColor;;
434 }
435
436 .listingBar a.previous {
437 text-align: left;
438 float: left;
439 }
440
441 .listingBar a.next {
442 text-align: right;
443 float: right;
444 }
445
446 /* Recent news */
447
448 .newsItem {
449 font-size:90%;
450 background-color: &dtml-contentBackgroundColor;;
451 margin: 1em 0;
452 }
453
454 .newsTitle {
455 color: &dtml-fontColor;;
456 font-weight: bold;
457 padding: 0 2px;
458 border: &dtml-tabsBorderWidth; solid &dtml-newsTitleBorderColor;;
459 }
460
461 .newsTitle a {
462 color: &dtml-fontColor;;
463 }
464
465 .newsDescription {
466 margin: 0 0.5em;
467 }
468
469 .newsContent {
470 padding: 0 1em 1em 1em;
471 }
472
473 .newsContent ul,
474 .newsContent li {
475 display: block;
476 list-style: none;
477 list-style-image: none;
478 margin: 0;
479 padding: 0;
480 }
481
482 .newsAbout {
483 display: block;
484 color: &dtml-fontColor;;
485 font-size: &dtml-fontSmallSize;;
486 list-style: none;
487 list-style-image: none;
488 float: right;
489 text-align: right;
490 }
491
492 .newsAbout li {
493 display: inline;
494 }
495
496 .newsFooter {
497 font-size: &dtml-fontSmallSize;;
498 }
499
500 .newsFooter li {
501 display: inline;
502 margin: 0 1em 0 0;
503 }
504
505 <dtml-comment>
506
507 /* Not used */
508
509 .ObjectStatus {
510 font-style: italic }
511
512 .ContextActionsRow {
513 color: white;
514 background-color: #aaa }
515
516 #ContextActionsBox {
517 background-color: #aaa;
518 padding: 0;
519 border: dotted 2px #ffa500 }
520
521 #DiscussionAbove {
522 font-style: italic;
523 margin: 8pt 8pt 8pt 16pt;
524 border: dashed 2px #f00 }
525
526 </dtml-comment>
527
528 /* </dtml-with> */