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