sortable columns header
[plewww.git] / planetlab / css / demo.css
1 /*
2    Add the following to your CSS file should you wish the cursor to
3    "wait" while the script is processing the sort
4 */
5
6 body.sort-active *
7         {
8         cursor:wait;
9         }
10
11 body
12         {
13         padding:0;
14         border:0;
15         margin:0;
16         text-align:center;
17         font-size:12px;
18         font-family: verdana,arial,sans-serif;
19         color:#545454;
20         min-width: 800px;
21         }
22 h2 span
23         {
24         font-variant:small-caps;
25         }
26 p a
27         {
28         font-weight:normal;
29         outline:none;
30         }
31 p a:link,
32 p a:visited
33         {
34         color:#333;
35         text-decoration:underline;
36         }
37 p a:hover
38         {
39         color:#fff;
40         text-decoration:none;
41         background:#000;
42         }
43 p a:active
44         {
45         color:#000;
46         text-decoration:underline;
47         }
48 code
49         {
50         font-family:'andale mono','lucida console','courier new',monospace;
51         font-size:1em;
52         }
53 p
54         {
55         line-height:1.6em;
56         margin:0 0 1em 0;
57         }
58 h1
59         {
60         font-weight:lighter;
61         font-family:georgia, times new roman, times, georgia, palatino, serif;
62         text-align:center;
63         margin-top:0.6em;
64         color:#000;
65         font-size:2em;
66         }
67 h2
68         {
69         font-weight:lighter;
70         font-family:verdana,arial,sans-serif;
71         text-align:center;
72         margin-top:1em;
73         color:#333;
74         text-transform:uppercase;
75         letter-spacing:1px;
76         font-size:1.2em;
77         }
78 h2 span
79         {
80         font-variant:small-caps;
81         text-transform:none;
82         }
83 .cs1
84         {
85         width:30em;
86         }
87 .cs2
88         {
89         width:20em;
90         }
91 .cs1 td,
92 .cs2 td,
93 #scientificNotation
94         {
95         text-align:right;
96         }
97 caption
98         {
99         padding: 0 0 5px 0;
100         margin:0 auto;
101         width:auto;
102         font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
103         text-align: right;
104         }
105 td.total
106         {
107         border-top: 0;
108         border-left: 0;
109         border-right: 1px solid #C1DAD7;
110         background: none;
111         text-align:right;
112         font-weight:bold;
113         text-transform:uppercase;
114         letter-spacing:1px;
115         }
116 /*
117 These styles should be added when very long tables are expected
118 th.sort-active
119         {
120         background:#CAE8EA url(../media/bg_header_sorting.jpg) no-repeat 0 0;
121         cursor:wait;
122         }
123 th.sort-active a
124         {
125         color:#a80000 !important;
126         cursor:wait;
127         }
128 */
129 th a
130         {
131         text-decoration:none;
132         color: #4f6b72;
133         background:transparent;
134         }
135 td a
136         {
137         text-decoration:none;
138         color:#239;
139         background:transparent;
140         }
141 td img
142         {
143         margin:0 auto;
144         border:3px solid #ddd;
145         }
146 td a:hover
147         {
148         color:#a84444;
149         border-bottom:1px dotted #a80000;
150         background:transparent;
151         }
152 td.lft
153         {
154         text-align:left;
155         }
156 tr.alt
157         {
158         background: #F5FAFA;
159         color: #797268;
160         }
161
162 /* Poor old Internet Explorer 6 has a bug that means we can't use background images for the table rows
163    as it trys to download the image each and every time that it is used (which means a 1000 row table
164    will produce 1000 http requests for the image in question) */
165 tr[class="alt"] td
166         {
167         background: #F5FAFA url(../media/td_alt.jpg) no-repeat;
168         }
169 td[class~="alt"]
170         {
171         background: #edf3f3 url(../media/col_alt.jpg) no-repeat !important;
172         }
173 /* Poor old Internet Explorer won't see the next two rules either as it doesn't get :first-child */
174 tbody tr.alt td:first-child
175         {
176         background: #F5FAFA url(../media/bullet2.gif) no-repeat;
177         font-weight:bold;
178         }
179 tbody tr td:first-child
180         {
181         background: #fff url(../media/bullet1.gif) no-repeat;
182         font-weight:bold;
183         }
184 /* Image free rules for Internet Explorer < 7 */
185 * html tr.alt td
186         {
187         background-color:#F5FAFA;
188         }
189 * html tr td.alt,
190 * html tr.alt td.alt
191         {
192         background-color:#edf3f3;
193         }