slitaz-forge view mirror/root/static/slitaz.css @ rev 601
mirror: fixes to previous commit
| author | Aleksej Bobylev <al.bobylev@gmail.com> |
|---|---|
| date | Sat Oct 10 14:22:49 2015 +0300 (2015-10-10) |
| parents | d3a31a897d56 |
| children | 8f7ddeaffa3b |
line source
1 /*
2 CSS style for SliTaz Network - (C) 2015 SliTaz GNU/Linux
3 */
5 html {
6 min-height: 102%;
7 }
8 body {
9 height: 100%;
10 margin: 0;
11 box-sizing: border-box;
12 color: #222;
13 background: #fff;
14 font: 13px Ubuntu, "Droid Sans", "DejaVu Sans", FreeSans, "Liberation Sans", sans-serif;
15 -moz-hyphens: auto; -epub-hyphens: auto; -webkit-hyphens: auto; hyphens: auto;
16 }
17 code, pre, samp, kbd {
18 color: #000;
19 background-color: rgba(0, 0, 0, .05);
20 }
21 a {
22 text-decoration: none;
23 color: #215090;
24 }
25 a:hover {
26 text-decoration: underline;
27 }
28 img {
29 border: 0 none;
30 vertical-align: middle;
31 }
32 h2 {
33 color: #444;
34 font-size: 26px;
35 font-weight: 300;
36 margin: 26px 0 13px;
37 border-bottom: 2px solid #999;
38 letter-spacing: 1px;
39 }
40 h3 {
41 color: #666;
42 font-size: 19px;
43 font-weight: 300;
44 margin: 26px 0 0;
45 line-height: 1;
46 letter-spacing: .5px;
47 }
48 pre {
49 background-color: #F8F8F8;
50 border: 1px solid #DDD;
51 padding: 10px;
52 white-space: pre-wrap;
53 overflow-x: auto;
54 line-height: 1;
55 }
56 table {
57 background-color: #F8F8F8;
58 border: 1px solid #DDD;
59 width: 100%;
60 margin-bottom: 20px;
61 padding: 6px;
62 }
65 /* Page header */
67 body > header {
68 display: table;
69 width: 100%;
70 vertical-align: middle;
71 min-height: 40px;
72 background: #222;
73 }
75 h1 {
76 display: table-cell;
77 height: 40px;
78 vertical-align: middle;
79 line-height: 20px;
80 white-space: nowrap;
81 }
82 h1::before {
83 display: inline-block;
84 content: url(logo.png);
85 vertical-align: middle;
86 }
87 h1 a {
88 color: #FFF;
89 font-size: 20px;
90 font-style: italic;
91 }
96 /* SliTaz Network */
98 #network {
99 display: table-cell;
100 text-align: right;
101 vertical-align: middle;
102 font-size: 12px;
103 }
105 #network a {
106 display: inline-block;
107 padding: 0 6px;
108 vertical-align: middle;
109 }
110 .home::before {
111 content: url(home.png);
112 }
115 /* Country flags */
117 .br::before { content: url(BR.png); }
118 .ch::before { content: url(CH.png); }
119 .de::before { content: url(DE.png); }
120 .fr::before { content: url(FR.png); }
121 .it::before { content: url(IT.png); }
122 .pl::before { content: url(PL.png); }
123 .us::before { content: url(US.png); }
127 /* Block */
129 #block {
130 padding: 30px 6px;
131 background: #CCC;
132 }
133 #block div {
134 max-width: 600px;
135 margin: 0 auto;
136 }
137 #block_info {
138 padding: 6px 12px 0 0;
139 }
140 #block_info input {
141 width: 100%;
142 }
143 #block a,
144 #network a {
145 color: #FFF;
146 }
147 #block header {
148 font-weight: 400;
149 font-size: 18px;
150 line-height: 18px;
151 }
153 #block_info p {
154 margin: 7px 0;
155 padding: 0;
156 text-align: justify;
157 }
158 #block_info a {
159 font-weight: 400;
160 color: #B51;
161 }
166 /* Navigation */
168 nav {
169 background: #666; color: #fff;
170 padding: 6px;
171 width: 40%;
172 }
173 nav a {
174 white-space: nowrap;
175 }
177 nav header img {
178 margin: 0 4px 0 0;
179 padding: 0;
180 }
181 nav,
182 #block_info {
183 display: table-cell;
184 }
188 /* Languages */
190 #lang {
191 margin: 0;
192 text-align: right;
193 padding: 6px;
194 font-size: 11px;
195 }
196 #lang a {
197 padding: 0 2px;
198 }
201 /* Content */
203 #content {
204 max-width: 600px;
205 margin: 6px auto;
206 padding: 0 6px;
207 text-align: justify;
208 line-height: 1.5rem;
209 }
211 .news li {
212 list-style-type: square;
213 border-bottom: 1px dotted #BEBEBE;
214 margin-left: -25px;
215 padding: 4px 0;
216 }
218 #twitter {
219 margin: 20px 0;
220 }
221 #gallery {
222 text-align: center;
223 }
224 #sponsor {
225 font-size: 90%;
226 background-color: #FBFBFB;
227 border: 2px solid #DDD;
228 width: 200px;
229 height: 160px;
230 float: right;
231 text-align: center;
232 margin: 10px 0 20px 20px;
233 }
236 /* Mirrors list */
238 #mirrors {
239 padding: 10px;
240 margin: 10px 0 20px;
241 text-align: center;
242 background: #F1F1F1;
243 border: 1px solid #DDD;
244 }
245 #mirrors a,
246 #mirrors a::before {
247 display: inline-block;
248 padding: 0 3px;
249 }
250 #mirrors a::before {
251 vertical-align: -4px;
252 }
256 /* Classes */
258 .right_box {
259 width: 48%;
260 float: right;
261 }
262 .left_box {
263 width: 48%;
264 float: left;
265 }
266 .box {
267 margin: 20px 60px;
268 padding: 12px;
269 background: #EFEFEF;
270 border: 1px solid #DDD;
271 }
272 .searchbox {
273 margin: 20px 80px;
274 padding: 12px;
275 background: #F8F8F8;
276 text-align: center;
277 border: 1px solid #DDD;
278 }
281 /* Activity Box */
283 .activity {
284 margin: 0 0 20px;
285 background: #EFEFEF;
286 padding: 5px 2px 0;
287 border: 1px solid #DDD;
288 }
289 .activity div {
290 padding: 5px 10px;
291 background: #FFF;
292 margin-top: 5px;
293 }
294 .activity p {
295 margin: 0;
296 padding: 5px 10px;
297 font-weight: 700;
298 }
299 .activity ul {
300 list-style-type: none;
301 margin: 4px 0;
302 padding: 0 4px;
303 line-height: 150%;
304 }
305 .activity_more {
306 text-align: right;
307 }
308 .activity_more a {
309 font-weight: 400;
310 color: #000;
311 padding: 0 4px;
312 }
313 .activity span,
314 .news span {
315 color: #666;
316 font-size: 11px;
317 font-weight: 400;
318 }
321 /* Round corner */
323 nav, pre, table, textarea, select,
324 .box, .searchbox, .activity, .activity div,
325 #twitter, #sponsor, #mirrors {
326 -moz-border-radius: 4px;
327 -webkit-border-radius: 4px;
328 border-radius: 4px;
329 }
332 /* Page footer */
334 body > footer {
335 background: #F1F1F1;
336 text-align: center;
337 border-top: 1px solid #DDD;
338 padding: 30px;
339 color: #666;
340 clear: both;
341 margin-bottom: -2%;
342 }
343 footer a + a {
344 margin: 0 6px;
345 }
346 .year:after {
347 /* content: "2007-2015"; */
348 content: "2015";
349 }
352 /* Mirror file table */
354 table {
355 border-collapse: collapse;
356 line-height: 1;
357 }
358 caption {
359 caption-side: bottom;
360 text-align: left;
361 padding: 6px 0;
362 }
363 thead tr {
364 background-color: #DDD;
365 }
366 th {
367 padding: 4px 1px;
368 }
369 th:nth-child(3),
370 td:nth-child(3) {
371 text-align: right;
372 }
373 td:nth-child(1) {
374 vertical-align: middle;
375 }
377 tbody tr:nth-child(odd) {
378 background-color: #FFF;
379 }
380 tbody tr:nth-child(even) {
381 background-color: #EEE;
382 }
385 /* More space for touch links */
387 .touch td, .touch th {
388 padding: 6px;
389 }
390 .touch #network a,
391 .touch nav a,
392 .touch #mirrors a,
393 .touch footer a {
394 display: inline-block;
395 padding: 6px;
396 }
399 /* Mimetype icons */
401 td:nth-child(1)::before {
402 display: inline-block;
403 vertical-align: middle;
404 padding-right: 3px;
405 }
406 .x-bzip::before { content: url(application-x-bzip.png); }
407 .x-gzip::before { content: url(application-x-gzip.png); }
408 .plain::before { content: url(text-plain.png); }
409 .x-bittorrent::before { content: url(application-x-bittorrent.png); }
410 .octet-stream::before { content: url(application-octet-stream.png); }
411 .jpeg::before { content: url(image-jpeg.png); }
412 .png::before { content: url(image-png.png); }
413 .javascript::before { content: url(text-x-javascript); }
414 .css::before { content: url(text-css.png); }
415 .dir::before { content: url(folder.png); }
416 .up::before { content: url(go-up.png); }
417 .zip::before { content: url(application-zip.png); }
418 .iso::before { content: url(application-x-cd-image.png); }
419 .krn::before { content: url(application-x-executable.png); }
420 .exe::before { content: url(application-x-ms-dos-executable.png); }
421 .rme::before { content: url(text-x-readme.png); }
422 .log::before { content: url(text-x-changelog.png); }
423 .pkg::before { content: url(package-x-generic.png); }
426 /* Lists */
428 ul ul, ol ol, ul ol, ol ul { margin: 0; }
429 ul, ol, dd { padding: 0 0 0 21px; }