source: WAeUP_SRP/base/skins/waeup_design/default.css.dtml @ 2324

Last change on this file since 2324 was 2310, checked in by Henrik Bettermann, 17 years ago

generic application form for all kinds of application processes (Part1)
File size: 17.5 KB
RevLine 
[2249]1<dtml-comment>
2CSS directives conforming to the CSS 2.1 spec.
3Those CSS directives are suppported by user agents such as Mozilla/Firefox, MSIE6, MSIE5.x, etc.
4$Id: default.css.dtml 47552 2006-07-28 17:33:14Z gracinet $
5</dtml-comment>
6
7<dtml-let last_modified="_.DateTime()-14" expires="_.DateTime()+1" >
8<dtml-call "REQUEST.RESPONSE.setHeader( 'Content-Type', 'text/css' )">
9<dtml-call "REQUEST.RESPONSE.setHeader( 'Last-Modified', last_modified.toZone('GMT').rfc822() )">
10<dtml-call "REQUEST.RESPONSE.setHeader( 'Cache-Control', 'max-age=36000, must-revalidate' )">
11<dtml-call "REQUEST.RESPONSE.setHeader( 'Expires', expires.toZone('GMT').rfc822() )" >
12</dtml-let>
13
14<dtml-with stylesheet_properties>
15
16<dtml-comment>
17BASIC ELEMENTS ------------------------------
18</dtml-comment>
19
20body {
21  font: <dtml-var mainFont>;
22  background: <dtml-var mainBackground>;
23  color: <dtml-var mainFontColor>;
24  margin: 0;
25  padding: 0;
26}
27
28body .popup {
29  font: <dtml-var mainFont>;
30}
31
32a {
33  text-decoration: none;
34  color: <dtml-var mainLinkColor>;
35  background-color: transparent;
36}
37
38a.strong {
39  font-weight: bold;
40}
41
42img {
43  border: 0;
44  vertical-align: middle;
45}
46
47p {
48  margin: 0.5em 0 1em 0;
49  line-height: 133%;
50}
51p a {
52  text-decoration: underline;
53}
54p a:visited {
55  color: <dtml-var contentLinkVisitedColor>;
56  background-color: transparent;
57}
58p a:active {
59  color: <dtml-var contentLinkActiveColor>;
60  background-color: transparent;
61}
62a:hover {
63  text-decoration: none;
64}
65p img {
66  border: <dtml-var contentImageBorder>;
67  margin: 0;
68}
69
70h1, h2, h3, h4, h5, h6 {
71  color: <dtml-var headingFontColor>;
72  background-color: transparent;
73  font: <dtml-var headingFont>;
74  font-weight: bold;
75  margin: 0;
76  padding-top: 0.5em;
77}
78h1 {
79  font-size: <dtml-var headingSize1>;
80  margin-top: 0.5em;
81  margin-bottom: 0.5em;
82}
83h2 {
84  font-size: <dtml-var headingSize2>;
85  margin-bottom: 1em;
86}
87h3 {
88  font-size: <dtml-var headingSize3>;
89}
90h4 {
91  font-size: <dtml-var headingSize4>;
92}
93h5 {
94  font-size: <dtml-var headingSize5>;
95}
96h6 {
97  font-size: <dtml-var headingSize6>;
98}
99
100ol, ul {
101  padding: 0;
102  margin: 0;
103  line-height: 133%;
104}
105ul a, ol a {
106  text-decoration: underline;
107}
108
109dt {
110  font-weight: bold;
111  margin: 0.5em 0em 0.5em 0em;
112}
113dt a {
114  text-decoration: none;
115}
116
117dd {
118  line-height: 133%;
119  margin-bottom: 1em;
120}
121
122legend {
123  background: <dtml-var mainBackground>;
124  padding: 0.5em 0em 0.5em 0em;
125}
126
127textarea {
128  color: <dtml-var mainFontColor>;
129  background-color: white;
130  font: <dtml-var inputFont>;
131}
132input {
133  font: <dtml-var inputFont>;
134  color: <dtml-var mainFontColor>;
135  background-color: white;
136  vertical-align: middle;
137}
138select {
139  font: <dtml-var inputFont>;
140  vertical-align: top;
141}
142abbr, acronym, .explain {
143  color: <dtml-var mainFontColor>;
144  background-color: transparent;
145}
146q, blockquote {
147  font-style: italic;
148  font-size: 100%;
149}
150code {
151  font-size: 100%;
152  color: <dtml-var mainFontColor>;
153  background-color: <dtml-var preBackground>;
154}
155pre {
156  font-size: 100%;
157  padding: 1em;
158  border: <dtml-var preBorder>;
159  color: <dtml-var mainFontColor>;
160  background-color: <dtml-var preBackground>;
161  overflow: auto;
162}
163
164<dtml-comment>
165Classes ------------------------------
166</dtml-comment>
167
168#idioma p {
169  margin-top: 0;
170}
171
172.logo {
173  margin: <dtml-var logoMargin>;
174  padding: <dtml-var logoPadding>;
175}
176
177.note {
178  font-size: smaller;
179}
180
181.even {
182  background-color: <dtml-var boxEvenBackground>;
183}
184
185.odd {
186  background-color: <dtml-var boxOddBackground>;
187}
188
189.pending {
190  font-weight: bold;
191  color: #ffa500;
192}
193
194.work {
195  font-weight: bold;
196  color: blue;
197}
198
199.draft {
200  font-weight: bold;
201  color: #5555ff;
202}
203
204.published {
205  font-weight: bold;
206  color: #22a522;
207}
208
209.deferred {
210  font-weight: bold;
211  color: #ff6600;
212}
213
214.expired {
215  font-weight: bold;
216  color: #ff0033;
217}
218
219.locked {
220  border: 1px solid #ff6600;
221  color: #ff6600;
222  padding-left: 0.2em;
223  padding-right: 0.2em;
224}
225
226.url {
227  color: <dtml-var urlFontColor>
228}
229
230input.standalone, button.standalone {
231  background: <dtml-var standaloneButtonBackground>;
232  background-image: none;
233  color: <dtml-var standaloneButtonFontColor>;
234  border: <dtml-var standaloneButtonBorder>;
235}
236
237input.context {
238  background: <dtml-var contextButtonBackground>;
239  background-image: none;
240  color: <dtml-var contextButtonFontColor>;
241}
242
243input.destructive {
244  background: <dtml-var destructiveButtonBackground>;
245  background-image: none;
246  color: <dtml-var destructiveButtonFontColor>;
247}
248
249button {
250  font: <dtml-var inputFont>;
251  background: <dtml-var standaloneButtonBackground>;
252  color: <dtml-var standaloneButtonFontColor>;
253  background-image: none;
254  vertical-align: middle;
255}
256
257<dtml-comment>
258DIVs ------------------------------
259</dtml-comment>
260
261div.batchLayout {
262  text-align: right;
263  background-color: <dtml-var boxEvenBackground>;
264}
265
266div.pageNavigationLayout {
267  text-align: center;
268  background-color: <dtml-var boxEvenBackground>;
269}
270
271.contact {
272  text-align: center;
273  margin: 0;
274  padding: 1px 0px 1px 0px;
275}
276
277div.message {
278  background: <dtml-var messageBackground>;
279  color: <dtml-var mainFontColor>;
280  font: <dtml-var messageFont>;
281  margin: 1em 0;
282  padding: 0.5em 1em;
283  vertical-align: middle;
284}
285
286div.message a {
287  background: <dtml-var messageBackground>;
288  color: <dtml-var mainFontColor>;
289  text-decoration: underline;
290}
291
292div.description {
293  font: <dtml-var descriptionFont>;
294  display: block;
295  margin-bottom: 0.5em;
296  line-height: 133%;
297}
298
299div.documentActions {
300  float: right;
301  margin-top: 1em;
302}
303
304div.documentActions li {
305  display: inline;
306}
307
308div.searchBox {
309  float: right;
310  text-align: right;
311  padding: <dtml-var searchPadding>;
312  margin: <dtml-var searchMargin>;
313  clear: right;
314  background-color: transparent;
315  color: <dtml-var searchFontColor>;
316  text-transform: <dtml-var textTransform>;
317  width: 40%;
318}
319
320div.headerActions {
321  float: right;
322  text-align: right;
323  margin-top: 1em;
324  margin-right: 1em;
325  margin-bottom: 4px;
326}
327
328div.headerActions li {
329  display: inline;
330}
331
332div.pathBar {
333  padding: 1px 1em 1px 1em;
334  text-transform: <dtml-var textTransform>;
335}
336
337div.row {
338  clear: both;
339}
340
341div.label {
342  font-weight: bold;
[2310]343 
[2249]344}
345
346div.field {
347  padding: 0px 0px 0px 0px;
348  text-align: left;
349}
350
351span.legend {
352  font-weight: bold;
353}
354
355div.popupImg {
356  padding: 10px;
357  text-align: center;
358}
359
360.hidden {
361  display: none;
362}
363
364.hiddenItem {
365  background-color: <dtml-var boxEvenBackground>;
366}
367
368<dtml-comment>
369Documents language selection
370</dtml-comment>
371
372span.selectedLang {
373  background: #003a6b;
374  color: #ffffff;
375  font-weight: bold;
376  padding-left: 0.5em;
377  padding-right: 0.5em;
378}
379a.availableLang {
380  text-decoration: underline;
381}
382a.availableLang:hover {
383  text-decoration: none;
384}
385
386<dtml-comment>
387Accessibility statement and usage
388</dtml-comment>
389
390div.accesskeys, div.accesskeysUsage {
391  border: 1px solid #999999;
392  background-color: #dddddd;
393  padding: 1em;
394  margin: 0.5em 0 2em 0;
395}
396
397<dtml-comment>
398Contact info and conformance statement
399</dtml-comment>
400
401.contactInfo li {
402  display: inline;
403  margin: 1em;
404}
405
406.conformanceStatement {
407  text-align: center;
408}
409
410.conformanceStatement li {
411  display: inline;
412}
413
414.conformanceStatement img {
415  margin: 1em;
416}
417
418<dtml-comment>
419CMF Calendar
420</dtml-comment>
421
422.CalendarArrow {
423  font-weight: bold;
424  text-decoration: none;
425  color: #000000;
426}
427
428.CalendarTitle {
429  font-weight: bold;
430  text-decoration: none;
431  text-align: center;
432  color: #000000;
433}
434
435p.help {
436  font-style: italic;
437}
438
439table.calendar td {
440  white-space: nowrap;
441  background-color: white;
442  width: 1.5em;
443}
444
445table.calendar a {
446  text-decoration: none;
447  color: black;
448}
449
450table.calendar td.event {
451  background-color: <dtml-var boxEvenBackground>;
452  text-decoration: none;
453}
454
455table.calendar td.todayevent {
456  background-color: <dtml-var boxEvenBackground>;
457}
458
459table.calendar td.weekdays {
460  background-color: <dtml-var boxEvenBackground>;
461}
462
463table.calendar th {
464  background-color: <dtml-var boxEvenBackground>;
465  white-space: nowrap;
466}
467
468table.localRoleForm th {
469  text-align: left;
470}
471
472span.highlightedSearchTerm {
473  background-color: #ffff00;
474}
475
476span.searchFor {
477  font-weight: bold;
478}
479
480/* hack for IE6 bugs */
481/* Hides from IE5-mac \*/
482* html .group {height: 1%}
483* html div.box {height: 1%}
484* html div.box .content {height: 1%}
485* html div.document {height: 1%}
486/* End hide from IE-mac */
487
488.netscape4 {
489  display: none;
490}
491
492table {
493  font-size: 100%;
494}
495
496hr {
497  height: 1px;
498  color: <dtml-var mainTabBorderColorSelected>;
499  background-color: transparent;
500}
501
502form {
503  border: none;
504}
505
506textarea {
507  border: <dtml-var inputBorder>;
508  padding: 0.1em;
509}
510input {
511  border: <dtml-var inputBorder>;
512  margin-bottom: 1px; /* IE bug fix */
513  padding: 0.1em;
514}
515select {
516  font: <dtml-var inputFont>;
517  border: <dtml-var inputBorder>;
518  vertical-align: top;
519}
520
521abbr, acronym, .explain {
522  border-bottom: 1px dotted <dtml-var mainFontColor>;
523  cursor: help;
524}
525
526ol, ul {
527  padding-left: 3em;
528  margin: 0px;
529}
530
531.content li, #content li {
532  padding: 0em 0em 0.4em 0em;
533}
534
535ul.fileChoice {
536  padding-left: 0;
537  list-style-type: None;
538}
539
540button {
541  background: <dtml-var buttonBackground>;
542  border: <dtml-var buttonBorder>;
543  margin: 0.2em;
544  padding: 0.1em;
545  font: <dtml-var inputFont>;
546}
547
548button:hover {
549  background: <dtml-var buttonBackgroundHover>;
550}
551
552input.standalone, button.standalone {
553  background: <dtml-var standaloneButtonBackground>;
554  cursor: pointer;
555  font: <dtml-var inputFont>;
556  font-weight: <dtml-var buttonWeight>;
557  padding: <dtml-var standaloneButtonPadding>;
558  text-transform: <dtml-var textTransform>;
559}
560
561input.standalone:hover, button.standalone:hover {
562  background: <dtml-var standaloneButtonBackgroundHover>;
563}
564
565input.context {
566  background: <dtml-var contextButtonBackground>;
567  cursor: pointer;
568  font: <dtml-var inputFont>;
569  font-weight: <dtml-var buttonWeight>;
570  padding: <dtml-var contextButtonPadding>;
571  text-transform: <dtml-var textTransform>;
572  border: <dtml-var contextButtonBorder>;
573}
574
575input.context:hover {
576  background: <dtml-var contextButtonBackgroundHover>;
577}
578
579input.destructive {
580  background: <dtml-var destructiveButtonBackground>;
581  border: <dtml-var destructiveButtonBorder>;
582  cursor: pointer;
583  font: <dtml-var inputFont>;
584  font-weight: <dtml-var buttonWeight>;
585  padding: <dtml-var destructiveButtonPadding>;
586  text-transform: <dtml-var textTransform>;
587}
588
589input.destructive:hover {
590  background: <dtml-var destructiveButtonBackgroundHover>;
591  border: <dtml-var destructiveButtonBorderHover>;
592}
593
594input.noborder {
595  background: transparent;
596  border: <dtml-var noBorder>;
597  margin: 0;
598}
599
600input.searchButton {
601  font-size: 100% ! important;
602  margin-bottom: 1px ! important;
603}
604
605input.moveUp {
606  background: <dtml-var moveUpButtonBackground>;
607}
608input.moveDown {
609  background: <dtml-var moveDownButtonBackground>;
610}
611input.moveTop {
612  background: <dtml-var moveTopButtonBackground>;
613}
614input.moveBottom {
615  background: <dtml-var moveBottomButtonBackground>;
616}
617
618<dtml-comment>
619Forms ------------------------------
620</dtml-comment>
621
622form {
623  margin: 0px;
624}
625
626form.workflow {
627  padding:0px 0px 10px 0px;
628}
629
630form.workflow dl {
631  font-weight: bold;
632}
633
634form.workflow dd {
635  margin-left: 0px;
636}
637
638<dtml-comment>
639Generic table definitions
640</dtml-comment>
641
642table.columns td.left {
643  background: <dtml-var columnsLeftBackground>;
644}
645table.columns td.right {
646  background: <dtml-var columnsRightBackground>;
647}
648
649table.listing {
650  width: 100%;
651}
652
653table.listing caption {
654  font-weight: bold;
655}
656
657table.listing td {
658  padding: 0.4em;
659}
660
661table.listing thead tr th {
662  text-align: center;
663}
664
665table.listing thead td {
666  background-color: <dtml-var listingHeaderBackground>;
667  color: <dtml-var listingHeaderColor>;
668  text-align: center;
669  font-weight: bold;
670}
671
672table.listing tbody td {
673  background-color: <dtml-var listingCellBackground>;
674  color: <dtml-var listingCellColor>;
675}
676
677table.listing tbody tr.odd td {
678  background-color: <dtml-var listingCellOddBackground>;
679  color: <dtml-var listingCellOddColor>;
680}
681
682table.listing tbody tr.even td {
683  background-color: <dtml-var listingCellEvenBackground>;
684  color: <dtml-var listingCellEvenColor>;
685}
686
687table.listing .action {
688  font-weight: bold;
689  text-align: left;
690}
691
692<dtml-comment>
693Specific table definitions
694</dtml-comment>
695
696form#loginForm {
697  padding-top:20px;
698  padding-bottom:20px;
699  width: 30em;
700}
701table#login th {
702  width: 12em;
703}
704
705table#portalConfiguration th {
706  width: 18em;
707  padding-bottom: 1em;
708}
709table#portalConfiguration td {
710  width: 18em;
711  padding-bottom: 1em;
712}
713
714table#subscriptions td {
715  text-align: center;
716}
717
718table#subscriptions .action {
719  text-align: left;
720}
721
722table.localRolesAssignment {
723  width: 100%;
724  padding: 0;
725  margin: 0.4em;
726  margin-bottom: 2em;
727  border: 0.1em solid black;
728}
729
730table.localRolesAssignment td.assignedRole {
731  text-align: center;
732}
733
734table.localRolesAssignment td.inheritedRole {
735  text-align: center;
736  background: <dtml-var inheritedRole>;
737}
738
739span.inheritedRole {
740  background: <dtml-var inheritedRole>;
741}
742
743table.localRolesAssignment td.inheritedBlockedRole {
744  text-align: center;
745  background: <dtml-var inheritedBlockedRole>;
746}
747
748span.inheritedBlockedRole {
749  background: <dtml-var inheritedBlockedRole>;
750}
751
752<dtml-comment>
753DIVs ------------------------------
754</dtml-comment>
755
756div.top {
757  background: <dtml-var topBackground>;
758  margin: <dtml-var topMargin>;
759  padding: <dtml-var topPadding>;
760  width: 100%;
761}
762
763.contact {
764  background: <dtml-var footerBackground>;
765  border-top: <dtml-var footerBorder>;
766  border-bottom: <dtml-var footerBorder>;
767  width: 100%;
768}
769
770div.document {
771  font: <dtml-var contentFont>;
772  background: <dtml-var contentBackground>;
773}
774
775div.message {
776  border: <dtml-var messageBorder>;
777}
778
779div.pathBar {
780  border-bottom-color: <dtml-var mainTabBorderColorSelected>;
781  border-bottom-style: solid;
782  border-bottom-width: 1px;
783}
784
785div.row {
786  margin: 0em 0em 0.5em 0em;
787  position:relative;
788}
789
790
791.required {
792  padding-right: 0.5em;
793  background: <dtml-var requiredField>;
794}
795
796.error {
797  background: <dtml-var messageBackground>;
798  border: <dtml-var messageBorder>;
799  padding: 1em;
800  margin: 0em;
801}
802
803div.field {
804  margin-top: 0.2em;
805}
806
807span.legend {
808  background: <dtml-var contentBackground>;
809  font-size: <dtml-var legendFontSize>;
810  padding: 0.5em 0em 0.5em 0em;
811  position : relative;
812  top: -0.8em;
813  left: 0;
814}
815
816<dtml-comment>
817The "group" class is used to group together the HTML fields of a form.
818</dtml-comment>
819.group {
820  margin: 0em;
821  padding:10px 0px 20px 0px;
822}
823
824.comment_box {
825  border: 1px solid #bcbcbc;
826  margin: 1em 0 1em 1em;
827  padding: 5px 10px 10px 20px;
828}
829
830.user_roles {
831  margin: 1em 0 1em 0;
832  padding: 0.7em 0em 0.7em 0em;
833}
834
835.header_roles {
836  font-weight: bold;
837  background: #b1acb2;
838}
839
840.assign_roles {
841  padding-top: 0.7em;
842}
843
844table.calendar {
845  border: <dtml-var boxBorder>;
846  text-align: right;
847}
848
849table.calendar a:hover {
850  text-decoration: none;
851}
852
853table.calendar th {
854  border: none;
855  font-weight: bold;
856  text-align: center;
857}
858
859table.calendar td {
860  width: 1.5em;
861}
862
863table.calendar td.weekdays {
864  border: <dtml-var boxBorder>;
865  border-style: solid none;
866  text-align: center;
867}
868
869table.calendar td.event {
870  font-weight: bold;
871}
872
873table.calendar td.todayevent {
874  border: <dtml-var boxHighlight>;
875  font-weight: bold;
876}
877
878table.calendar td.todaynoevent {
879  border-collapse: collapse;
880  border: <dtml-var boxHighlight>;
881}
882
883<dtml-comment>
884Tooltips
885</dtml-comment>
886
887.tooltipControl {
888  color: #000000;
889  background: #ffffe1;
890  border: 1px solid #000000;
891
892  margin-left: 1em;
893}
894
895.tooltipControl:hover {
896  background: #ffffb8;
897}
898
899.tooltipArea {
900  color: #000000;
901  background: #ffffe1;
902  border: 1px solid #000000;
903  padding: 0.8em;
904  font-weight: normal;
905  font-size: 80%;
906  text-align: left;
907
908  position: inherit;
909  left: -15em;
910  top: 1.5em;
911  width: 20em;
912
913  visibility: hidden;
914  display: none;
915  z-index: 1000;
916}
917
918<dtml-comment>
919XXX: CPSMailBoxer definitions that should not be here but in a dedicated file
920</dtml-comment>
921
922div.mailboxerNoArchive {
923  border-top: solid;
924  border-width: 1px;
925}
926
927td.mailboxerMonth {
928  background-color: <dtml-var boxEvenBackground>;
929  text-align: center;
930}
931
932<dtml-comment>
933Books
934</dtml-comment>
935
936div.bookSummary {
937  width: 100%;
938  border: 1px solid black;
939  padding: 0.5em;
940}
941
942div.bookSummaryNav {
943  text-align: center;
944  width: 100%;
945  background-color: <dtml-var boxEvenBackground>;
946}
947
948li.summaryEntries {
949  margin: 0.5em;
950}
951
952div.bookPageHeader {
953  border-bottom: 1px solid black;
954}
955
956div.bookPageNavigation {
957}
958
959div.bookPageInfo {
960  float: right;
961}
962
963<dtml-comment>
964Hide stuff by id and make it available in source
965</dtml-comment>
966
967#bylineFolder {
968  clear: both;
969  text-align: left;
970}
971
972#byline {
973  clear: both;
974  text-align: right;
975  margin-top: 2em;
976}
977
978<dtml-comment>
979javascript use for block toggle
980</dtml-comment>
981
982div.hidden {
983  visibility: hidden;
984  display: none;
985}
986
987div.visible {
988  visibility: visible;
989  display: block;
990}
991
992<dtml-comment>
993Advanced search form
994</dtml-comment>
995
996#advancedSearchForm {
997  font-size: 90%;
998}
999
1000#advancedSearchZCText {
1001  text-align: right;
1002}
1003
1004p.advancedSearchButton {
1005  text-align: right;
1006}
1007
1008#advancedSearchForm fieldset {
1009  border: none;
1010  border-left: <dtml-var boxBorder>;
1011  border-bottom: <dtml-var boxBorder>;
1012  padding: 0.5em 0em 0.5em 0em;
1013  margin: 0.5em;
1014}
1015
1016span.advancedSearchColumn {
1017  padding-left: 1em;
1018  float:left;
1019  width:12em;
1020}
1021
1022div.drophover {
1023  border-bottom: 3px solid black;
1024}
1025
1026div.drophover-in {
1027  background: #ffe68f;
1028  border: 1px solid black;
1029}
1030
1031#ajax_psm {
1032  background: #ffac0b;
1033  color: white;
1034  padding: 8px;
1035  border: 1px solid black;
1036  float: right;
1037  font-weight: bold;
1038  position: absolute;
1039  <dtml-if "isUserAgentGecko(REQUEST)">
1040  -moz-border-radius: 4px;
1041  </dtml-if>
1042}
1043
1044div.draggable:hover {
1045  background: #efefef;
1046}
1047
1048div.more_block {
1049  padding-left: 10px;
1050}
1051
1052div.batchLayout, div.pageNavigationLayout {
1053  color: #666666;
1054  margin: 0px 2px 0px 2px;
1055  padding: 3px 20px 3px 0px;
1056}
1057
1058table.folderButtons {
1059  padding-top: 1.2em;
1060}
1061
1062</dtml-with>
Note: See TracBrowser for help on using the repository browser.