wok-current rev 7945

tazbb/tazpkg-web: sync CSS style
author Christophe Lincoln <pankso@slitaz.org>
date Sat Jan 15 04:40:36 2011 +0100 (2011-01-15)
parents 265c9f92bbed
children eded145a3e2e
files tazbb/stuff/web/slitaz.css tazpkg-web/stuff/style/slitaz.css
line diff
     1.1 --- a/tazbb/stuff/web/slitaz.css	Wed Jan 12 17:38:56 2011 +0000
     1.2 +++ b/tazbb/stuff/web/slitaz.css	Sat Jan 15 04:40:36 2011 +0100
     1.3 @@ -1,12 +1,10 @@
     1.4  /*
     1.5 -	CSS style for SliTaz GNU/Linux website
     1.6 -	www.slitaz.org - (c) 2011 Pankso
     1.7 +	CSS style for SliTaz Network - (c) 2011 SliTaz GNU/Linux
     1.8  */
     1.9  
    1.10  html {
    1.11  	min-height:  102%;
    1.12  }
    1.13 -
    1.14  body {
    1.15  	background: #ffffff;
    1.16  	color: black;
    1.17 @@ -14,6 +12,9 @@
    1.18  	margin: 0;
    1.19  	border-top: 34px solid #f1f1f1;
    1.20  }
    1.21 +a { text-decoration: underline; color: #103a5e; }
    1.22 +a:hover { text-decoration: none; color: blue; }
    1.23 +img { border: 0pt none; }
    1.24  
    1.25  /* Accessibility */
    1.26  
    1.27 @@ -28,26 +29,17 @@
    1.28  	font-size: 11px;
    1.29  	font-weight: bold;
    1.30  }
    1.31 -
    1.32  #access a {
    1.33  	background: transparent;
    1.34  	color: #0F314E;
    1.35  	text-decoration: none;
    1.36  }
    1.37 +#access a:hover { color: #b64b22; }
    1.38 +#access img { vertical-align: middle; }
    1.39  
    1.40 -#access a:hover {
    1.41 -	background: inherit;
    1.42 -	color: #b64b22;
    1.43 -}
    1.44 -
    1.45 -#access img {
    1.46 -	vertical-align: middle;
    1.47 -}
    1.48 -
    1.49 -/* Header and title */
    1.50 +/* Header */
    1.51  
    1.52  #header {
    1.53 -	/*background: #f0ba08 url(pics/website/header.png) repeat-x top;*/
    1.54  	background: #351a0a url(pics/website/header-img.png) no-repeat top right;
    1.55  	color: black;
    1.56  	width: 100%;
    1.57 @@ -56,7 +48,6 @@
    1.58  	border-bottom: 1px solid #999;
    1.59  	margin-bottom: 33px;
    1.60  }
    1.61 -
    1.62  #titre {
    1.63  	position: absolute;
    1.64  	font-size: 14px;
    1.65 @@ -64,7 +55,6 @@
    1.66  	left: 180px;
    1.67  	top: 4px;
    1.68  }
    1.69 -
    1.70  #logo {
    1.71  	position: absolute;
    1.72  	float: left;
    1.73 @@ -74,7 +64,7 @@
    1.74  	height: 74px;
    1.75  }
    1.76  
    1.77 -/* Side bar Navigation */
    1.78 +/* Side bar */
    1.79  
    1.80  #nav {
    1.81  	position: absolute;
    1.82 @@ -87,18 +77,6 @@
    1.83  	text-align: left;
    1.84  	font-size: 12px;
    1.85  }
    1.86 -
    1.87 -#nav .nav_box ul {
    1.88 -	list-style-type: none;
    1.89 -	margin: 0;
    1.90 -	padding: 10px 24px 10px 0px;
    1.91 -	background-color: inherit;
    1.92 -}
    1.93 -
    1.94 -#nav li {
    1.95 -	display: inline;
    1.96 -}
    1.97 -
    1.98  #nav h4 {
    1.99  	font-size: 120%;
   1.100  	color: #666666;
   1.101 @@ -107,7 +85,6 @@
   1.102  	padding: 0 0 1px 0;
   1.103  	border-bottom: 1px solid #cecece;
   1.104  }
   1.105 -
   1.106  #nav a {
   1.107  	color: #0F314E;
   1.108  	background: inherit;
   1.109 @@ -115,13 +92,18 @@
   1.110  	text-decoration: none;
   1.111  	font-weight: bold;
   1.112  }
   1.113 -
   1.114  #nav a:hover {
   1.115  	color: #b64b22;
   1.116  	text-decoration: none;
   1.117  	display: block;
   1.118  }
   1.119 -
   1.120 +#nav .nav_box ul {
   1.121 +	list-style-type: none;
   1.122 +	margin: 0;
   1.123 +	padding: 10px 24px 10px 0px;
   1.124 +	background-color: inherit;
   1.125 +}
   1.126 +#nav li { display: inline; }
   1.127  #nav ul {
   1.128  	-moz-border-radius: 8px;
   1.129  	-webkit-border-radius: 8px;
   1.130 @@ -131,12 +113,104 @@
   1.131  	padding: 10px 24px 10px 24px;
   1.132  	background-color: #eaeaea;
   1.133  }
   1.134 -
   1.135  .nav_box {
   1.136  	margin: 10px 0;
   1.137  	padding: 10px 24px 10px 24px;
   1.138  	background-color: #eaeaea;
   1.139  	text-align: justify;
   1.140 +}
   1.141 +#nav .nav_box p { line-height: 1.3em; }
   1.142 +#nav .nav_box p a {
   1.143 +	display: inline;
   1.144 +	font-weight: normal;
   1.145 +	text-decoration: underline;
   1.146 +}
   1.147 +#nav .nav_box p a:hover {
   1.148 +	text-decoration: none;
   1.149 +	color: blue;
   1.150 +	background: inherit;
   1.151 +}
   1.152 +
   1.153 +/* Page content */
   1.154 +
   1.155 +#content, #content-full {
   1.156 +	background: white;
   1.157 +	color: black;
   1.158 +	text-align: justify;
   1.159 +	height: auto;
   1.160 +}
   1.161 +#content, #content-full {
   1.162 +	margin: 6px 320px 0px 0px;
   1.163 +	padding: 0px 40px 60px 80px;
   1.164 +}
   1.165 +#content-full {
   1.166 +	margin: 0;
   1.167 +	padding: 0px 80px 40px 80px;
   1.168 +}
   1.169 +#content li, #content-full li {
   1.170 +	line-height: 1.5em;
   1.171 +	text-align: left;
   1.172 +}
   1.173 +#news li {
   1.174 +	list-style-type: square;
   1.175 +	border-bottom: 1px dotted #BEBEBE;
   1.176 +	margin-left: -25px;
   1.177 +	padding: 4px 0px 4px 0px;
   1.178 +}
   1.179 +#news a { text-decoration: none; }
   1.180 +
   1.181 +/* Box and block. */
   1.182 +
   1.183 +.infobox {
   1.184 +	margin: 20px 60px;
   1.185 +	padding: 12px;
   1.186 +	background: #f8f8f8;
   1.187 +}
   1.188 +.infobox img { vertical-align: middle; }
   1.189 +.infobox:hover { background-color: #FBFBFB; }
   1.190 +.block {
   1.191 +	/*padding-bottom: 35%;*/
   1.192 +	color: black;
   1.193 +	min-height: 200px;
   1.194 +	margin-bottom: 40px;
   1.195 +}
   1.196 +.block ul {
   1.197 +	list-style-type: none;
   1.198 +	margin: 0;
   1.199 +	padding: 0 20px;
   1.200 +}
   1.201 +.block_left {
   1.202 +	width: 46%;
   1.203 +	float: left;
   1.204 +	background-color: #eaeaea;
   1.205 +	margin: 4px 2px;
   1.206 +	padding: 0 10px 10px 10px;
   1.207 +}
   1.208 +.block_right {
   1.209 +	width: 46%;
   1.210 +	float: right;
   1.211 +	background-color: #eaeaea;
   1.212 +	margin: 4px 2px;
   1.213 +	padding: 0 10px 10px 10px;
   1.214 +}
   1.215 +#block_top {
   1.216 +	color: black;
   1.217 +	background-color: #eaeaea;
   1.218 +	min-height: 180px;
   1.219 +	margin-bottom: 40px;
   1.220 +	margin-right: 340px;
   1.221 +	padding: 0 10px;
   1.222 +}
   1.223 +#block_nav {
   1.224 +	width: 300px;
   1.225 +	min-height: 180px;
   1.226 +	float: right;
   1.227 +	background-color: #eaeaea;
   1.228 +	margin: 0;
   1.229 +	padding: 0 10px;
   1.230 +}
   1.231 +.nav_box, .infobox, .block_left, .block_right, #block_top, 
   1.232 +#block_nav, #footer {
   1.233  	-moz-border-radius: 8px;
   1.234  	-webkit-border-radius: 8px;
   1.235  	border-radius: 8px;
   1.236 @@ -151,171 +225,20 @@
   1.237  	transition-property: background-color;
   1.238  	transition-duration: 2s;
   1.239  }
   1.240 -
   1.241 -.nav_box:hover { background-color: #f8f8f8; }
   1.242 -
   1.243 -#nav .nav_box p {
   1.244 -	line-height: 1.3em;
   1.245 -}
   1.246 -
   1.247 -#nav .nav_box p a {
   1.248 -	display: inline;
   1.249 -	font-weight: normal;
   1.250 -	text-decoration: underline;
   1.251 -}
   1.252 -
   1.253 -#nav .nav_box p a:hover {
   1.254 -	text-decoration: none;
   1.255 -	color: blue;
   1.256 -	background: inherit;
   1.257 -}
   1.258 -
   1.259 -/* Page content */
   1.260 -
   1.261 -#content {
   1.262 -	background: white;
   1.263 -	color: black;
   1.264 -	text-align: justify;
   1.265 -	height: auto;
   1.266 -	margin: 6px 320px 0px 0px;
   1.267 -	padding: 0px 40px 60px 80px;
   1.268 -}
   1.269 -
   1.270 -#content-full {
   1.271 -	background: white;
   1.272 -	color: black;
   1.273 -	text-align: justify;
   1.274 -	height: auto;
   1.275 -	margin: 0;
   1.276 -	padding: 0px 80px 40px 80px;
   1.277 -}
   1.278 -
   1.279 -#content li, #content-full li {
   1.280 -	line-height: 1.5em;
   1.281 -	text-align: left;
   1.282 -}
   1.283 -
   1.284 -#news li {
   1.285 -	list-style-type: square;
   1.286 -	border-bottom: 1px dotted #BEBEBE;
   1.287 -	margin-left: -25px;
   1.288 -	padding: 4px 0px 4px 0px;
   1.289 -}
   1.290 -
   1.291 -#news a {
   1.292 -	text-decoration: none;
   1.293 -}
   1.294 -
   1.295 -#gallery {
   1.296 -	text-align: center;
   1.297 -}
   1.298 -
   1.299 -/* Box and block. */
   1.300 -
   1.301 -.infobox {
   1.302 -	margin: 20px 60px;
   1.303 -	padding: 12px;
   1.304 -	background: #f8f8f8;
   1.305 -}
   1.306 -
   1.307 -.infobox img { vertical-align: middle; }
   1.308 -/* .infobox:hover { background-color: #f2b21d; } */
   1.309 -.infobox:hover { background-color: #FBFBFB; }
   1.310 -
   1.311 -.block {
   1.312 -	/*padding-bottom: 35%;*/
   1.313 -	color: black;
   1.314 -	min-height: 200px;
   1.315 -	margin-bottom: 40px;
   1.316 -}
   1.317 -
   1.318 -.block ul {
   1.319 -	list-style-type: none;
   1.320 -	margin: 0;
   1.321 -	padding: 0 20px;
   1.322 -}
   1.323 -
   1.324 -.block_left {
   1.325 -	width: 46%;
   1.326 -	float: left;
   1.327 -	background-color: #eaeaea;
   1.328 -	margin: 4px 2px;
   1.329 -	padding: 0 10px 10px 10px;
   1.330 -}
   1.331 -
   1.332 -.block_right {
   1.333 -	width: 46%;
   1.334 -	float: right;
   1.335 -	background-color: #eaeaea;
   1.336 -	margin: 4px 2px;
   1.337 -	padding: 0 10px 10px 10px;
   1.338 -}
   1.339 -
   1.340 -#block_top {
   1.341 -	color: black;
   1.342 -	background-color: #eaeaea;
   1.343 -	min-height: 180px;
   1.344 -	margin-bottom: 40px;
   1.345 -	margin-right: 340px;
   1.346 -	padding: 0 10px;
   1.347 -}
   1.348 -
   1.349 -#block_nav {
   1.350 -	width: 300px;
   1.351 -	min-height: 180px;
   1.352 -	float: right;
   1.353 -	background-color: #eaeaea;
   1.354 -	margin: 0;
   1.355 -	padding: 0 10px;
   1.356 -}
   1.357 -
   1.358 -.infobox, .block_left, .block_right, #block_top, #block_nav, #footer {
   1.359 -	-moz-border-radius: 8px;
   1.360 -	-webkit-border-radius: 8px;
   1.361 -	border-radius: 8px;
   1.362 -	-moz-box-shadow: 0 1px 3px #666;
   1.363 -	-webkit-box-shadow: 0 1px 3px #666;
   1.364 -	box-shadow: 0 1px 3px #666;
   1.365 -	/* CSS3 transition */
   1.366 -	-webkit-transition-property: background-color;
   1.367 -	-webkit-transition-duration: 2s;
   1.368 -	-moz-transition-property: background-color;
   1.369 -	-moz-transition-duration: 2s;
   1.370 -	transition-property: background-color;
   1.371 -	transition-duration: 2s;
   1.372 -}
   1.373 -
   1.374 -#block_nav {
   1.375 -	font-weight: bold;
   1.376 -}
   1.377 -
   1.378 -#block_nav a {
   1.379 -	text-decoration: none;
   1.380 -}
   1.381 -
   1.382 -#block_nav li a:hover {
   1.383 -	color: #b64b22;
   1.384 -}
   1.385 -
   1.386 -#block_nav ul {
   1.387 -	margin: 0;
   1.388 -	list-style-type: none;
   1.389 -}
   1.390 -
   1.391 -#block_nav h3 {
   1.392 -	font-size: 110%;
   1.393 -}
   1.394 -
   1.395 -.block_left:hover, .block_right:hover, #block_top:hover,
   1.396 -#block_nav:hover, #footer:hover { 
   1.397 +#block_nav { font-weight: bold; }
   1.398 +#block_nav a { text-decoration: none; }
   1.399 +#block_nav li a:hover { color: #b64b22; }
   1.400 +#block_nav ul { margin: 0; list-style-type: none; }
   1.401 +#block_nav h3 { font-size: 110%; }
   1.402 +.nav_box:hover, .block_left:hover, .block_right:hover, 
   1.403 +#block_top:hover, #block_nav:hover, #footer:hover { 
   1.404  	background-color: #f8f8f8;
   1.405  }
   1.406 -
   1.407  .right_box {
   1.408  	width: 50%;
   1.409  	float: right;
   1.410  }
   1.411 -
   1.412 +/* Text transform at 45deg */
   1.413  .floor {
   1.414  	color: #999999;
   1.415  	font-size: 20px;
   1.416 @@ -325,11 +248,29 @@
   1.417  	-ms-transform: rotate(-45deg) skew(15deg, 15deg);
   1.418  	transform: rotate(-45deg) skew(15deg, 15deg);
   1.419  }
   1.420 -	
   1.421 +#twitter, .feedbox {
   1.422 +	margin-top: 20px;
   1.423 +	-moz-border-radius: 8px;
   1.424 +	-webkit-border-radius: 8px;
   1.425 +	border-radius: 8px;
   1.426 +	-moz-box-shadow: 0 1px 3px #666;
   1.427 +	-webkit-box-shadow: 0 1px 3px #666;
   1.428 +	box-shadow: 0 1px 3px #666;
   1.429 +}
   1.430 +.feedbox {
   1.431 +	background-color: #f9f9f9;
   1.432 +	padding: 10px 20px;
   1.433 +	margin: 20px 100px;
   1.434 +}
   1.435 +.feedbox div {
   1.436 +	height: 320px;
   1.437 +	overflow: auto;
   1.438 +}
   1.439 +.feedbox ul { list-style-type: none; margin: 0; }
   1.440 +
   1.441  /* Button */
   1.442  
   1.443  .button { margin-left: 20px; }
   1.444 -
   1.445  .button a { 
   1.446  	background-color: #b64b22;
   1.447  	color: #ffffff;
   1.448 @@ -343,19 +284,17 @@
   1.449  	-webkit-box-shadow: 0 1px 3px #666;
   1.450  	box-shadow: 0 1px 3px #666;
   1.451  }
   1.452 -
   1.453  .button a:hover, input[type=submit]:hover { 
   1.454  	background-color: #a3431f;
   1.455  	color: #ffffff;
   1.456  }
   1.457 -
   1.458  input[type=submit] {
   1.459  	border: 1px solid #b64b22;
   1.460  	background-color: #b64b22;
   1.461  	color: white;
   1.462  	font-weight: bold;
   1.463  	cursor: pointer;
   1.464 -	padding: 2px 10px;
   1.465 +	padding: 3px 10px;
   1.466  	font-size: 14px;
   1.467  	-moz-border-radius: 2px;
   1.468  	-webkit-border-radius: 2px;
   1.469 @@ -363,13 +302,12 @@
   1.470  	-moz-box-shadow: 0 0 5px #666;
   1.471  	-webkit-box-shadow: 0 0 5px#666;
   1.472  	box-shadow: 0 0 5px #666;
   1.473 +	margin-left: -5px;
   1.474  }
   1.475 -
   1.476  input[type=text] {
   1.477  	border: 1px solid #333333;
   1.478  	padding: 3px;
   1.479  	width: 100%;
   1.480 -	max-width: 500px;
   1.481  }
   1.482  
   1.483  /* Clouds */
   1.484 @@ -379,7 +317,7 @@
   1.485  	line-height: 3em;
   1.486  	text-align: center;
   1.487  }
   1.488 -#cloud a { padding: 0 2px; color: #956411; }
   1.489 +#cloud a { padding: 0 2px; color: #444444; }
   1.490  #cloud a.tag1 { font-size: 0.7em; font-weight: 100; }
   1.491  #cloud a.tag2 { font-size: 0.8em; font-weight: 200; }
   1.492  #cloud a.tag3 { font-size: 0.9em; font-weight: 300; }
   1.493 @@ -391,7 +329,7 @@
   1.494  #cloud a.tag9 { font-size: 2.2em; font-weight: 900; }
   1.495  #cloud a.tag10 { font-size: 2.5em; font-weight: 900; }
   1.496  
   1.497 -/* Slideshow. */
   1.498 +/* Slideshow and gallery */
   1.499  
   1.500  #slideshow
   1.501  {
   1.502 @@ -401,23 +339,13 @@
   1.503  	width: 260px;
   1.504  	height: 163px;
   1.505  }
   1.506 -
   1.507  #slideshow img
   1.508  {
   1.509  	border: 0;
   1.510  	width: 260px;
   1.511  	height: 163px;
   1.512  }
   1.513 -
   1.514 -#twitter {
   1.515 -	margin-top: 20px;
   1.516 -	-moz-border-radius: 8px;
   1.517 -	-webkit-border-radius: 8px;
   1.518 -	border-radius: 8px;
   1.519 -	-moz-box-shadow: 0 1px 3px #666;
   1.520 -	-webkit-box-shadow: 0 1px 3px #666;
   1.521 -	box-shadow: 0 1px 3px #666;
   1.522 -}
   1.523 +#gallery { text-align: center; }
   1.524  
   1.525  /* HTML styles */
   1.526  
   1.527 @@ -430,7 +358,6 @@
   1.528  	font-weight: bold;
   1.529  	padding: 5px 0 0 10px;
   1.530  }
   1.531 -
   1.532  h2 {
   1.533  	color: #b64b22;
   1.534  	padding: 0;
   1.535 @@ -438,79 +365,28 @@
   1.536  	font-size: 130%;
   1.537  	font-weight: bold;
   1.538  }
   1.539 -
   1.540  h3 {
   1.541  	font-weight: bold;
   1.542  	color: #666666;
   1.543  	background: transparent;
   1.544  }
   1.545 -	
   1.546 -h3 img { 
   1.547 +h3 img, h2 img { 
   1.548  	vertical-align: middle;
   1.549  	width: 20px;
   1.550  	height: 20px;
   1.551  	padding-right: 4px; 
   1.552  }
   1.553 -
   1.554 -a {
   1.555 -	text-decoration: underline;
   1.556 -	color: #103A5E;
   1.557 -	background: inherit;
   1.558 -}
   1.559 -
   1.560 -a:hover {
   1.561 -	text-decoration: none;
   1.562 -	color: blue;
   1.563 -	background: inherit;
   1.564 -}
   1.565 -
   1.566 -code {
   1.567 +code, tt {
   1.568  	font-size: 12px;
   1.569  	color: #669900;
   1.570 -	background: inherit;
   1.571  }
   1.572 -
   1.573 -tt {
   1.574 -	color: #15EE15;
   1.575 -	background: inherit;
   1.576 -}
   1.577 -
   1.578 -img {
   1.579 -	border: 0pt none;
   1.580 -}
   1.581 -
   1.582 -fieldset {
   1.583 -	background: #E2ECf6;
   1.584 -	color: black;
   1.585 -	margin-top: 25px;
   1.586 -	border: 1px solid black;
   1.587 -}
   1.588 -
   1.589 -legend {
   1.590 -	border: 1px solid black;
   1.591 -	color: #6c0023;
   1.592 -	background: #eaeaea;
   1.593 -	font-weight: bold;
   1.594 -}
   1.595 -
   1.596 -pre {
   1.597 -	padding: 5px;
   1.598 -	color: black;
   1.599 -	background: #E1E0B0;
   1.600 -}
   1.601 -
   1.602 -pre.script {
   1.603 +pre, pre.script {
   1.604  	padding: 10px;
   1.605  	color: black;
   1.606  	background: #E8E8E8;
   1.607  	border: 1px inset #606060;
   1.608  }
   1.609  
   1.610 -textarea {
   1.611 -	background: #E5E5E5;
   1.612 -	margin-top: 12px;
   1.613 -}
   1.614 -
   1.615  /* Packages pages */
   1.616  
   1.617  .pkg_nav {
   1.618 @@ -518,13 +394,11 @@
   1.619  	margin-top: 10px;
   1.620  	padding-top: 10px;
   1.621  }
   1.622 -
   1.623  pre.package {
   1.624  	padding: 0px;
   1.625  	color: black;
   1.626  	background: white;
   1.627  }
   1.628 -
   1.629  p.get {
   1.630  	text-align: center;
   1.631  	padding: 10px;
   1.632 @@ -535,22 +409,15 @@
   1.633  	-moz-border-radius: 4px;
   1.634  	-webkit-border-radius: 4px;
   1.635  }
   1.636 -
   1.637  p.get a {
   1.638  	font-weight: bold;
   1.639  	text-decoration: none;
   1.640  }
   1.641 -
   1.642  .pkgs-search { 
   1.643  	text-align: center; 
   1.644  	padding: 40px 20px 80px 20px;
   1.645  }
   1.646  
   1.647 -.year:after {
   1.648 -	/* content: "2007-2011"; */
   1.649 -	content: "2011";
   1.650 -}
   1.651 -
   1.652  /* Footer */
   1.653  
   1.654  #footer {
   1.655 @@ -567,21 +434,13 @@
   1.656  	-webkit-box-shadow: 0 1px 3px #666;
   1.657  	box-shadow: 0 1px 3px #666;
   1.658  }
   1.659 -#footer a {
   1.660 -	background: inherit;
   1.661 -	color: #666666;
   1.662 +#footer a { color: #666666; }
   1.663 +#footer a:hover { color: #333333; }
   1.664 +#footer ul { list-style-type: none; }
   1.665 +#footer li { padding: 2px; }
   1.666 +#footer h4 { margin: 0 20px; font-size: 125%; }
   1.667 +
   1.668 +.year:after {
   1.669 +	/* content: "2007-2011"; */
   1.670 +	content: "2011";
   1.671  }
   1.672 -#footer a:hover {
   1.673 -	background: inherit;
   1.674 -	color: #333333;
   1.675 -}
   1.676 -#footer ul {
   1.677 -	list-style-type: none;
   1.678 -}
   1.679 -#footer li {
   1.680 -	padding: 2px;
   1.681 -}
   1.682 -#footer h4 {
   1.683 -	margin: 0 20px;
   1.684 -	font-size: 125%;
   1.685 -}

     2.1 --- a/tazpkg-web/stuff/style/slitaz.css	Wed Jan 12 17:38:56 2011 +0000
     2.2 +++ b/tazpkg-web/stuff/style/slitaz.css	Sat Jan 15 04:40:36 2011 +0100
     2.3 @@ -1,12 +1,10 @@
     2.4  /*
     2.5 -	CSS style for SliTaz GNU/Linux website
     2.6 -	www.slitaz.org - (c) 2011 Pankso
     2.7 +	CSS style for SliTaz Network - (c) 2011 SliTaz GNU/Linux
     2.8  */
     2.9  
    2.10  html {
    2.11  	min-height:  102%;
    2.12  }
    2.13 -
    2.14  body {
    2.15  	background: #ffffff;
    2.16  	color: black;
    2.17 @@ -14,6 +12,9 @@
    2.18  	margin: 0;
    2.19  	border-top: 34px solid #f1f1f1;
    2.20  }
    2.21 +a { text-decoration: underline; color: #103a5e; }
    2.22 +a:hover { text-decoration: none; color: blue; }
    2.23 +img { border: 0pt none; }
    2.24  
    2.25  /* Accessibility */
    2.26  
    2.27 @@ -28,26 +29,17 @@
    2.28  	font-size: 11px;
    2.29  	font-weight: bold;
    2.30  }
    2.31 -
    2.32  #access a {
    2.33  	background: transparent;
    2.34  	color: #0F314E;
    2.35  	text-decoration: none;
    2.36  }
    2.37 +#access a:hover { color: #b64b22; }
    2.38 +#access img { vertical-align: middle; }
    2.39  
    2.40 -#access a:hover {
    2.41 -	background: inherit;
    2.42 -	color: #b64b22;
    2.43 -}
    2.44 -
    2.45 -#access img {
    2.46 -	vertical-align: middle;
    2.47 -}
    2.48 -
    2.49 -/* Header and title */
    2.50 +/* Header */
    2.51  
    2.52  #header {
    2.53 -	/*background: #f0ba08 url(pics/website/header.png) repeat-x top;*/
    2.54  	background: #351a0a url(pics/website/header-img.png) no-repeat top right;
    2.55  	color: black;
    2.56  	width: 100%;
    2.57 @@ -56,7 +48,6 @@
    2.58  	border-bottom: 1px solid #999;
    2.59  	margin-bottom: 33px;
    2.60  }
    2.61 -
    2.62  #titre {
    2.63  	position: absolute;
    2.64  	font-size: 14px;
    2.65 @@ -64,7 +55,6 @@
    2.66  	left: 180px;
    2.67  	top: 4px;
    2.68  }
    2.69 -
    2.70  #logo {
    2.71  	position: absolute;
    2.72  	float: left;
    2.73 @@ -74,7 +64,7 @@
    2.74  	height: 74px;
    2.75  }
    2.76  
    2.77 -/* Side bar Navigation */
    2.78 +/* Side bar */
    2.79  
    2.80  #nav {
    2.81  	position: absolute;
    2.82 @@ -87,18 +77,6 @@
    2.83  	text-align: left;
    2.84  	font-size: 12px;
    2.85  }
    2.86 -
    2.87 -#nav .nav_box ul {
    2.88 -	list-style-type: none;
    2.89 -	margin: 0;
    2.90 -	padding: 10px 24px 10px 0px;
    2.91 -	background-color: inherit;
    2.92 -}
    2.93 -
    2.94 -#nav li {
    2.95 -	display: inline;
    2.96 -}
    2.97 -
    2.98  #nav h4 {
    2.99  	font-size: 120%;
   2.100  	color: #666666;
   2.101 @@ -107,7 +85,6 @@
   2.102  	padding: 0 0 1px 0;
   2.103  	border-bottom: 1px solid #cecece;
   2.104  }
   2.105 -
   2.106  #nav a {
   2.107  	color: #0F314E;
   2.108  	background: inherit;
   2.109 @@ -115,13 +92,18 @@
   2.110  	text-decoration: none;
   2.111  	font-weight: bold;
   2.112  }
   2.113 -
   2.114  #nav a:hover {
   2.115  	color: #b64b22;
   2.116  	text-decoration: none;
   2.117  	display: block;
   2.118  }
   2.119 -
   2.120 +#nav .nav_box ul {
   2.121 +	list-style-type: none;
   2.122 +	margin: 0;
   2.123 +	padding: 10px 24px 10px 0px;
   2.124 +	background-color: inherit;
   2.125 +}
   2.126 +#nav li { display: inline; }
   2.127  #nav ul {
   2.128  	-moz-border-radius: 8px;
   2.129  	-webkit-border-radius: 8px;
   2.130 @@ -131,12 +113,104 @@
   2.131  	padding: 10px 24px 10px 24px;
   2.132  	background-color: #eaeaea;
   2.133  }
   2.134 -
   2.135  .nav_box {
   2.136  	margin: 10px 0;
   2.137  	padding: 10px 24px 10px 24px;
   2.138  	background-color: #eaeaea;
   2.139  	text-align: justify;
   2.140 +}
   2.141 +#nav .nav_box p { line-height: 1.3em; }
   2.142 +#nav .nav_box p a {
   2.143 +	display: inline;
   2.144 +	font-weight: normal;
   2.145 +	text-decoration: underline;
   2.146 +}
   2.147 +#nav .nav_box p a:hover {
   2.148 +	text-decoration: none;
   2.149 +	color: blue;
   2.150 +	background: inherit;
   2.151 +}
   2.152 +
   2.153 +/* Page content */
   2.154 +
   2.155 +#content, #content-full {
   2.156 +	background: white;
   2.157 +	color: black;
   2.158 +	text-align: justify;
   2.159 +	height: auto;
   2.160 +}
   2.161 +#content, #content-full {
   2.162 +	margin: 6px 320px 0px 0px;
   2.163 +	padding: 0px 40px 60px 80px;
   2.164 +}
   2.165 +#content-full {
   2.166 +	margin: 0;
   2.167 +	padding: 0px 80px 40px 80px;
   2.168 +}
   2.169 +#content li, #content-full li {
   2.170 +	line-height: 1.5em;
   2.171 +	text-align: left;
   2.172 +}
   2.173 +#news li {
   2.174 +	list-style-type: square;
   2.175 +	border-bottom: 1px dotted #BEBEBE;
   2.176 +	margin-left: -25px;
   2.177 +	padding: 4px 0px 4px 0px;
   2.178 +}
   2.179 +#news a { text-decoration: none; }
   2.180 +
   2.181 +/* Box and block. */
   2.182 +
   2.183 +.infobox {
   2.184 +	margin: 20px 60px;
   2.185 +	padding: 12px;
   2.186 +	background: #f8f8f8;
   2.187 +}
   2.188 +.infobox img { vertical-align: middle; }
   2.189 +.infobox:hover { background-color: #FBFBFB; }
   2.190 +.block {
   2.191 +	/*padding-bottom: 35%;*/
   2.192 +	color: black;
   2.193 +	min-height: 200px;
   2.194 +	margin-bottom: 40px;
   2.195 +}
   2.196 +.block ul {
   2.197 +	list-style-type: none;
   2.198 +	margin: 0;
   2.199 +	padding: 0 20px;
   2.200 +}
   2.201 +.block_left {
   2.202 +	width: 46%;
   2.203 +	float: left;
   2.204 +	background-color: #eaeaea;
   2.205 +	margin: 4px 2px;
   2.206 +	padding: 0 10px 10px 10px;
   2.207 +}
   2.208 +.block_right {
   2.209 +	width: 46%;
   2.210 +	float: right;
   2.211 +	background-color: #eaeaea;
   2.212 +	margin: 4px 2px;
   2.213 +	padding: 0 10px 10px 10px;
   2.214 +}
   2.215 +#block_top {
   2.216 +	color: black;
   2.217 +	background-color: #eaeaea;
   2.218 +	min-height: 180px;
   2.219 +	margin-bottom: 40px;
   2.220 +	margin-right: 340px;
   2.221 +	padding: 0 10px;
   2.222 +}
   2.223 +#block_nav {
   2.224 +	width: 300px;
   2.225 +	min-height: 180px;
   2.226 +	float: right;
   2.227 +	background-color: #eaeaea;
   2.228 +	margin: 0;
   2.229 +	padding: 0 10px;
   2.230 +}
   2.231 +.nav_box, .infobox, .block_left, .block_right, #block_top, 
   2.232 +#block_nav, #footer {
   2.233  	-moz-border-radius: 8px;
   2.234  	-webkit-border-radius: 8px;
   2.235  	border-radius: 8px;
   2.236 @@ -151,171 +225,20 @@
   2.237  	transition-property: background-color;
   2.238  	transition-duration: 2s;
   2.239  }
   2.240 -
   2.241 -.nav_box:hover { background-color: #f8f8f8; }
   2.242 -
   2.243 -#nav .nav_box p {
   2.244 -	line-height: 1.3em;
   2.245 -}
   2.246 -
   2.247 -#nav .nav_box p a {
   2.248 -	display: inline;
   2.249 -	font-weight: normal;
   2.250 -	text-decoration: underline;
   2.251 -}
   2.252 -
   2.253 -#nav .nav_box p a:hover {
   2.254 -	text-decoration: none;
   2.255 -	color: blue;
   2.256 -	background: inherit;
   2.257 -}
   2.258 -
   2.259 -/* Page content */
   2.260 -
   2.261 -#content {
   2.262 -	background: white;
   2.263 -	color: black;
   2.264 -	text-align: justify;
   2.265 -	height: auto;
   2.266 -	margin: 6px 320px 0px 0px;
   2.267 -	padding: 0px 40px 60px 80px;
   2.268 -}
   2.269 -
   2.270 -#content-full {
   2.271 -	background: white;
   2.272 -	color: black;
   2.273 -	text-align: justify;
   2.274 -	height: auto;
   2.275 -	margin: 0;
   2.276 -	padding: 0px 80px 40px 80px;
   2.277 -}
   2.278 -
   2.279 -#content li, #content-full li {
   2.280 -	line-height: 1.5em;
   2.281 -	text-align: left;
   2.282 -}
   2.283 -
   2.284 -#news li {
   2.285 -	list-style-type: square;
   2.286 -	border-bottom: 1px dotted #BEBEBE;
   2.287 -	margin-left: -25px;
   2.288 -	padding: 4px 0px 4px 0px;
   2.289 -}
   2.290 -
   2.291 -#news a {
   2.292 -	text-decoration: none;
   2.293 -}
   2.294 -
   2.295 -#gallery {
   2.296 -	text-align: center;
   2.297 -}
   2.298 -
   2.299 -/* Box and block. */
   2.300 -
   2.301 -.infobox {
   2.302 -	margin: 20px 60px;
   2.303 -	padding: 12px;
   2.304 -	background: #f8f8f8;
   2.305 -}
   2.306 -
   2.307 -.infobox img { vertical-align: middle; }
   2.308 -/* .infobox:hover { background-color: #f2b21d; } */
   2.309 -.infobox:hover { background-color: #FBFBFB; }
   2.310 -
   2.311 -.block {
   2.312 -	/*padding-bottom: 35%;*/
   2.313 -	color: black;
   2.314 -	min-height: 200px;
   2.315 -	margin-bottom: 40px;
   2.316 -}
   2.317 -
   2.318 -.block ul {
   2.319 -	list-style-type: none;
   2.320 -	margin: 0;
   2.321 -	padding: 0 20px;
   2.322 -}
   2.323 -
   2.324 -.block_left {
   2.325 -	width: 46%;
   2.326 -	float: left;
   2.327 -	background-color: #eaeaea;
   2.328 -	margin: 4px 2px;
   2.329 -	padding: 0 10px 10px 10px;
   2.330 -}
   2.331 -
   2.332 -.block_right {
   2.333 -	width: 46%;
   2.334 -	float: right;
   2.335 -	background-color: #eaeaea;
   2.336 -	margin: 4px 2px;
   2.337 -	padding: 0 10px 10px 10px;
   2.338 -}
   2.339 -
   2.340 -#block_top {
   2.341 -	color: black;
   2.342 -	background-color: #eaeaea;
   2.343 -	min-height: 180px;
   2.344 -	margin-bottom: 40px;
   2.345 -	margin-right: 340px;
   2.346 -	padding: 0 10px;
   2.347 -}
   2.348 -
   2.349 -#block_nav {
   2.350 -	width: 300px;
   2.351 -	min-height: 180px;
   2.352 -	float: right;
   2.353 -	background-color: #eaeaea;
   2.354 -	margin: 0;
   2.355 -	padding: 0 10px;
   2.356 -}
   2.357 -
   2.358 -.infobox, .block_left, .block_right, #block_top, #block_nav, #footer {
   2.359 -	-moz-border-radius: 8px;
   2.360 -	-webkit-border-radius: 8px;
   2.361 -	border-radius: 8px;
   2.362 -	-moz-box-shadow: 0 1px 3px #666;
   2.363 -	-webkit-box-shadow: 0 1px 3px #666;
   2.364 -	box-shadow: 0 1px 3px #666;
   2.365 -	/* CSS3 transition */
   2.366 -	-webkit-transition-property: background-color;
   2.367 -	-webkit-transition-duration: 2s;
   2.368 -	-moz-transition-property: background-color;
   2.369 -	-moz-transition-duration: 2s;
   2.370 -	transition-property: background-color;
   2.371 -	transition-duration: 2s;
   2.372 -}
   2.373 -
   2.374 -#block_nav {
   2.375 -	font-weight: bold;
   2.376 -}
   2.377 -
   2.378 -#block_nav a {
   2.379 -	text-decoration: none;
   2.380 -}
   2.381 -
   2.382 -#block_nav li a:hover {
   2.383 -	color: #b64b22;
   2.384 -}
   2.385 -
   2.386 -#block_nav ul {
   2.387 -	margin: 0;
   2.388 -	list-style-type: none;
   2.389 -}
   2.390 -
   2.391 -#block_nav h3 {
   2.392 -	font-size: 110%;
   2.393 -}
   2.394 -
   2.395 -.block_left:hover, .block_right:hover, #block_top:hover,
   2.396 -#block_nav:hover, #footer:hover { 
   2.397 +#block_nav { font-weight: bold; }
   2.398 +#block_nav a { text-decoration: none; }
   2.399 +#block_nav li a:hover { color: #b64b22; }
   2.400 +#block_nav ul { margin: 0; list-style-type: none; }
   2.401 +#block_nav h3 { font-size: 110%; }
   2.402 +.nav_box:hover, .block_left:hover, .block_right:hover, 
   2.403 +#block_top:hover, #block_nav:hover, #footer:hover { 
   2.404  	background-color: #f8f8f8;
   2.405  }
   2.406 -
   2.407  .right_box {
   2.408  	width: 50%;
   2.409  	float: right;
   2.410  }
   2.411 -
   2.412 +/* Text transform at 45deg */
   2.413  .floor {
   2.414  	color: #999999;
   2.415  	font-size: 20px;
   2.416 @@ -325,11 +248,29 @@
   2.417  	-ms-transform: rotate(-45deg) skew(15deg, 15deg);
   2.418  	transform: rotate(-45deg) skew(15deg, 15deg);
   2.419  }
   2.420 -	
   2.421 +#twitter, .feedbox {
   2.422 +	margin-top: 20px;
   2.423 +	-moz-border-radius: 8px;
   2.424 +	-webkit-border-radius: 8px;
   2.425 +	border-radius: 8px;
   2.426 +	-moz-box-shadow: 0 1px 3px #666;
   2.427 +	-webkit-box-shadow: 0 1px 3px #666;
   2.428 +	box-shadow: 0 1px 3px #666;
   2.429 +}
   2.430 +.feedbox {
   2.431 +	background-color: #f9f9f9;
   2.432 +	padding: 10px 20px;
   2.433 +	margin: 20px 100px;
   2.434 +}
   2.435 +.feedbox div {
   2.436 +	height: 320px;
   2.437 +	overflow: auto;
   2.438 +}
   2.439 +.feedbox ul { list-style-type: none; margin: 0; }
   2.440 +
   2.441  /* Button */
   2.442  
   2.443  .button { margin-left: 20px; }
   2.444 -
   2.445  .button a { 
   2.446  	background-color: #b64b22;
   2.447  	color: #ffffff;
   2.448 @@ -343,19 +284,17 @@
   2.449  	-webkit-box-shadow: 0 1px 3px #666;
   2.450  	box-shadow: 0 1px 3px #666;
   2.451  }
   2.452 -
   2.453  .button a:hover, input[type=submit]:hover { 
   2.454  	background-color: #a3431f;
   2.455  	color: #ffffff;
   2.456  }
   2.457 -
   2.458  input[type=submit] {
   2.459  	border: 1px solid #b64b22;
   2.460  	background-color: #b64b22;
   2.461  	color: white;
   2.462  	font-weight: bold;
   2.463  	cursor: pointer;
   2.464 -	padding: 2px 10px;
   2.465 +	padding: 3px 10px;
   2.466  	font-size: 14px;
   2.467  	-moz-border-radius: 2px;
   2.468  	-webkit-border-radius: 2px;
   2.469 @@ -363,13 +302,12 @@
   2.470  	-moz-box-shadow: 0 0 5px #666;
   2.471  	-webkit-box-shadow: 0 0 5px#666;
   2.472  	box-shadow: 0 0 5px #666;
   2.473 +	margin-left: -5px;
   2.474  }
   2.475 -
   2.476  input[type=text] {
   2.477  	border: 1px solid #333333;
   2.478  	padding: 3px;
   2.479  	width: 100%;
   2.480 -	max-width: 500px;
   2.481  }
   2.482  
   2.483  /* Clouds */
   2.484 @@ -379,7 +317,7 @@
   2.485  	line-height: 3em;
   2.486  	text-align: center;
   2.487  }
   2.488 -#cloud a { padding: 0 2px; color: #956411; }
   2.489 +#cloud a { padding: 0 2px; color: #444444; }
   2.490  #cloud a.tag1 { font-size: 0.7em; font-weight: 100; }
   2.491  #cloud a.tag2 { font-size: 0.8em; font-weight: 200; }
   2.492  #cloud a.tag3 { font-size: 0.9em; font-weight: 300; }
   2.493 @@ -391,7 +329,7 @@
   2.494  #cloud a.tag9 { font-size: 2.2em; font-weight: 900; }
   2.495  #cloud a.tag10 { font-size: 2.5em; font-weight: 900; }
   2.496  
   2.497 -/* Slideshow. */
   2.498 +/* Slideshow and gallery */
   2.499  
   2.500  #slideshow
   2.501  {
   2.502 @@ -401,23 +339,13 @@
   2.503  	width: 260px;
   2.504  	height: 163px;
   2.505  }
   2.506 -
   2.507  #slideshow img
   2.508  {
   2.509  	border: 0;
   2.510  	width: 260px;
   2.511  	height: 163px;
   2.512  }
   2.513 -
   2.514 -#twitter {
   2.515 -	margin-top: 20px;
   2.516 -	-moz-border-radius: 8px;
   2.517 -	-webkit-border-radius: 8px;
   2.518 -	border-radius: 8px;
   2.519 -	-moz-box-shadow: 0 1px 3px #666;
   2.520 -	-webkit-box-shadow: 0 1px 3px #666;
   2.521 -	box-shadow: 0 1px 3px #666;
   2.522 -}
   2.523 +#gallery { text-align: center; }
   2.524  
   2.525  /* HTML styles */
   2.526  
   2.527 @@ -430,7 +358,6 @@
   2.528  	font-weight: bold;
   2.529  	padding: 5px 0 0 10px;
   2.530  }
   2.531 -
   2.532  h2 {
   2.533  	color: #b64b22;
   2.534  	padding: 0;
   2.535 @@ -438,79 +365,28 @@
   2.536  	font-size: 130%;
   2.537  	font-weight: bold;
   2.538  }
   2.539 -
   2.540  h3 {
   2.541  	font-weight: bold;
   2.542  	color: #666666;
   2.543  	background: transparent;
   2.544  }
   2.545 -	
   2.546 -h3 img { 
   2.547 +h3 img, h2 img { 
   2.548  	vertical-align: middle;
   2.549  	width: 20px;
   2.550  	height: 20px;
   2.551  	padding-right: 4px; 
   2.552  }
   2.553 -
   2.554 -a {
   2.555 -	text-decoration: underline;
   2.556 -	color: #103A5E;
   2.557 -	background: inherit;
   2.558 -}
   2.559 -
   2.560 -a:hover {
   2.561 -	text-decoration: none;
   2.562 -	color: blue;
   2.563 -	background: inherit;
   2.564 -}
   2.565 -
   2.566 -code {
   2.567 +code, tt {
   2.568  	font-size: 12px;
   2.569  	color: #669900;
   2.570 -	background: inherit;
   2.571  }
   2.572 -
   2.573 -tt {
   2.574 -	color: #15EE15;
   2.575 -	background: inherit;
   2.576 -}
   2.577 -
   2.578 -img {
   2.579 -	border: 0pt none;
   2.580 -}
   2.581 -
   2.582 -fieldset {
   2.583 -	background: #E2ECf6;
   2.584 -	color: black;
   2.585 -	margin-top: 25px;
   2.586 -	border: 1px solid black;
   2.587 -}
   2.588 -
   2.589 -legend {
   2.590 -	border: 1px solid black;
   2.591 -	color: #6c0023;
   2.592 -	background: #eaeaea;
   2.593 -	font-weight: bold;
   2.594 -}
   2.595 -
   2.596 -pre {
   2.597 -	padding: 5px;
   2.598 -	color: black;
   2.599 -	background: #E1E0B0;
   2.600 -}
   2.601 -
   2.602 -pre.script {
   2.603 +pre, pre.script {
   2.604  	padding: 10px;
   2.605  	color: black;
   2.606  	background: #E8E8E8;
   2.607  	border: 1px inset #606060;
   2.608  }
   2.609  
   2.610 -textarea {
   2.611 -	background: #E5E5E5;
   2.612 -	margin-top: 12px;
   2.613 -}
   2.614 -
   2.615  /* Packages pages */
   2.616  
   2.617  .pkg_nav {
   2.618 @@ -518,13 +394,11 @@
   2.619  	margin-top: 10px;
   2.620  	padding-top: 10px;
   2.621  }
   2.622 -
   2.623  pre.package {
   2.624  	padding: 0px;
   2.625  	color: black;
   2.626  	background: white;
   2.627  }
   2.628 -
   2.629  p.get {
   2.630  	text-align: center;
   2.631  	padding: 10px;
   2.632 @@ -535,22 +409,15 @@
   2.633  	-moz-border-radius: 4px;
   2.634  	-webkit-border-radius: 4px;
   2.635  }
   2.636 -
   2.637  p.get a {
   2.638  	font-weight: bold;
   2.639  	text-decoration: none;
   2.640  }
   2.641 -
   2.642  .pkgs-search { 
   2.643  	text-align: center; 
   2.644  	padding: 40px 20px 80px 20px;
   2.645  }
   2.646  
   2.647 -.year:after {
   2.648 -	/* content: "2007-2011"; */
   2.649 -	content: "2011";
   2.650 -}
   2.651 -
   2.652  /* Footer */
   2.653  
   2.654  #footer {
   2.655 @@ -567,21 +434,13 @@
   2.656  	-webkit-box-shadow: 0 1px 3px #666;
   2.657  	box-shadow: 0 1px 3px #666;
   2.658  }
   2.659 -#footer a {
   2.660 -	background: inherit;
   2.661 -	color: #666666;
   2.662 +#footer a { color: #666666; }
   2.663 +#footer a:hover { color: #333333; }
   2.664 +#footer ul { list-style-type: none; }
   2.665 +#footer li { padding: 2px; }
   2.666 +#footer h4 { margin: 0 20px; font-size: 125%; }
   2.667 +
   2.668 +.year:after {
   2.669 +	/* content: "2007-2011"; */
   2.670 +	content: "2011";
   2.671  }
   2.672 -#footer a:hover {
   2.673 -	background: inherit;
   2.674 -	color: #333333;
   2.675 -}
   2.676 -#footer ul {
   2.677 -	list-style-type: none;
   2.678 -}
   2.679 -#footer li {
   2.680 -	padding: 2px;
   2.681 -}
   2.682 -#footer h4 {
   2.683 -	margin: 0 20px;
   2.684 -	font-size: 125%;
   2.685 -}