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