tazpanel view styles/default/style.css @ rev 400

Apply "sed css" from receipt
author Xander Ziiryanoff <psychomaniak@xakep.ru>
date Wed Dec 17 20:28:20 2014 +0000 (2014-12-17)
parents 6a8ad3b2b789
children 14b3b1dc2212
line source
1 /*
2 * CSS style for TazPanel - (C) 2011-12 SliTaz GNU/Linux
3 */
4
5 /* To always have a scroll bar */
6 html {
7 min-height: 102%;
8 }
9
10 body {
11 background: #fff;
12 color: black;
13 font: 13px "DejaVu Sans", Ubuntu, "Droid Sans", "Liberation Sans", FreeSans, sans-serif;
14 margin: 80px 0 0;
15 }
16
17 h1 { margin: 0; padding: 8px; color: #fff; font-size: 20px; }
18 h2 { color: #333; margin: 10px 0 10px; font-size: 180%; }
19 h3 { color: #444; font-size: 160%; }
20 h4 { color: #666; font-size: 140%; }
21 img { border: 0pt none; vertical-align: middle; padding: 0px 6px 2px 0;}
22 p { margin: 10px 0; }
23 ul { list-style-type: square; }
24 li { padding: 4px 0; }
25 a { text-decoration: none; color: #666; }
26 a:hover { color: #000; }
27
28 /* Header and main title */
29
30 #header {
31 height: 40px;
32 /*border-bottom: 4px solid #afafaf;*/
33 background: #222 url(images/logo.png) no-repeat left;
34 position: fixed;
35 top: 0;
36 width: 100%;
37 }
38
39 #header h1 {
40 margin: 0;
41 padding: 8px 0 0 42px;
42 font-style: italic;
43 }
44
45 /* Desktop gui style bar */
46
47 #toolbar {
48 position: fixed;
49 top: 40px;
50 left: 0;
51 height: 23px;
52 width: 100%;
53 padding: 0;
54 background-color: #f1efeb;
55 border-bottom: 1px solid #c1baad;
56 z-index: 200;
57 cursor: default;
58 }
59
60 #menu {
61 margin: 0;
62 padding: 0;
63 }
64 #menu li {
65 list-style: none;
66 float: left;
67 padding: 0;
68 }
69 #menu li a {
70 display: block;
71 padding: 4px 6px;
72 background-color: inherit;
73 text-decoration: none;
74 cursor: default;
75 color: #000;
76 }
77 #menu li a:hover {
78 color: #ffffff;
79 background-color: #d66018;
80 }
81 #menu li ul {
82 display: none;
83 min-width: 180px;
84 background-color: #f1efeb;
85 border: 1px solid #c1baad;
86 }
87 #menu li ul a {
88 padding: 4px 6px 2px;
89 }
90 #menu li:hover ul {
91 display: block;
92 position: absolute;
93 margin: 0;
94 padding: 0;
95 }
96 #menu li:hover li {
97 float: none;
98 position: relative;
99 }
100 #menu li:hover li a {
101 background-color: #f1efeb;
102 color: #000;
103 }
104 #menu li li a { border: 1px solid #f1efeb; }
105 #menu li li a:hover {
106 background-color: #d66018;
107 color: #ffffff;
108 border-radius: 2px;
109 /* border: 1px solid #c1baad; */
110 }
111
112 /* submenus */
113 #menu li:hover li ul {
114 display: none;
115 position: absolute;
116 left: 180px;
117 top: 0px;
118 z-index:1;
119 }
120 #menu li:hover li:hover ul {
121 display: block;
122 }
123
124 #icons { margin: 3px 8px; float: right; }
125 #icons img { padding: 0; }
126
127 #loading {
128 /* font-weight: bold; */
129 background-color: #f8f8f8;
130 border: 1px solid #ddd;
131 color: #666;
132 cursor: progress;
133 position: fixed;
134 top: 76px;
135 right: 120px;
136 width: 248px;
137 padding: 4px 4px 2px;
138 }
139
140 /* Blocks */
141
142 #block { float: left; }
143
144 /* Sidebar menus */
145
146 #sidebar {
147 position: fixed;
148 top: 124px;
149 right: 5px;
150 width: 116px;
151 }
152
153 #sidebar a {
154 display: block;
155 padding: 0px 0 0px 12px;
156 margin: 0;
157 }
158
159 #sidebar a.active {
160 color: #000;
161 font-weight: bold;
162 }
163
164 #sidebar h4 { margin: 0 0 2px 12px; font-size: 16px; color: #222; }
165 #sidebar ul { list-style-type: none; padding: 0; }
166
167
168 /* Content */
169
170 #content { margin: 20px; }
171 #content-sidebar { margin: 20px 120px 20px 20px; }
172 #wrapper, .wrapper { margin: 20px 0; }
173
174 #actions {
175 min-height: 20px;
176 padding: 0;
177 }
178
179 #actions p { margin: 6px 0; }
180
181 .search {
182 position: fixed;
183 right: 10px;
184 top: -8px;
185 }
186
187 .search input[type=submit] {
188 padding: 5px;
189 margin-left: -4px;
190 background-color: #f1f1f1;
191 border: 1px solid #ddd;
192 cursor: pointer;
193 color: #000;
194 font-weight: bold;
195 border-radius: 0px;
196 }
197
198 .search input[type=submit].radius {
199 border-top-right-radius: 4px;
200 border-bottom-right-radius: 4px;
201 border-top-left-radius: 0px;
202 border-bottom-left-radius: 0px;
203 }
204
205 .search input[type=text] {
206 border: 1px solid #ddd;
207 padding: 4px;
208 height: 18px;
209 margin: 0;
210 width: 200px;
211 border-top-left-radius: 4px;
212 border-bottom-left-radius: 4px;
213 }
214
215 .box {
216 margin: 10px 0;
217 padding: 12px;
218 background: #f8f8f8;
219 border: 1px solid #ddd;
220 }
221
222 .box ul { list-style-type: none; padding: 0; }
223
224 .debug {
225 position: fixed;
226 bottom: 0px;
227 right: 10px;
228 left: 10px;
229 margin: 5px;
230 padding: 4px 10px;
231 background-color: #111;
232 color: #fff;
233 border: 0;
234 font-size: 12px;
235 opacity: 0.9;
236 }
237
238 .float-left {
239 float: left;
240 }
241 .float-right {
242 float: right;
243 }
244
245 /* Table */
246
247 table {
248 background-color: #f8f8f8;
249 border: 4px solid #ddd;
250 padding: 10px;
251 width: 100%;
252 margin: 0 0 6px 0;
253 }
254
255 table a { color: #000; }
256 table a:hover { color: #666; }
257 td.small { min-width: 60px; }
258 td.pkg { max-width: 160px; }
259 td.desc { max-width: 300px; }
260 td.pct { min-width: 200px; background: #eee; }
261 div.pct { background: #ccc; }
262 td.pct, div.pct { border-radius: 2px; }
263
264 #thead, .thead, thead {
265 height: 10px;
266 font-weight: bold;
267 }
268
269 /*
270 * Table Zebra
271 */
272
273 table.zebra {
274 border: none;
275 border-collapse: collapse;
276 margin: 20px 0;
277 }
278 table.zebra tr:nth-child(even) {
279 background-color: rgba(0,0,0,0.05);
280 }
281 table.zebra thead tr td {
282 height: 22px;
283 background-color: #eee;
284 text-align: center;
285 vertical-align: middle;
286 }
287 table.zebra td + td {
288 border-left: 1px solid #ddd;
289 height: 22px;
290 }
291 table.zebra td:first-child { padding-left: 6px; }
292 .outbox {
293 box-shadow: 0 0 2px 4px #ddd;
294 }
295 .fixed {
296 table-layout: fixed;
297 }
298
299 /*
300 * syntax_highlighter
301 */
302
303 span.conf-comment { color: #666; }
304 span.conf-var { color: #392600; }
305 span.conf-val, span.sh-val { color: #f35a00; }
306 span.sh-comment { color: #b20000; }
307 span.activity-log { color: #888; }
308 span.diff-rm { color: red; }
309 span.diff-add { color: green; }
310 span.diff-at { color: blue; }
311 span.top { color: #00c800; font-weight: normal; }
312 span.kernel-hex { color: #18A423; }
313 span.kernel-id { color: #287FC7; }
314 span.kernel-id2 { color: #843523; }
315 span.lsusb-h, span.lspci-h { color: #800; font-weight: bold; }
316 span.lsusb-t, span.lspci-t { color: #448; font-weight: bold; }
317
318 /* Misc */
319
320 pre, .pre-main {
321 font: 13px "DejaVu Sans Mono", "Droid Sans Mono", "Liberation Mono", FreeMono, monospace;
322 background-color: #f8f8f8;
323 border: 4px solid #ddd;
324 padding: 10px;
325 margin: 10px 0;
326 overflow: auto;
327 }
328
329 .pre-main { margin: 16px 0; }
330
331 input[type=submit], select, .button {
332 color: #444444;
333 border: 1px solid #afafaf;
334 padding: 4px;
335 margin: 4px 0px;
336 font-size: 14px;
337 line-height: 1.2em;
338 background-image: -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
339 background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
340 -webkit-appearance: none;
341 -webkit-padding-end: 12px;
342 -webkit-padding-start: 6px;
343 }
344 input[type="submit"] {
345 -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
346 -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
347 box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
348 }
349 /*select {
350 background-image: url(images/down.png),
351 -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
352 background-position: center right;
353 background-repeat: no-repeat;
354 }*/
355 a.button {
356 white-space: nowrap;
357 height: 16px;
358 margin: 2px 0;
359 display: inline-block;
360 }
361
362 input[type=submit]:hover, select:hover, .button:hover {
363 background-color: #ddd;
364 border: 1px solid #999;
365 }
366
367 input[type=text], input[type=password] { height: 18px; }
368
369 div.scroll { height: 200px; overflow: auto;
370 border: 1px solid #ddd; }
371 div.scroll table { border: 0px solid #fff; }
372
373 #terminal {
374 background: #000;
375 color: #fff;
376 border: 1px solid #444;
377 min-height: 240px;
378 }
379
380 /* Round corner */
381
382 #loading, table, pre, input[type=submit], .debug, .box,
383 .button, div.scroll, .outbox, section {
384 -moz-border-radius: 4px;
385 -webkit-border-radius: 4px;
386 border-radius: 4px;
387 }
388
389 /* Help page */
390
391 #help { text-align: justify; }
392 #help a { color: #215090; text-decoration: underline; }
393 #help a:hover { text-decoration: none; color: blue; }
394
395 /* Footer */
396
397 #footer {
398 /* border-bottom: 1px solid #c1baad; */
399 height: 25px;
400 text-align: center;
401 padding: 40px 10px;
402 font-size: 11px;
403 color: #bbb;
404 }
405
406 #footer a { color: #bbb; }
407 #footer a:hover { color: #555; }
408
409 /* HTML5 Meter */
410 .meter {
411 height: 22px;
412 min-width: 200px;
413 cursor: default;
414 }
415 .meter meter {
416 height: inherit;
417 width: 100%;
418 display: block;
419 border: 1px solid #ddd;
420 border-radius: 4px;
421 }
422 .meter span {
423 height: 22px;
424 display: block;
425 white-space: nowrap;
426 position: absolute;
427 margin: -18px auto 0 2px;
428 }
429
430 a.button, input {
431 -webkit-transition: all 0.3s ease-in-out;
432 -moz-transition: all 0.3s ease-in-out;
433 -o-transition: all 0.3s ease-in-out;
434 -ms-transition: all 0.3s ease-in-out;
435 transition: all 0.3s ease-in-out;
436 }
437
438 /*section {
439 margin: 20pt -0.7em;
440 padding: 0.8em 0.7em 1.2em;
441 background-color: #fdfdfd;
442 border: 1px solid #ddd;
443 border-radius: 1em;
444 box-shadow: 0 0 3pt 2pt #eee;
445 }
446 section h4 {
447 margin: 0 0 0.5em 0;
448 }
449 section h3 {
450 margin: 0 0 0.5em 0; }
451 */