website rev 697

CSS: Main change to default style (match next cooking :-)
author Christophe Lincoln <pankso@slitaz.org>
date Fri Dec 24 21:53:48 2010 +0100 (2010-12-24)
parents 03df6d72515d
children c9d7335eb96c
files index.php pics/website/desktop.png slitaz.css
line diff
     1.1 --- a/index.php	Fri Dec 24 20:51:26 2010 +0100
     1.2 +++ b/index.php	Fri Dec 24 21:53:48 2010 +0100
     1.3 @@ -36,7 +36,7 @@
     1.4  <div class="nav_box">
     1.5  <h4><img
     1.6  	src="pics/website/locale.png"
     1.7 -	style="vertical-align: middle; width: 20px; height: 20px;"
     1.8 +	style="vertical-align: middle; width: 20px; height: 20px; padding: 0px 2px 0px 2px;"
     1.9  	alt="language" />Language</h4>
    1.10  <div style="width: 50%; position: absolute; right: 0px;">
    1.11  <ul>
    1.12 @@ -103,13 +103,10 @@
    1.13  <div id="content">
    1.14  <a name="content"></a>
    1.15  
    1.16 -<h1><font color="#3E1220">Boot baby... boot!</font></h1>
    1.17 -
    1.18 -<div style="text-align: center;">
    1.19 -<img
    1.20 -	src="pics/website/screenpresentation.png"
    1.21 -	title="SliTaz Desktops" alt="slitaz-desktop"
    1.22 -	style="width: 380px; height: 170px; margin-top: 8px;" />
    1.23 +<h1>Boot baby... boot!</h1>
    1.24 +<div class="imagebox">
    1.25 +<a><img src="pics/website/desktop.png" title="Desktop" alt="desktop"
    1.26 +	style="width: 288px; height: 180px;" />
    1.27  </div>
    1.28  
    1.29  <div id="news">
     2.1 Binary file pics/website/desktop.png has changed
     3.1 --- a/slitaz.css	Fri Dec 24 20:51:26 2010 +0100
     3.2 +++ b/slitaz.css	Fri Dec 24 21:53:48 2010 +0100
     3.3 @@ -12,13 +12,14 @@
     3.4  	color: black;
     3.5  	font: 13px sans-serif, vernada, arial;
     3.6  	margin: 0;
     3.7 +	border-top: 34px solid #f1f1f1;
     3.8  }
     3.9  
    3.10  /* Accessibility */
    3.11  
    3.12  #access {
    3.13  	position: absolute;
    3.14 -	top: 0px;
    3.15 +	top: 4px;
    3.16  	right: 0px;
    3.17  	text-align: right;
    3.18  	width: auto;
    3.19 @@ -26,68 +27,55 @@
    3.20  	padding: 4px 4px 4px 20px;
    3.21  	font-size: 11px;
    3.22  	font-weight: bold;
    3.23 -	/* CSS3 transition */
    3.24 -	-webkit-transition-property: background-color;
    3.25 -	-webkit-transition-duration: 1s;	
    3.26 -	-moz-transition-property: background-color;
    3.27 -	-moz-transition-duration: 1s;
    3.28 -	transition-property: background-color;
    3.29 -	transition-duration: 1s;
    3.30 -}
    3.31 -
    3.32 -#access:hover {
    3.33 -	background-color: #b64b22;
    3.34 -	-moz-border-radius-bottomleft: 8px;
    3.35 -	-webkit-border-radius-bottomleft: 8px;
    3.36 -	border-bottom-left-radius: 8px;
    3.37 -	-moz-box-shadow: 0 1px 3px #666;
    3.38 -	-webkit-box-shadow: 0 1px 3px #666;
    3.39 -	box-shadow: 0 1px 3px #666;
    3.40  }
    3.41  
    3.42  #access a {
    3.43 -	background: inherit;
    3.44 -	color: white;
    3.45 +	background: transparent;
    3.46 +	color: #0F314E;
    3.47  	text-decoration: none;
    3.48  }
    3.49  
    3.50  #access a:hover {
    3.51  	background: inherit;
    3.52 -	color: #222222;
    3.53 +	color: #b64b22;
    3.54  }
    3.55  
    3.56  /* Header and title */
    3.57  
    3.58  #header{
    3.59 -	background: #f0ba08 url(pics/website/header.png) repeat-x top;
    3.60 +	/*background: #f0ba08 url(pics/website/header.png) repeat-x top;*/
    3.61 +	background: #351a0a url(pics/website/header-img.png) no-repeat top right;
    3.62  	color: black;
    3.63  	width: 100%;
    3.64 -	height: 50px;
    3.65 +	height: 42px;
    3.66  	border-top: 1px solid black;
    3.67  	border-bottom: 1px solid black;
    3.68  	margin-bottom: 30px;
    3.69 +	-moz-box-shadow: 0 1px 5px #333;
    3.70 +	-webkit-box-shadow: 0 1px 5px #333;
    3.71 +	box-shadow: 0 1px 5px #333;
    3.72  }
    3.73  
    3.74  #titre {
    3.75  	position: absolute;
    3.76 -	font-size: 16px;
    3.77 +	font-size: 14px;
    3.78  	font-weight: bolder ;
    3.79 -	margin-left: 200px;
    3.80 -	margin-top: 28px;
    3.81 +	left: 180px;
    3.82 +	top: 4px;
    3.83  }
    3.84  
    3.85  #logo {
    3.86  	position: absolute;
    3.87  	float: left;
    3.88 -	margin-left: 16px;
    3.89 -	margin-top: 0px;
    3.90 +	left: 16px;
    3.91 +	top: -10px;
    3.92  }
    3.93  
    3.94  /* Navigation */
    3.95  
    3.96  #nav {
    3.97  	position: absolute;
    3.98 -	top: 76px;
    3.99 +	top: 102px;
   3.100  	right: 80px;
   3.101  	color: #555555;
   3.102  	float: right;
   3.103 @@ -126,7 +114,7 @@
   3.104  }
   3.105  
   3.106  #nav a:hover {
   3.107 -	color: #DF8F06;
   3.108 +	color: #b64b22;
   3.109  	text-decoration: none;
   3.110  	display: block;
   3.111  }
   3.112 @@ -301,19 +289,48 @@
   3.113  	box-shadow: 0 1px 3px #666;
   3.114  }
   3.115  
   3.116 +.imagebox {
   3.117 +	margin: 0 20px;
   3.118 +	padding: 8px;
   3.119 +	background: transparent;
   3.120 +	text-align: center;
   3.121 +	/* CSS3 transition */
   3.122 +	-webkit-transition-property: background-color;
   3.123 +	-webkit-transition-duration: 3s;	
   3.124 +	-moz-transition-property: background-color;
   3.125 +	-moz-transition-duration: 3s;
   3.126 +	transition-property: background-color;
   3.127 +	transition-duration: 3s;
   3.128 +}
   3.129 +
   3.130 +.imagebox:hover, .imagebox img {
   3.131 +	-moz-border-radius: 8px;
   3.132 +	-webkit-border-radius: 8px;
   3.133 +	border-radius: 8px;
   3.134 +	-moz-box-shadow: 0 1px 3px #666;
   3.135 +	-webkit-box-shadow: 0 1px 3px #666;
   3.136 +	box-shadow: 0 1px 3px #666;
   3.137 +}
   3.138 +
   3.139  .block {
   3.140  	/*padding-bottom: 35%;*/
   3.141  	color: black;
   3.142 +	min-height: 200px;
   3.143  }
   3.144  
   3.145  .block h3 img {
   3.146 -	padding: 2px;
   3.147 +	padding: 0 2px 2px 0;
   3.148 +	margin: 0;
   3.149 +}
   3.150 +
   3.151 +.block ul {
   3.152 +	list-style-type: square;
   3.153  }
   3.154  
   3.155  .block_left {
   3.156  	width: 46%;
   3.157  	float: left;
   3.158 -	background-color: #f5f5f5;
   3.159 +	background-color: #eaeaea;
   3.160  	margin: 4px 2px;
   3.161  	padding: 0 6px;
   3.162  }
   3.163 @@ -321,7 +338,7 @@
   3.164  .block_right {
   3.165  	width: 46%;
   3.166  	float: right;
   3.167 -	background-color: #f5f5f5;
   3.168 +	background-color: #eaeaea;
   3.169  	margin: 4px 2px;
   3.170  	padding: 0 6px;
   3.171  }
   3.172 @@ -340,37 +357,39 @@
   3.173  	-moz-transition-duration: 2s;
   3.174  	transition-property: background-color;
   3.175  	transition-duration: 2s;
   3.176 +	/* For browsers that don't support RGBa 
   3.177 +	background: rgb(0, 0, 0);*/
   3.178 +	/* RGBa with 0.6 opacity 
   3.179 +	background: rgba(0, 0, 0, 0.2);*/
   3.180  }
   3.181  
   3.182 -.block_left:hover, .block_right:hover {
   3.183 +.block_left:hover, .block_right:hover, .imagebox:hover {
   3.184  	background-color: #f2b21d;
   3.185  }
   3.186  
   3.187  /* HTML styles */
   3.188  
   3.189  h1 {
   3.190 -	color: blue;
   3.191 +	color: #444444;
   3.192  	background: inherit;
   3.193  	text-align: left;
   3.194 -	margin: 0px 0px 10px 0px;
   3.195 -	font-size: 140%;
   3.196 +	margin: 0px 0px 2px 0px;
   3.197 +	font-size: 150%;
   3.198  	font-weight: bold;
   3.199  }
   3.200  
   3.201  h2 {
   3.202 -	color: #DF8F06;
   3.203 -	/* border-top: 1px solid #f3f3f3; */
   3.204 -	border-left: 8px solid #f3f3f3;
   3.205 -	padding: 4px 0px 4px 4px;
   3.206 +	color: #b64b22;
   3.207 +	padding: 0;
   3.208  	margin: 0;
   3.209 -	font-size: 140%;
   3.210 +	font-size: 130%;
   3.211  	font-weight: bold;
   3.212  }
   3.213  
   3.214  h3 {
   3.215  	font-weight: bold;
   3.216 -	color: #6c0023;
   3.217 -	background: inherit;
   3.218 +	color: #390012;
   3.219 +	background: transparent;
   3.220  }
   3.221  
   3.222  a {