slitaz-forge view scn/style.css @ rev 688

scn: bigger font (match website)
author Christophe Lincoln <pankso@slitaz.org>
date Sat Mar 25 00:01:52 2017 +0100 (2017-03-25)
parents 4a422b8e9883
children
line source
1 /* CSS style for SliTaz Bugs/TinyCM */
2
3 html { min-height: 102%; }
4 body { font: 100% sans-serif, vernada, arial; margin: 0; }
5 h1 { margin: 0; padding: 8px; color: #fff; font-size: 20px; }
6 h1 a { color: #fff; text-decoration: none; }
7 h2 { color: #444; } h3 { color: #666; font-size: 140%; }
8 a { text-decoration: underline; color: #215090; }
9 pre a { text-decoration: none; }
10 a:hover { text-decoration: none; }
11 img { border: 0pt none; vertical-align: middle; }
12 pre {
13 overflow: auto;
14 font-size: 98%;
15 }
16 textarea, table { width: 100%; }
17 thead { font-weight: bold; }
18
19 /* Header */
20
21 #header {
22 background: #111 url(images/logo.png) no-repeat left;
23 height: 40px;
24 }
25
26 #header h1 {
27 margin: 0;
28 padding: 8px 0 0 42px;
29 width: 250px;
30 }
31
32 #header h1 a {
33 color: white;
34 text-decoration: none;
35 font-size: 20px;
36 font-style: italic;
37 }
38
39 #header h1 a:hover {
40 color: #afafaf;
41 }
42
43 /* Header links */
44
45 #network {
46 float: right;
47 padding: 14px 5px 0;
48 font-size: 12px;
49 margin-right: 100px;
50 }
51
52 #network a, #network span {
53 padding: 0 4px;
54 color: #fff;
55 font-weight: bold;
56 text-decoration: none;
57 }
58
59 #network a:hover, #user a:hover, #network span { color: #afafaf; }
60
61 /* Logo */
62
63 #logo {
64 background: url(images/logo.png) no-repeat left;
65 position: absolute;
66 float: left;
67 left: 0px;
68 top: 0px;
69 width: 40px;
70 height: 40px;
71 }
72
73 /* Login and user box */
74
75 #login { width: 240px; float: left; height: 120px; }
76
77 #login input[type="text"], #login input[type="password"] {
78 width: 200px; }
79
80 #signup input[type="text"], #signup input[type="password"] {
81 width: 400px; }
82
83 #login input[type="submit"] { float: none; }
84 #login p { display: inline; }
85
86 #user {
87 background-color: #222;
88 padding: 4px;
89 width: 84px;
90 float: right;
91 font-size: 12px;
92 position: absolute;
93 right: 10px;
94 top: 6px;
95 }
96 #user a { padding: 0 2px; color: #fff;
97 font-weight: bold; text-decoration: none; }
98
99 #account-info { width: 380px; height: 120px; float: right; }
100
101 /* Navigation */
102
103 nav {
104 min-height: 54px;
105 background: #ddd;
106 padding: 30px 6% 0;
107 text-align: center;
108 color: #222;
109 border-bottom: 1px solid #afafaf;
110 margin-bottom: 20px;
111 top: 40px;
112 }
113
114 nav ul {
115 margin: 0; padding: 0;
116 list-style: none;
117 }
118 nav li { display: inline; }
119
120 nav a, nav form {
121 text-decoration: none;
122 padding: 12px;
123 color: #fff;
124 font-weight: bold;
125 vertical-align: middle;
126 -webkit-transition: background-color 0.6s;
127 transition: background-color 0.6s;
128 }
129 nav p { padding: 8px; color: #333; font-size: 90%; }
130
131 nav input { padding: 0px;}
132 .nav1 { background-color: #333; }
133 .nav1:hover { background-color: #128da9; }
134 .nav2 { background-color: #ab3c00; }
135 .nav2:hover { background-color: #ff9b00; }
136 .navpi { background-color: #444; }
137 .navpi:hover { background-color: #bc1142; }
138
139
140 /* Languages */
141
142 #lang {
143 position: absolute;
144 right: 0;
145 top: 152px;
146 padding: 6px;
147 font-size: 12px;
148 }
149
150 #lang a {
151 text-decoration: none;
152 padding: 0 2px;
153 }
154
155 #lang a:hover {
156 text-decoration: underline;
157 }
158
159 /* Search */
160
161 #search {
162 position: absolute;
163 right: 20px;
164 top: 72px;
165
166 }
167
168 #search input[type="text"] { width: 180px; }
169
170 /* Content */
171
172 #content {
173 margin: 40px auto;
174 padding: 0 20px;
175 text-align: justify;
176 max-width: 680px;
177 font: 100% sans-serif, vernada, arial;
178 }
179
180 #edit textarea { width: 100%; height: 240px; background: #f8f8f8; }
181 #edit a { text-decoration: none; }
182
183 .box, pre, #login, #account-info {
184 background-color: #f8f8f8;
185 border: 1px solid #ddd;
186 padding: 10px;
187 }
188
189 pre img { margin: 4px 4px 4px 0px; }
190 #content p img { display: block;
191 margin: 0 auto; }
192
193 .mobile { display: none !important; }
194 .error { color: red; }
195 .ok { color: green; }
196 .date { color: #666; font-size: 96%; }
197
198 /* Progress bar */
199
200 .pct { background: #9dff4a; padding: 2px 4px; }
201
202 .pctbar {
203 margin: 0;
204 color: #666;
205 background: #f1f1f1;
206 border: 1px solid #ddd;
207 overflow: hidden;
208 clear: both;
209 }
210
211 /* Form */
212
213 form { display: inline; }
214 textarea { border: 2px solid #ccc; padding: 4px; width: 100%; }
215 select { min-width: 180px; }
216 input[type="submit"], input[type="text"], input[type="password"],
217 select, #tools a {
218 color: #444444;
219 border: 1px solid #cccccc;
220 padding: 4px;
221 margin: 4px 0px;
222 font-size: 14px;
223 line-height: 1.2em;
224 background-image: -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
225 background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
226 -webkit-appearance: none;
227 -webkit-padding-end: 12px;
228 -webkit-padding-start: 6px;
229 }
230
231 input[type="text"], input[type="password"] {
232 background: #fefefe; border: 2px solid #ccc;
233 width: 100%; }
234 /*input[type="file"] { border: 2px solid #ddd; }*/
235 /*input[type="checkbox"] { background: #fefefe; }*/
236
237 /* Be compatible with old FF and Webkit version. */
238 input[type="submit"] {
239 -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
240 -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
241 box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
242 }
243
244 input[type="submit"]:hover, #tools a:hover {
245 cursor: pointer;
246 color: black;
247 }
248
249 select {
250 background-image: url(images/down.png),
251 -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
252 background-position: center right;
253 background-repeat: no-repeat;
254 }
255
256 #tools {
257 padding-top: 10px;
258 margin: 20px 0px;
259 /*border-top: 1px dotted #ccc;
260 position: fixed;
261 bottom: 10px;*/
262 }
263 #tools a { text-decoration: none; }
264
265 /* Round corner */
266
267 pre, .button, .pctbar, .box, #login, #account-info, #user, img,
268 input, textarea, select, #tools a, nav a, #cloud-upload, .wall-message {
269 -moz-border-radius: 4px;
270 -webkit-border-radius: 4px;
271 border-radius: 4px;
272 }
273
274 /* notes */
275
276 .noteclassic,.noteimportant,.notewarning,.notetip {
277 margin:2em;
278 margin-left:auto;
279 margin-right:auto;
280 width:70% !important;
281 min-height:40px;
282 clear:both;
283 text-align:justify;
284 vertical-align:middle;
285 border-collapse:collapse;
286 padding:15px 20px 15px 80px;
287 background-position:20px 50%;
288 background-repeat:no-repeat;
289 -moz-border-radius:20px;
290 -khtml-border-radius:20px;
291 border-radius:20px;
292 }
293
294 .noteclassic {
295 background-color:#eef;
296 background-image:url(images/note.png);
297 }
298
299 .noteimportant {
300 background-color:#ffc;
301 background-image:url(images/important.png);
302 }
303
304 .notewarning {
305 background-color:#fdd;
306 background-image:url(images/warning.png);
307 }
308
309 .notetip {
310 background-color:#dfd;
311 background-image:url(images/tip.png);
312 }
313
314 /* Footer */
315
316 #footer {
317 text-align: center;
318 padding: 20px;
319 border-top: 1px solid #ddd;
320 font-size: 90%;
321 }
322
323 #footer a { padding: 0 2px; }
324
325 /*
326 *
327 * Plugins CSS Styles
328 *
329 */
330
331 /* Blog */
332 .post-tools {
333 border-top: 1px dotted #ddd;
334 border-bottom: 1px dotted #ddd;
335 padding: 4px 0; }
336 .post-tools a { text-decoration: none; }
337 .post-tools a:hover { text-decoration: underline; }
338
339 /* Forum */
340 #hashtags { font-size: 16px; font-weight: bold; }
341 #hashtags a { text-decoration: none; padding: 0 4px; }
342 .topic { padding: 6px; margin: 4px; }
343 .topic span a { text-decoration: none; color: #666;
344 font-weight: bold; padding-left: 2px; }
345 .forum-msg { background-color: #eee; padding: 10px;
346 border: 2px solid #ddd; width: 98%;}
347
348 /* Cloud */
349 #cloud-upload {
350 text-align: center;
351 color: #444444;
352 border: 1px solid #cccccc;
353 padding: 0px;
354 margin: 4px 0px;
355 background-image: -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
356 background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
357 }
358
359 #cloud-upload input[type="file"] {
360 border: 0px solid #cccccc;
361 width: 85%;
362 -webkit-appearance: none;
363 -webkit-padding-end: 0px;
364 -webkit-padding-start: 0px;
365 }
366
367 /* Community */
368 #wall-form textarea { height: 50px; background: #f8f8f8; }
369 .wall-message {
370 border: 1px solid #ddd;
371 background: #fafafa;
372 margin: 20px 0;
373 padding: 0;
374 }
375 .wall-message div {
376 padding: 10px 0 0 10px;
377 }
378 .wall-message p {
379 border-top: 1px solid #eee;
380 padding: 10px;
381 }
382
383 /* Users & Dashboard */
384 #users table, #plugins table { border-collapse: collapse; }
385 #users tr, #plugins tr {
386 padding:.3em 1em;
387 border-bottom: 1px solid #ddd;
388 }
389 #users td, #plugins td { padding: 4px 0; }
390
391 /*
392 *
393 * SUP CSS Style with receip support, upload, confirm, pkg list, etc
394 *
395 */
396
397 .comment { color: #a00; }
398 .value { color: #e50; }
399 .var { color: #05a; }
400 .color32 { color: green; }
401 .float-right { float: right; }