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

pkgs.cgi: Smaller button and better CSS integration
author Christophe Lincoln <pankso@slitaz.org>
date Wed Apr 13 12:40:15 2011 +0200 (2011-04-13)
parents 7ac8e561d0a5
children 67f880abcf5e
line source
1 /*
2 CSS style for TazPanel - (C) 2011 SliTaz GNU/Linux
3 */
4
5 /* To always have a scroll bar */
6 html {
7 min-height: 102%;
8 }
9
10 body {
11 background: #ffffff;
12 color: black;
13 font: 13px sans-serif, vernada, arial;
14 margin: 25px 0 0;
15 }
16
17 h1 { color: #d66018; padding: 10px 0 0 40px;}
18 h2 { color: #444; margin: 10px 0 10px; }
19 h3 { color: #666; font-size: 140%; }
20 h4 { color: #888; font-size: 120%; margin: 10px 0 5px; }
21 img { border: 0pt none; vertical-align: middle; padding: 0px 6px 2px 0;}
22 p { margin: 6px 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: 52px;
32 border-bottom: 1px dotted #ddd;
33 }
34
35 /* Desktop gui style bar */
36
37 #toolbar {
38 position: fixed;
39 top: 0;
40 left: 0;
41 height: 24px;
42 width: 100%;
43 padding: 0;
44 background-color: #f1efeb;
45 border-bottom: 1px solid #c1baad;
46 z-index: 200;
47 cursor: default;
48 }
49
50 #menu { margin: 4px 8px; }
51 #menu a { padding: 2px 4px; color: #000;
52 cursor: default; }
53 #menu a:hover { color: #444; }
54 #icons { margin: 2px 8px; float: right; }
55 #icons img { padding: 0; }
56
57 #loading {
58 /* font-weight: bold; */
59 background-color: #f8f8f8;
60 border: 1px solid #ddd;
61 color: #666;
62 cursor: progress;
63 position: fixed;
64 top: 92px;
65 right: 120px;
66 width: 248px;
67 padding: 4px 4px 2px;
68 }
69
70 /* Blocks */
71
72 #block { float: left; }
73
74 /* Sidebar menus */
75
76 #sidebar {
77 position: fixed;
78 top: 102px;
79 right: 5px;
80 width: 116px;
81 }
82
83 #sidebar a {
84 display: block;
85 padding: 0px 0 0px 12px;
86 margin: 0;
87 }
88
89 #sidebar a.active {
90 color: #000;
91 font-weight: bold;
92 }
93
94 #sidebar h4 { margin: 0 0 2px 12px; }
95 #sidebar ul { list-style-type: none; padding: 0; }
96
97 /* Content */
98
99 #content { margin: 20px 40px 20px 40px; }
100 #content-sidebar { margin: 20px 120px 20px 40px; }
101 #wrapper { margin: 10px 0 20px; }
102
103 .search {
104 position: absolute;
105 right: 40px;
106 top: 32px;
107 }
108
109 .search input[type=submit] {
110 padding: 4px;
111 margin-left: -4px;
112 background-color: #f1f1f1;
113 border: 1px solid #ddd;
114 cursor: pointer;
115 color: #000;
116 font-weight: bold;
117 border-radius: 0px;
118 }
119
120 .search input[type=submit].radius {
121 border-top-right-radius: 4px;
122 border-bottom-right-radius: 4px;
123 border-top-left-radius: 0px;
124 border-bottom-left-radius: 0px;
125 }
126
127 .search input[type=text] {
128 border: 1px solid #ddd;
129 padding: 4px;
130 height: 17px;
131 margin: 0;
132 width: 200px;
133 border-top-left-radius: 4px;
134 border-bottom-left-radius: 4px;
135 }
136
137 #actions {
138 height: 20px;
139 margin: 16px 0;
140 }
141
142 .box {
143 margin: 10px 0;
144 padding: 12px;
145 background: #f8f8f8;
146 border: 1px solid #ddd;
147 }
148
149 .debug {
150 position: fixed;
151 bottom: 0px;
152 right: 10px;
153 left: 10px;
154 margin: 5px;
155 padding: 4px 10px;
156 background-color: #111;
157 color: #fff;
158 border: 0;
159 font-size: 12px;
160 opacity: 0.9;
161 }
162
163 .float-left { float: left; }
164 .float-right { float: right; }
165
166 /* Table */
167
168 table {
169 background-color: #f8f8f8;
170 border: 1px solid #ddd;
171 padding: 10px;
172 width: 100%;
173 margin: 0 0 6px 0;
174 }
175
176 table a { color: #000; }
177 table a:hover { color: #666; }
178 td.small { min-width: 60px; }
179 td.pkg { max-width: 160px; }
180 td.desc { max-width: 300px; }
181
182 #thead, .thead, thead {
183 height: 10px;
184 font-weight: bold;
185 }
186
187 /* syntax_highlighter */
188
189 span.conf-comment { color: #666; }
190 span.conf-var { color: #392600; }
191 span.conf-val, span.sh-val { color: #f35a00; }
192 span.sh-comment { color: #b20000; }
193
194 /* Misc */
195
196 pre, .pre-main {
197 background-color: #f8f8f8;
198 border: 1px solid #ddd;
199 padding: 10px;
200 margin: 10px 0;
201 overflow: auto;
202 }
203
204 .pre-main { margin: 16px 0; }
205
206 input[type=submit], select, .button {
207 padding: 4px;
208 margin: 0;
209 background-color: #f1f1f1;
210 border: 1px solid #ddd;
211 cursor: pointer;
212 color: #000;
213 }
214
215 input[type=submit]:hover, select:hover, .button:hover {
216 background-color: #ddd;
217 border: 1px solid #999;
218 }
219
220 input[type=text], input[type=password] { height: 18px; }
221
222 div.scroll { height: 200px; overflow: auto;
223 border: 1px solid #ddd; }
224 div.scroll table { border: 0px solid #fff; }
225
226 /* Round corner */
227
228 #loading, table, pre, input[type=submit], .debug, .box,
229 .button, div.scroll {
230 /*-moz-border-radius: 4px;
231 -webkit-border-radius: 4px; */
232 border-radius: 4px;
233 }
234
235 /* Footer */
236
237 #footer {
238 /* border-bottom: 1px solid #c1baad; */
239 height: 25px;
240 text-align: center;
241 padding: 40px 10px;
242 font-size: 11px;
243 }