website annotate slitaz.css @ rev 1299

Add Blog to top menu - fix rss feeds and dl in website/cache
author Christophe Lincoln <pankso@slitaz.org>
date Sat Mar 25 00:32:07 2017 +0100 (2017-03-25)
parents f89b3d0e4b11
children 3f9491492ae2
rev   line source
pankso@1 1 /*
pascal@1243 2 CSS style for SliTaz Network - (C) 2015 SliTaz GNU/Linux
pankso@1 3 */
pankso@1 4
pankso@555 5 html {
pankso@710 6 min-height: 102%;
pankso@555 7 }
pankso@768 8
pankso@1 9 body {
pankso@555 10 background: #ffffff;
pankso@1 11 color: black;
pankso@1298 12 font: 100% sans-serif, vernada, arial;
pankso@1 13 margin: 0;
pankso@818 14 min-width: 780px;
pankso@815 15 height: 100%;
pankso@1 16 }
pankso@768 17
pankso@768 18 a { text-decoration: underline; color: #215090; }
pankso@1200 19 a:hover { text-decoration: none; }
pankso@768 20 img { border: 0pt none; vertical-align: middle; }
pankso@1299 21 h2 { color: #444; }
pankso@768 22 h3 { color: #666; font-size: 140%; }
pankso@768 23 h4 { color: #888; font-size: 120%; }
pankso@1200 24 h2, h3 { border-bottom: 1px dashed #afafaf; padding-bottom: 5px; }
pankso@1241 25 li { list-style-type: square; }
pankso@768 26 pre {
pankso@768 27 background-color: #f8f8f8;
pankso@768 28 border: 1px solid #ddd;
pankso@768 29 padding: 10px;
pankso@1 30 }
pankso@1 31
pankso@741 32 /* Header */
pankso@1 33
pankso@768 34 #header {
pankso@768 35 height: 40px;
pankso@1200 36 background: #111 url(images/logo.png) no-repeat left;
pankso@1 37 }
pankso@768 38
pankso@768 39 #header h1 {
pankso@768 40 margin: 0;
pankso@1200 41 padding: 8px 0 8px 42px;
pankso@1200 42 width: 280px;
pankso@1200 43 font-size: 20px;
pankso@1200 44 font-style: italic;
pankso@1 45 }
pankso@768 46
pankso@768 47 #header h1 a {
pankso@768 48 color: white;
pankso@768 49 text-decoration: none;
pankso@768 50 }
pankso@768 51
pankso@1175 52 #header h1 a:hover, #network a:hover, #network span {
pankso@1175 53 color: #afafaf;
pankso@768 54 }
pankso@768 55
pankso@1200 56 #searchbtn {
pankso@1200 57 position: absolute;
pankso@1200 58 right: 8px;
pankso@1200 59 top: 48px;
pankso@1200 60 }
pankso@1200 61
pankso@768 62 /* Logo */
pankso@768 63
pankso@1 64 #logo {
pankso@768 65 background: url(images/logo.png) no-repeat left;
pankso@1 66 position: absolute;
pankso@1 67 float: left;
pankso@768 68 left: 0px;
pankso@768 69 top: 0px;
pankso@768 70 width: 40px;
pankso@768 71 height: 40px;
pankso@1 72 }
pankso@1 73
pankso@768 74 /* SliTaz Network */
pankso@1 75
pankso@768 76 #network {
pankso@768 77 float: right;
pankso@1175 78 padding: 14px 5px 0;
pankso@555 79 font-size: 12px;
pankso@1 80 }
pankso@768 81
pankso@1175 82 #network a, #network span { padding: 0 4px; }
pankso@1175 83 #network span { font-weight: bold; }
pankso@768 84
pankso@768 85 /* Block */
pankso@768 86
pankso@768 87 #block {
pankso@1175 88 min-height: 180px;
pankso@1175 89 background: #ccc;
pankso@1175 90 padding: 20px 10% 0px;
pankso@768 91 text-align: center;
pankso@1044 92 color: #222;
pankso@1175 93 border-bottom: 1px solid #afafaf;
pankso@768 94 }
pankso@768 95
pankso@768 96 #block_info {
pankso@768 97 text-align: justify;
pankso@768 98 width: 48%;
pankso@768 99 padding: 10px 10px 0 0;
pankso@768 100 }
pankso@768 101
pankso@768 102 #block a, #network a {
pankso@1175 103 color: #fff;
pankso@555 104 font-weight: bold;
pankso@768 105 text-decoration: none;
pankso@555 106 }
pankso@768 107
pankso@768 108 #block h4 {
pankso@1175 109 color: #222;
pankso@768 110 margin: 0px;
pankso@768 111 font-weight: bold;
pankso@768 112 font-size: 110%;
pankso@768 113 }
pankso@768 114
pankso@768 115 #block_info p { margin: 6px 0; padding: 0 12px 0 0; }
pankso@1175 116 #block_info a { font-weight: normal; color: #215090; }
pankso@1175 117 #block_info a:hover { text-decoration: underline; }
pankso@768 118 #block ul { list-style-type: square; }
pankso@1175 119 #block_nav a:hover { color: #afafaf; }
pankso@768 120
pankso@768 121 /* Navigation */
pankso@768 122
pankso@768 123 #block_nav {
pankso@1175 124 background: #666;
pankso@1175 125 padding: 10px 10px 20px;
pankso@768 126 text-align: justify;
pankso@768 127 width: 48%;
pankso@768 128 float: right;
pankso@768 129 }
pankso@768 130
pankso@768 131 #block_nav ul {
pankso@768 132 list-style-type: none;
pankso@768 133 margin: 6px 0;
pankso@768 134 padding: 0;
pankso@768 135 }
pankso@768 136
pankso@784 137 #block_nav h4 img {
pankso@784 138 margin: 0 4px 0 0;
pankso@784 139 padding: 0;
pankso@784 140 }
pankso@784 141
pankso@1200 142 .dlbutton {
al@1279 143 display: inline-block;
al@1280 144 margin: 0.5ex;
pankso@1200 145 background: #333 url("/images/download-30.png") no-repeat 4px center;
pankso@1200 146 padding-left: 38px;
pankso@1200 147 -webkit-transition: background-color 0.6s;
pankso@1200 148 transition: background-color 0.5s;
pankso@1200 149 }
al@1280 150 .dldiv { margin: 30px 0; text-align: center; }
pankso@1200 151
pankso@1200 152 /*
pankso@1200 153 *
pankso@1200 154 *
pankso@1200 155 * Navigation NG
pankso@1200 156 *
pankso@1200 157 *
pankso@1200 158 * */
pankso@1200 159
pankso@1200 160 nav {
pankso@1200 161 min-height: 100px;
pankso@1200 162 background: #ddd;
pankso@1200 163 padding: 56px 6% 0;
pankso@1200 164 text-align: center;
pankso@1200 165 color: #222;
pankso@1200 166 border-bottom: 1px solid #afafaf;
pankso@1200 167 top: 40px;
pankso@1200 168 }
pankso@1200 169
pankso@1200 170 nav ul {
pankso@1200 171 margin: 0; padding: 0;
pankso@1200 172 list-style: none;
pankso@1200 173 }
pankso@1200 174 nav li { display: inline; }
pankso@1200 175
pankso@1200 176 nav a, .dlbutton {
pankso@1200 177 text-decoration: none;
pankso@1200 178 padding: 12px;
pankso@1200 179 color: #fff;
pankso@1200 180 font-weight: bold;
pankso@1200 181 vertical-align: middle;
pankso@1200 182 -webkit-transition: background-color 0.6s;
pankso@1200 183 transition: background-color 0.5s;
pankso@1200 184 }
pankso@1299 185 nav p { padding: 8px; color: #333; font-size: 90%; }
pankso@1200 186
pankso@1200 187 .nav1 { background-color: #333; }
pankso@1200 188 .nav1:hover { background-color: #128da9; }
pankso@1200 189 .nav2 { background-color: #ab3c00; }
pankso@1200 190 .nav2:hover { background-color: #ff9b00; }
pankso@1200 191 .navpi { background-color: #444; }
pankso@1200 192 .navpi:hover { background-color: #bc1142; }
pankso@1200 193
pankso@768 194 /* Languages */
pankso@768 195
pankso@768 196 #lang {
pankso@1200 197 padding: 8px;
pankso@1200 198 font-size: 12px;
pankso@1044 199 position: absolute;
pankso@1044 200 right: 0px;
pankso@1200 201 color: #666;
pankso@768 202 }
pankso@1200 203 #lang .flag { font-size: 14px; }
pankso@1200 204 #lang .flag:hover { text-decoration: none; }
pankso@768 205
pankso@1200 206 #lang a, #lang strong, #lang span {
pankso@1 207 text-decoration: none;
pankso@768 208 padding: 0 2px;
pankso@1 209 }
pankso@768 210
pankso@768 211 #lang a:hover {
pankso@768 212 text-decoration: underline;
pankso@1 213 }
pankso@768 214
pankso@1044 215 .box #lang { text-align: center; position: relative;
pankso@1044 216 font-size: 13px; } /* for /i18n page */
al@1033 217
pankso@768 218 /* Content */
pankso@768 219
pankso@768 220 #content {
pankso@768 221 padding: 30px 80px;
pankso@555 222 text-align: justify;
pankso@741 223 }
pankso@1241 224 #content li { line-height: 1.6em; }
pankso@741 225
pankso@809 226 .news li {
pankso@741 227 border-bottom: 1px dotted #BEBEBE;
pankso@741 228 margin-left: -25px;
pankso@741 229 padding: 4px 0px 4px 0px;
pankso@741 230 }
pankso@741 231
pankso@809 232 .news a, .feed-grid a { text-decoration: none; }
pankso@809 233 .news p a { text-decoration: underline; }
pankso@809 234 .news p a:hover { text-decoration: none; }
pankso@1171 235 #twitter { margin: 20px 0; text-align: center; }
pankso@768 236 #gallery { text-align: center; }
pankso@741 237
pankso@945 238 #sponsor {
pankso@945 239 font-size: 90%;
pankso@975 240 background-color: #fbfbfb;
pankso@975 241 border: 2px solid #ddd;
pankso@945 242 width: 200px;
pankso@1267 243 height: 140px;
pankso@945 244 float: right;
pankso@945 245 text-align: center;
pankso@1241 246 margin: 20px 0px 20px 20px;
pankso@945 247 }
pankso@945 248
pankso@768 249 /* Classes */
pankso@768 250
pankso@1200 251 .mobile { display: none !important; }
pankso@1200 252
pankso@768 253 .right_box { width: 48%; float: right; }
pankso@768 254 .left_box { width: 48%; float: left; }
pankso@768 255
pankso@768 256 .box {
pankso@741 257 margin: 20px 60px;
pankso@741 258 padding: 12px;
pankso@768 259 background: #efefef;
pankso@768 260 border: 1px solid #ddd;
pankso@768 261 }
pankso@768 262
al@1032 263 .box-dl, .box-up {
pankso@1200 264 margin: 20px 0;
al@1019 265 min-height: 48px;
al@1019 266 border: 1px solid #ddd;
al@1019 267 vertical-align: middle;
al@1019 268 }
al@1032 269 .box-dl {
pankso@1200 270 background: url("/images/download.png") no-repeat 12px center;
pankso@1200 271 padding: 16px 16px 16px 72px;
al@1032 272 }
al@1032 273 .box-up {
pankso@1200 274 background: url("/images/update.png") no-repeat 12px center;
pankso@1200 275 padding: 16px 16px 16px 62px;
al@1032 276 }
pankso@1200 277 .box-dl a { font-weight: bold; text-decoration: none; }
pankso@1200 278 .dlbutton { padding-left: 38px; }
pankso@1200 279 pre, .box, .box-dl, .box-up, .box-share, .box-rpi {
pankso@1200 280 background-color: #efefef;
pankso@1200 281 border: 1px solid #ddd;
pankso@1200 282 }
al@1019 283
pankso@768 284 .searchbox {
pankso@768 285 margin: 20px 80px;
pankso@768 286 padding: 12px;
pankso@741 287 background: #f8f8f8;
pankso@768 288 text-align: center;
pankso@768 289 border: 1px solid #ddd;
pankso@741 290 }
pankso@768 291
pankso@796 292 /* Activity Box */
pankso@796 293
pankso@796 294 .activity {
pankso@796 295 margin: 0 0 20px;
pankso@945 296 background: #efefef;
pankso@807 297 padding: 5px 2px 0;
pankso@796 298 border: 1px solid #ddd;
pankso@796 299 }
pankso@807 300 .activity div { padding: 5px 10px; background: #fff; margin-top: 5px; }
pankso@796 301 .activity p { margin: 0; padding: 5px 10px; font-weight: bold; }
pankso@796 302 .activity a { text-decoration: none; }
pankso@1241 303 .activity ul { margin: 4px 0; padding: 0 4px; line-height: 150%; }
pankso@1241 304 .activity li { list-style-type: none; }
pankso@796 305 .activity_more { text-align: right; }
pankso@796 306 .activity_more a { font-weight: normal; color: #000; padding: 0 4px; }
pankso@796 307 .activity_more a:hover { text-decoration: underline; }
pankso@768 308
pankso@809 309 .activity span, .news span {
pankso@809 310 color: #666;
pankso@809 311 font-size: 11px;
pankso@809 312 font-weight: normal;
pankso@809 313 }
pankso@809 314
pankso@768 315 /* Button */
pankso@768 316
pankso@1175 317 #block_info .button a {
pankso@1175 318 background-color: #666;
pankso@768 319 color: #ffffff;
pankso@1175 320 margin: 0px 4px;
pankso@768 321 padding: 6px 10px;
pankso@768 322 font-size: 12px;
pankso@768 323 text-decoration: none;
pankso@768 324 font-weight: bold;
pankso@741 325 }
pankso@1175 326 #block_info .button a:hover, input[type=submit]:hover {
pankso@1175 327 background-color: #444;
pankso@768 328 color: #ffffff;
pankso@741 329 }
pankso@768 330
pankso@768 331 /* Round corner */
pankso@768 332
pankso@1200 333 #block_nav, pre, .box, .box-dl, .box-up, .searchbox, .button a,
pankso@1200 334 #twitter, .activity, .activity div, #sponsor, nav a, .dlbutton {
pankso@768 335 -moz-border-radius: 4px;
pankso@768 336 -webkit-border-radius: 4px;
pankso@768 337 border-radius: 4px;
pankso@741 338 }
pankso@768 339
pankso@768 340 /* Form */
pankso@768 341
pankso@715 342 input[type=submit] {
pankso@1175 343 border: 1px solid #666;
pankso@1175 344 background-color: #666;
pankso@715 345 color: white;
pankso@715 346 font-weight: bold;
pankso@715 347 cursor: pointer;
pankso@768 348 padding: 4px 10px;
pankso@715 349 font-size: 14px;
pankso@734 350 margin-left: -5px;
pankso@768 351 -webkit-border-top-right-radius: 4px;
pankso@768 352 -webkit-border-bottom-right-radius: 4px;
pankso@768 353 -moz-border-radius-topright: 4px;
pankso@768 354 -moz-border-radius-bottomright: 4px;
pankso@768 355 border-top-right-radius: 4px;
pankso@768 356 border-bottom-right-radius: 4px;
pankso@715 357 }
pankso@768 358
pankso@1175 359 input[type=submit]:hover { background-color: #444; }
pankso@768 360
pankso@715 361 input[type=text] {
pankso@715 362 border: 1px solid #333333;
pankso@768 363 padding: 4px;
pankso@768 364 height: 17px;
pankso@737 365 width: 100%;
pankso@768 366 -webkit-border-top-left-radius: 4px;
pankso@768 367 -webkit-border-bottom-left-radius: 4px;
pankso@768 368 -moz-border-radius-topleft: 4px;
pankso@768 369 -moz-border-radius-bottomleft: 4px;
pankso@768 370 border-top-left-radius: 4px;
pankso@768 371 border-bottom-left-radius: 4px;
pankso@715 372 }
pankso@715 373
pankso@710 374 /* Footer */
pankso@710 375
pankso@710 376 #footer {
pankso@768 377 background: #f1f1f1;
pankso@768 378 text-align: center;
pankso@768 379 border-top: 1px solid #ddd;
pankso@768 380 padding: 40px;
pankso@768 381 color: #666;
pankso@814 382 clear: both;
pankso@814 383 margin-bottom: -2%;
pankso@710 384 }
pankso@768 385
pankso@768 386 #footer a { color: #666; padding: 0 2px; }
pankso@741 387
pankso@741 388 .year:after {
pascal@1243 389 /* content: "2007-2015"; */
pascal@1243 390 content: "2015";
pankso@710 391 }
al@1019 392
al@1019 393 p, li {
al@1019 394 -moz-hyphens: auto;
al@1019 395 -webkit-hyphens: auto;
al@1019 396 hyphens: auto;
al@1019 397 }
al@1019 398
al@1019 399 /* --- SEARCH --- */
al@1019 400
al@1019 401 input.gsc-search-button {
al@1019 402 border: 1px solid #b64b22;
al@1019 403 background-color: #b64b22;
al@1019 404 color: white;
al@1019 405 font-weight: bold;
al@1019 406 cursor: pointer;
al@1019 407 padding: 2px 10px;
al@1019 408 font-size: 14px;
al@1019 409 margin-left: -4px;
al@1019 410 -webkit-border-top-right-radius: 4px;
al@1019 411 -webkit-border-bottom-right-radius: 4px;
al@1019 412 -moz-border-radius-topright: 4px;
al@1019 413 -moz-border-radius-bottomright: 4px;
al@1019 414 border-top-right-radius: 4px;
al@1019 415 border-bottom-right-radius: 4px;
al@1019 416 }
al@1019 417
al@1019 418 .gs-webResult.gs-result a.gs-title:link,
al@1019 419 .gs-webResult.gs-result a.gs-title:link b {
al@1019 420 color: #103a5e;
al@1019 421 }
al@1019 422
al@1023 423 #cse {
al@1023 424 margin-bottom: 120px;
al@1023 425 width:100%;
al@1023 426 }
al@1019 427
al@1019 428
al@1019 429 /* --- GALLERY --- */
al@1019 430
al@1019 431 #gallery div {
al@1019 432 width: 496px;
al@1019 433 border: none;
al@1019 434 border-radius: 12px;
al@1019 435 padding-bottom: 8px;
al@1019 436 margin: 12px auto;
pascal@1255 437 -webkit-box-shadow: 0 0 6px rgba(0,0,0,0.5);
al@1019 438 -moz-box-shadow: 0 0 6px rgba(0,0,0,0.5);
al@1019 439 box-shadow: 0 0 6px rgba(0,0,0,0.5);
al@1019 440 }
al@1019 441 #gallery img {
al@1019 442 width: 480px;
al@1019 443 margin: 8px;
al@1019 444 }