website annotate slitaz.css @ rev 678

Improve home page with last commit and pkgs + use PHP
author Christophe Lincoln <pankso@slitaz.org>
date Sun Nov 07 14:42:03 2010 +0100 (2010-11-07)
parents 0ae6cfc85e03
children 772b09e644ea
rev   line source
pankso@1 1 /*
pankso@1 2 CSS style for SliTaz GNU/Linux website
pankso@1 3 www.slitaz.org - (c) 2007 Pankso
pankso@1 4 */
pankso@1 5
pankso@555 6 html {
pankso@555 7 height: 102%;
pankso@555 8 }
pankso@555 9
pankso@1 10 body {
pankso@555 11 background: #ffffff;
pankso@1 12 color: black;
pankso@1 13 font: 13px sans-serif, vernada, arial;
pankso@1 14 margin: 0;
pankso@1 15 }
pankso@1 16
pankso@1 17 /* Accessibility */
pankso@1 18
pankso@1 19 #access {
pankso@1 20 position: absolute;
pankso@555 21 top: 4px;
pankso@555 22 right: 4px;
pankso@1 23 text-align: right;
pankso@1 24 width: 100%;
pankso@1 25 margin: 0;
pankso@555 26 font-size: 11px;
pankso@1 27 font-weight: bold;
pankso@1 28 }
pankso@1 29
pankso@1 30 #access a {
pankso@1 31 background: inherit;
pankso@326 32 color: white;
pankso@1 33 text-decoration: none;
pankso@1 34 }
pankso@1 35
pankso@1 36 #access a:hover {
pankso@1 37 background: inherit;
pankso@326 38 color: #222222;
pankso@1 39 }
pankso@1 40
pankso@1 41 /* Header and title */
pankso@1 42
pankso@1 43 #header{
pankso@1 44 background: #f0ba08 url(pics/website/header.png) repeat-x top;
pankso@1 45 color: black;
pankso@1 46 width: 100%;
pankso@557 47 height: 50px;
pankso@1 48 border-top: 1px solid black;
pankso@1 49 border-bottom: 1px solid black;
pankso@1 50 margin-bottom: 30px;
pankso@1 51 }
pankso@1 52
pankso@555 53 #titre {
pankso@555 54 position: absolute;
pankso@1 55 font-size: 16px;
pankso@1 56 font-weight: bolder ;
pankso@555 57 margin-left: 200px;
pankso@555 58 margin-top: 28px;
pankso@1 59 }
pankso@1 60
pankso@1 61 #logo {
pankso@1 62 position: absolute;
pankso@1 63 float: left;
pankso@555 64 margin-left: 16px;
pankso@1 65 margin-top: 0px;
pankso@1 66 }
pankso@1 67
pankso@1 68 /* Navigation */
pankso@1 69
pankso@1 70 #nav {
pankso@1 71 position: absolute;
pankso@555 72 top: 76px;
pankso@565 73 right: 80px;
pankso@555 74 color: #555555;
pankso@1 75 float: right;
pankso@555 76 width: 250px;
pankso@563 77 line-height: 1.5em;
pankso@1 78 text-align: left;
pankso@555 79 font-size: 12px;
pankso@1 80 }
pankso@1 81
pankso@555 82 #nav ul {
pankso@555 83 -moz-border-radius: 8px;
pankso@555 84 -webkit-border-radius: 8px;
pankso@555 85 list-style-type: none;
pankso@555 86 margin: 10px 0;
pankso@555 87 padding: 10px 24px 10px 24px;
pankso@555 88 background-color: #eaeaea;
pankso@1 89 }
pankso@1 90
pankso@555 91 #nav .nav_box ul {
pankso@1 92 list-style-type: none;
pankso@555 93 margin: 0;
pankso@555 94 padding: 10px 24px 10px 0px;
pankso@1 95 }
pankso@1 96
pankso@1 97 #nav li {
pankso@1 98 display: inline;
pankso@1 99 }
pankso@1 100
pankso@555 101 #nav h4 {
pankso@555 102 font-size: 110%;
pankso@555 103 color: #666666;
pankso@555 104 font-weight: bold;
pankso@555 105 margin: 0;
pankso@555 106 padding: 0 0 1px 0;
pankso@555 107 border-bottom: 1px solid #cecece;
pankso@555 108 }
pankso@555 109
pankso@1 110 #nav a {
pankso@555 111 color: #0F314E;
pankso@1 112 background: inherit;
pankso@1 113 display: block;
pankso@1 114 text-decoration: none;
pankso@555 115 font-weight: bold;
pankso@1 116 }
pankso@1 117
pankso@1 118 #nav a:hover {
pankso@1 119 color: #DF8F06;
pankso@1 120 text-decoration: none;
pankso@1 121 display: block;
pankso@1 122 }
pankso@1 123
pankso@74 124 #nav hr {
pankso@74 125 margin: 2px 0px 1px 0px;
pankso@74 126 border: 0px;
pankso@74 127 border-top: 1px solid #BDBDBD;
pankso@519 128
pankso@74 129 }
pankso@555 130
pankso@555 131 .nav_box {
pankso@555 132 -moz-border-radius: 8px;
pankso@555 133 -webkit-border-radius: 8px;
pankso@555 134 margin: 10px 0;
pankso@555 135 padding: 10px 24px 10px 24px;
pankso@555 136 background-color: #eaeaea;
pankso@555 137 text-align: justify;
pankso@555 138 }
pankso@555 139
pankso@563 140 #nav .nav_box p {
pankso@563 141 line-height: 1.3em;
pankso@563 142 }
pankso@563 143
pankso@555 144 #nav .nav_box p a {
pankso@555 145 display: inline;
pankso@555 146 font-weight: normal;
pankso@555 147 text-decoration: underline;
pankso@555 148 }
pankso@555 149
pankso@555 150 #nav .nav_box p a:hover {
pankso@555 151 text-decoration: none;
pankso@555 152 color: blue;
pankso@555 153 background: inherit;
pankso@555 154 }
pankso@555 155
pankso@555 156 #nav hr {
pankso@555 157 height: 0px;
pankso@555 158 border: 0px solid #eaeaea;
pankso@555 159 }
pankso@555 160
pankso@1 161 /* Page content */
pankso@1 162
pankso@1 163 #content, #content_bottom, #content_top {
pankso@1 164 background: white;
pankso@1 165 color: black;
pankso@1 166 text-align: justify;
pankso@1 167 }
pankso@1 168
pankso@1 169 #content {
pankso@1 170 height: auto;
pankso@565 171 margin: 6px 320px 0px 0px;
pankso@565 172 padding: 0px 40px 60px 80px;
pankso@1 173 }
pankso@1 174
pankso@1 175 #content li {
pankso@1 176 line-height: 1.5em;
pankso@1 177 text-align: left;
pankso@1 178 }
pankso@1 179
pankso@1 180 /* Legal informations */
pankso@1 181
pankso@1 182 #copy {
pankso@1 183 font-size: 11px ;
pankso@565 184 text-align: left ;
pankso@1 185 background: transparent;
pankso@1 186 color: #a8a8a8;
pankso@1 187 padding-top: 10px;
pankso@565 188 margin: 0 0 0 80px;
pankso@1 189 }
pankso@1 190
pankso@1 191 #copy a {
pankso@1 192 background: inherit;
pankso@1 193 color: #a8a8a8;
pankso@1 194 }
pankso@1 195
pankso@1 196 #copy a:hover {
pankso@1 197 background: inherit;
pankso@555 198 color: #666666;
pankso@1 199 }
pankso@1 200
pankso@1 201 /* Footer */
pankso@1 202
pankso@1 203 #bottom {
pankso@1 204 float: none;
pankso@1 205 background: inherit;
pankso@1 206 color: black;
pankso@1 207 width: auto;
pankso@1 208 clear: both;
pankso@1 209 padding: 0;
pankso@565 210 margin: 0 0 0 80px;
pankso@565 211 text-align: left;
pankso@1 212 vertical-align: middle;
pankso@1 213 }
pankso@1 214
pankso@1 215 #news li {
pankso@1 216 list-style-type: square;
pankso@1 217 border-bottom: 1px dotted #BEBEBE;
pankso@1 218 margin-left: -25px;
pankso@1 219 padding: 4px 0px 4px 0px;
pankso@1 220 }
pankso@375 221
pankso@678 222 #news a {
pankso@678 223 text-decoration: none;
pankso@678 224 }
pankso@678 225
pankso@1 226 #gallery {
pankso@1 227 text-align: center;
pankso@1 228 }
pankso@375 229
pankso@286 230 #gallery table {
pankso@286 231 margin: 30px 0px 30px 0px;
pankso@286 232 }
pankso@1 233
pankso@375 234 /* Clouds */
pankso@375 235
pankso@375 236 #cloud {
pankso@375 237 padding: 20px 0px 20px 0px;
pankso@375 238 line-height: 3em;
pankso@375 239 text-align: center;
pankso@375 240 }
pankso@375 241 #cloud a { padding: 4px; color: #956411; }
pankso@375 242 #cloud a.tag1 { font-size: 0.7em; font-weight: 100; }
pankso@375 243 #cloud a.tag2 { font-size: 0.8em; font-weight: 200; }
pankso@375 244 #cloud a.tag3 { font-size: 0.9em; font-weight: 300; }
pankso@375 245 #cloud a.tag4 { font-size: 1.0em; font-weight: 400; }
pankso@375 246 #cloud a.tag5 { font-size: 1.2em; font-weight: 500; }
pankso@375 247 #cloud a.tag6 { font-size: 1.4em; font-weight: 600; }
pankso@375 248 #cloud a.tag7 { font-size: 1.6em; font-weight: 700; }
pankso@375 249 #cloud a.tag8 { font-size: 1.8em; font-weight: 800; }
pankso@375 250 #cloud a.tag9 { font-size: 2.2em; font-weight: 900; }
pankso@375 251 #cloud a.tag10 { font-size: 2.5em; font-weight: 900; }
pankso@375 252
pankso@1 253 /* CSS class. */
pankso@1 254
pankso@555 255 .infobox {
pankso@555 256 margin: 10px;
pankso@555 257 padding: 12px;
pankso@555 258 background: #f2f2f2;
pankso@555 259 border: 1px solid #eaeaea;
pankso@555 260 -moz-border-radius: 8px;
pankso@555 261 -webkit-border-radius: 8px;
pankso@1 262 }
pankso@1 263
pankso@1 264 /* HTML styles */
pankso@1 265
pankso@1 266 h1 {
pankso@555 267 color: blue;
pankso@1 268 background: inherit;
pankso@1 269 text-align: left;
pankso@555 270 margin: 0px 0px 10px 0px;
pankso@555 271 font-size: 140%;
pankso@555 272 font-weight: bold;
pankso@1 273 }
pankso@1 274
pankso@1 275 h2 {
pankso@555 276 color: #DF8F06;
pankso@555 277 /* border-top: 1px solid #f3f3f3; */
pankso@555 278 border-left: 8px solid #f3f3f3;
pankso@555 279 padding: 4px 0px 4px 4px;
pankso@555 280 margin: 0;
pankso@555 281 font-size: 140%;
pankso@555 282 font-weight: bold;
pankso@1 283 }
pankso@1 284
pankso@1 285 h3 {
pankso@1 286 font-weight: bold;
pankso@1 287 color: #6c0023;
pankso@1 288 background: inherit;
pankso@1 289 }
pankso@1 290
pankso@1 291 a {
pankso@1 292 text-decoration: underline;
pankso@1 293 color: #0F314E;
pankso@1 294 background: inherit;
pankso@1 295 }
pankso@1 296
pankso@1 297 a:hover {
pankso@1 298 text-decoration: none;
pankso@1 299 color: blue;
pankso@1 300 background: inherit;
pankso@1 301 }
pankso@1 302
pankso@1 303 code {
pankso@1 304 font-size: 12px;
pankso@1 305 color: #669900;
pankso@1 306 background: inherit;
pankso@1 307 }
pankso@1 308
pankso@1 309 tt {
pankso@1 310 color: #15EE15;
pankso@1 311 background: inherit;
pankso@1 312 }
pankso@1 313
pankso@1 314 img {
pankso@1 315 border: 0pt none;
pankso@1 316 }
pankso@1 317
pankso@1 318 fieldset {
pankso@555 319 background: #E2ECf6;
pankso@1 320 color: black;
pankso@1 321 margin-top: 25px;
pankso@1 322 border: 1px solid black;
pankso@1 323 }
pankso@1 324
pankso@1 325 legend {
pankso@1 326 border: 1px solid black;
pankso@1 327 color: #6c0023;
pankso@1 328 background: #eaeaea;
pankso@1 329 font-weight: bold;
pankso@1 330 }
pankso@1 331
pankso@1 332 pre {
pankso@1 333 padding: 5px;
pankso@1 334 color: black;
pankso@1 335 background: #E1E0B0;
pankso@1 336 }
pankso@1 337
pankso@1 338 pre.script {
pankso@1 339 padding: 10px;
pankso@1 340 color: black;
pankso@1 341 background: #E8E8E8;
pankso@1 342 border: 1px inset #606060;
pankso@1 343 }
pankso@1 344
pankso@555 345 textarea {
pankso@555 346 background: #E5E5E5;
pankso@555 347 margin-top: 12px;
pankso@555 348 }
pankso@555 349
pankso@1 350 /* Packages pages */
pankso@1 351
pankso@1 352 .pkg_nav {
pankso@1 353 border-top: 1px solid black;
pankso@1 354 margin-top: 10px;
pankso@1 355 padding-top: 10px;
pankso@1 356 }
pankso@1 357
pankso@1 358 pre.package {
pankso@1 359 padding: 0px;
pankso@1 360 color: black;
pankso@1 361 background: white;
pankso@1 362 }
pankso@1 363
pankso@1 364 p.get {
pankso@1 365 text-align: center;
pankso@1 366 padding: 10px;
pankso@1 367 color: black;
pankso@1 368 background: #F3F3F3;
pankso@1 369 border: 1px solid #DEDEDE;
pankso@1 370 }
pascal@669 371
pascal@669 372 .year:after {
pascal@669 373 /* content: "2007-2010"; */
pascal@669 374 content: "2010";
pascal@669 375 }