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