website annotate slitaz.css @ rev 555
CSS change, clean-up and tiny improvment
| author | Christophe Lincoln <pankso@slitaz.org> |
|---|---|
| date | Sun Nov 01 20:20:05 2009 +0100 (2009-11-01) |
| parents | 4eea4b8d3511 |
| children | 888b29adb0d6 |
| 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@1 | 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@555 | 73 right: 40px; |
| pankso@555 | 74 color: #555555; |
| pankso@1 | 75 float: right; |
| pankso@555 | 76 width: 250px; |
| pankso@1 | 77 line-height: 1.3em; |
| 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@555 | 114 padding: 2px 0; |
| pankso@1 | 115 text-decoration: none; |
| pankso@555 | 116 font-weight: bold; |
| pankso@1 | 117 } |
| pankso@1 | 118 |
| pankso@1 | 119 #nav a:hover { |
| pankso@1 | 120 color: #DF8F06; |
| pankso@1 | 121 text-decoration: none; |
| pankso@1 | 122 display: block; |
| pankso@1 | 123 } |
| pankso@1 | 124 |
| pankso@74 | 125 #nav hr { |
| pankso@74 | 126 margin: 2px 0px 1px 0px; |
| pankso@74 | 127 border: 0px; |
| pankso@74 | 128 border-top: 1px solid #BDBDBD; |
| pankso@519 | 129 |
| pankso@74 | 130 } |
| pankso@555 | 131 |
| pankso@555 | 132 .nav_box { |
| pankso@555 | 133 -moz-border-radius: 8px; |
| pankso@555 | 134 -webkit-border-radius: 8px; |
| pankso@555 | 135 margin: 10px 0; |
| pankso@555 | 136 padding: 10px 24px 10px 24px; |
| pankso@555 | 137 background-color: #eaeaea; |
| pankso@555 | 138 text-align: justify; |
| pankso@555 | 139 } |
| pankso@555 | 140 |
| pankso@555 | 141 #nav .nav_box p a { |
| pankso@555 | 142 display: inline; |
| pankso@555 | 143 font-weight: normal; |
| pankso@555 | 144 text-decoration: underline; |
| pankso@555 | 145 } |
| pankso@555 | 146 |
| pankso@555 | 147 #nav .nav_box p a:hover { |
| pankso@555 | 148 text-decoration: none; |
| pankso@555 | 149 color: blue; |
| pankso@555 | 150 background: inherit; |
| pankso@555 | 151 } |
| pankso@555 | 152 |
| pankso@555 | 153 #nav hr { |
| pankso@555 | 154 height: 0px; |
| pankso@555 | 155 border: 0px solid #eaeaea; |
| pankso@555 | 156 } |
| pankso@555 | 157 |
| pankso@1 | 158 /* Page content */ |
| pankso@1 | 159 |
| pankso@1 | 160 #content, #content_bottom, #content_top { |
| pankso@1 | 161 background: white; |
| pankso@1 | 162 color: black; |
| pankso@1 | 163 text-align: justify; |
| pankso@1 | 164 } |
| pankso@1 | 165 |
| pankso@1 | 166 #content { |
| pankso@1 | 167 height: auto; |
| pankso@555 | 168 margin: 6px 280px 0px 0px; |
| pankso@555 | 169 padding: 0px 40px 60px 40px; |
| pankso@1 | 170 } |
| pankso@1 | 171 |
| pankso@1 | 172 #content li { |
| pankso@1 | 173 line-height: 1.5em; |
| pankso@1 | 174 text-align: left; |
| pankso@1 | 175 } |
| pankso@1 | 176 |
| pankso@1 | 177 /* Legal informations */ |
| pankso@1 | 178 |
| pankso@1 | 179 #copy { |
| pankso@1 | 180 font-size: 11px ; |
| pankso@1 | 181 text-align: center ; |
| pankso@1 | 182 background: transparent; |
| pankso@1 | 183 color: #a8a8a8; |
| pankso@1 | 184 padding-top: 10px; |
| pankso@1 | 185 } |
| pankso@1 | 186 |
| pankso@1 | 187 #copy a { |
| pankso@1 | 188 background: inherit; |
| pankso@1 | 189 color: #a8a8a8; |
| pankso@1 | 190 } |
| pankso@1 | 191 |
| pankso@1 | 192 #copy a:hover { |
| pankso@1 | 193 background: inherit; |
| pankso@555 | 194 color: #666666; |
| pankso@1 | 195 } |
| pankso@1 | 196 |
| pankso@1 | 197 /* Footer */ |
| pankso@1 | 198 |
| pankso@1 | 199 #bottom { |
| pankso@1 | 200 float: none; |
| pankso@1 | 201 background: inherit; |
| pankso@1 | 202 color: black; |
| pankso@1 | 203 width: auto; |
| pankso@1 | 204 clear: both; |
| pankso@1 | 205 padding: 0; |
| pankso@1 | 206 margin: 0; |
| pankso@1 | 207 text-align: center; |
| pankso@1 | 208 vertical-align: middle; |
| pankso@1 | 209 } |
| pankso@1 | 210 |
| pankso@1 | 211 #news li { |
| pankso@1 | 212 list-style-type: square; |
| pankso@1 | 213 border-bottom: 1px dotted #BEBEBE; |
| pankso@1 | 214 margin-left: -25px; |
| pankso@1 | 215 padding: 4px 0px 4px 0px; |
| pankso@1 | 216 } |
| pankso@375 | 217 |
| pankso@1 | 218 #gallery { |
| pankso@1 | 219 text-align: center; |
| pankso@1 | 220 } |
| pankso@375 | 221 |
| pankso@286 | 222 #gallery table { |
| pankso@286 | 223 margin: 30px 0px 30px 0px; |
| pankso@286 | 224 } |
| pankso@1 | 225 |
| pankso@375 | 226 /* Clouds */ |
| pankso@375 | 227 |
| pankso@375 | 228 #cloud { |
| pankso@375 | 229 padding: 20px 0px 20px 0px; |
| pankso@375 | 230 line-height: 3em; |
| pankso@375 | 231 text-align: center; |
| pankso@375 | 232 } |
| pankso@375 | 233 #cloud a { padding: 4px; color: #956411; } |
| pankso@375 | 234 #cloud a.tag1 { font-size: 0.7em; font-weight: 100; } |
| pankso@375 | 235 #cloud a.tag2 { font-size: 0.8em; font-weight: 200; } |
| pankso@375 | 236 #cloud a.tag3 { font-size: 0.9em; font-weight: 300; } |
| pankso@375 | 237 #cloud a.tag4 { font-size: 1.0em; font-weight: 400; } |
| pankso@375 | 238 #cloud a.tag5 { font-size: 1.2em; font-weight: 500; } |
| pankso@375 | 239 #cloud a.tag6 { font-size: 1.4em; font-weight: 600; } |
| pankso@375 | 240 #cloud a.tag7 { font-size: 1.6em; font-weight: 700; } |
| pankso@375 | 241 #cloud a.tag8 { font-size: 1.8em; font-weight: 800; } |
| pankso@375 | 242 #cloud a.tag9 { font-size: 2.2em; font-weight: 900; } |
| pankso@375 | 243 #cloud a.tag10 { font-size: 2.5em; font-weight: 900; } |
| pankso@375 | 244 |
| pankso@1 | 245 /* CSS class. */ |
| pankso@1 | 246 |
| pankso@555 | 247 .infobox { |
| pankso@555 | 248 margin: 10px; |
| pankso@555 | 249 padding: 12px; |
| pankso@555 | 250 background: #f2f2f2; |
| pankso@555 | 251 border: 1px solid #eaeaea; |
| pankso@555 | 252 -moz-border-radius: 8px; |
| pankso@555 | 253 -webkit-border-radius: 8px; |
| pankso@1 | 254 } |
| pankso@1 | 255 |
| pankso@1 | 256 /* HTML styles */ |
| pankso@1 | 257 |
| pankso@1 | 258 h1 { |
| pankso@555 | 259 color: blue; |
| pankso@1 | 260 background: inherit; |
| pankso@1 | 261 text-align: left; |
| pankso@555 | 262 margin: 0px 0px 10px 0px; |
| pankso@555 | 263 font-size: 140%; |
| pankso@555 | 264 font-weight: bold; |
| pankso@1 | 265 } |
| pankso@1 | 266 |
| pankso@1 | 267 h2 { |
| pankso@555 | 268 color: #DF8F06; |
| pankso@555 | 269 /* border-top: 1px solid #f3f3f3; */ |
| pankso@555 | 270 border-left: 8px solid #f3f3f3; |
| pankso@555 | 271 padding: 4px 0px 4px 4px; |
| pankso@555 | 272 margin: 0; |
| pankso@555 | 273 font-size: 140%; |
| pankso@555 | 274 font-weight: bold; |
| pankso@1 | 275 } |
| pankso@1 | 276 |
| pankso@1 | 277 h3 { |
| pankso@1 | 278 font-weight: bold; |
| pankso@1 | 279 color: #6c0023; |
| pankso@1 | 280 background: inherit; |
| pankso@1 | 281 } |
| pankso@1 | 282 |
| pankso@1 | 283 a { |
| pankso@1 | 284 text-decoration: underline; |
| pankso@1 | 285 color: #0F314E; |
| pankso@1 | 286 background: inherit; |
| pankso@1 | 287 } |
| pankso@1 | 288 |
| pankso@1 | 289 a:hover { |
| pankso@1 | 290 text-decoration: none; |
| pankso@1 | 291 color: blue; |
| pankso@1 | 292 background: inherit; |
| pankso@1 | 293 } |
| pankso@1 | 294 |
| pankso@1 | 295 code { |
| pankso@1 | 296 font-size: 12px; |
| pankso@1 | 297 color: #669900; |
| pankso@1 | 298 background: inherit; |
| pankso@1 | 299 } |
| pankso@1 | 300 |
| pankso@1 | 301 tt { |
| pankso@1 | 302 color: #15EE15; |
| pankso@1 | 303 background: inherit; |
| pankso@1 | 304 } |
| pankso@1 | 305 |
| pankso@1 | 306 img { |
| pankso@1 | 307 border: 0pt none; |
| pankso@1 | 308 } |
| pankso@1 | 309 |
| pankso@1 | 310 fieldset { |
| pankso@555 | 311 background: #E2ECf6; |
| pankso@1 | 312 color: black; |
| pankso@1 | 313 margin-top: 25px; |
| pankso@1 | 314 border: 1px solid black; |
| pankso@1 | 315 } |
| pankso@1 | 316 |
| pankso@1 | 317 legend { |
| pankso@1 | 318 border: 1px solid black; |
| pankso@1 | 319 color: #6c0023; |
| pankso@1 | 320 background: #eaeaea; |
| pankso@1 | 321 font-weight: bold; |
| pankso@1 | 322 } |
| pankso@1 | 323 |
| pankso@1 | 324 pre { |
| pankso@1 | 325 padding: 5px; |
| pankso@1 | 326 color: black; |
| pankso@1 | 327 background: #E1E0B0; |
| pankso@1 | 328 } |
| pankso@1 | 329 |
| pankso@1 | 330 pre.script { |
| pankso@1 | 331 padding: 10px; |
| pankso@1 | 332 color: black; |
| pankso@1 | 333 background: #E8E8E8; |
| pankso@1 | 334 border: 1px inset #606060; |
| pankso@1 | 335 } |
| pankso@1 | 336 |
| pankso@555 | 337 textarea { |
| pankso@555 | 338 background: #E5E5E5; |
| pankso@555 | 339 margin-top: 12px; |
| pankso@555 | 340 } |
| pankso@555 | 341 |
| pankso@555 | 342 input[type=submit] { |
| pankso@555 | 343 background: #E5E5E5; |
| pankso@555 | 344 color: black; |
| pankso@555 | 345 border: 1px outset #111111; |
| pankso@555 | 346 font-weight: bold; |
| pankso@555 | 347 } |
| pankso@555 | 348 |
| pankso@555 | 349 input[type=submit]:hover { |
| pankso@555 | 350 background: #F3F3F3; |
| pankso@555 | 351 color: black; |
| pankso@555 | 352 } |
| pankso@555 | 353 |
| pankso@1 | 354 /* Packages pages */ |
| pankso@1 | 355 |
| pankso@1 | 356 .pkg_nav { |
| pankso@1 | 357 border-top: 1px solid black; |
| pankso@1 | 358 margin-top: 10px; |
| pankso@1 | 359 padding-top: 10px; |
| pankso@1 | 360 } |
| pankso@1 | 361 |
| pankso@1 | 362 pre.package { |
| pankso@1 | 363 padding: 0px; |
| pankso@1 | 364 color: black; |
| pankso@1 | 365 background: white; |
| pankso@1 | 366 } |
| pankso@1 | 367 |
| pankso@1 | 368 p.get { |
| pankso@1 | 369 text-align: center; |
| pankso@1 | 370 padding: 10px; |
| pankso@1 | 371 color: black; |
| pankso@1 | 372 background: #F3F3F3; |
| pankso@1 | 373 border: 1px solid #DEDEDE; |
| pankso@1 | 374 } |