wok-stable rev 7932

Up: tazpkg-web (2.0) - Up CSS and layout
author Christophe Lincoln <pankso@slitaz.org>
date Tue Jan 11 14:07:34 2011 +0100 (2011-01-11)
parents 65cf4ba258b7
children f0454c3c0ceb
files tazpkg-web/receipt tazpkg-web/stuff/html/footer.html tazpkg-web/stuff/html/header.html tazpkg-web/stuff/search.cgi tazpkg-web/stuff/style/pics/website/header-img.png tazpkg-web/stuff/style/slitaz.css tazpkg-web/stuff/tazpkg-web
line diff
     1.1 --- a/tazpkg-web/receipt	Tue Jan 11 13:40:16 2011 +0100
     1.2 +++ b/tazpkg-web/receipt	Tue Jan 11 14:07:34 2011 +0100
     1.3 @@ -1,7 +1,7 @@
     1.4  # SliTaz package receipt.
     1.5  
     1.6  PACKAGE="tazpkg-web"
     1.7 -VERSION="1.1"
     1.8 +VERSION="2.0"
     1.9  CATEGORY="network"
    1.10  SHORT_DESC="SliTaz packages Web interfaces (http://pkgs.slitaz.org/)."
    1.11  MAINTAINER="pankso@slitaz.org"
     2.1 --- a/tazpkg-web/stuff/html/footer.html	Tue Jan 11 13:40:16 2011 +0100
     2.2 +++ b/tazpkg-web/stuff/html/footer.html	Tue Jan 11 14:07:34 2011 +0100
     2.3 @@ -1,26 +1,32 @@
     2.4 -<!-- End of content with round corner -->
     2.5 +<!-- End of content -->
     2.6  </div>
     2.7  
     2.8 -<!-- Start of footer and copy notice -->
     2.9 -<div id="copy">
    2.10 -<p>
    2.11 -Last modification : _DATE_ -
    2.12 -<a href="#top">Top of the page</a>
    2.13 -</p>
    2.14 -<p>
    2.15 -Copyright &copy; _YEAR_ <a href="http://www.slitaz.org/">SliTaz</a> -
    2.16 -<a href="http://www.gnu.org/licenses/gpl.html">GNU General Public License</a>
    2.17 -</p>
    2.18 -</div>
    2.19 -
    2.20 -<!-- Bottom and logo's -->
    2.21 -<div id="bottom">
    2.22 -<p>
    2.23 -<a href="http://validator.w3.org/check?uri=referer"><img
    2.24 -	src="http://pkgs.slitaz.org/pics/website/xhtml10.png" alt="Valid XHTML 1.0"
    2.25 -	title="Valid XHTML 1.0"
    2.26 -	style="width: 80px; height: 15px;" /></a>
    2.27 -</p>
    2.28 +<!-- Footer -->
    2.29 +<div id="footer">
    2.30 +	<div class="right_box">
    2.31 +	<h4>SliTaz Network</h4>
    2.32 +		<ul>
    2.33 +			<li><a href="http://www.slitaz.org/">Main Website</a></li>
    2.34 +			<li><a href="http://doc.slitaz.org/">Documentation</a></li>
    2.35 +			<li><a href="http://forum.slitaz.org/">Support Forum</a></li>
    2.36 +			<li><a href="http://scn.slitaz.org/">Community Network</a></li>
    2.37 +			<li><a href="http://twitter.com/slitaz">SliTaz on Twitter</a></li>
    2.38 +			<li><a href="http://distrowatch.com/slitaz">SliTaz on DistroWatch</a></li>
    2.39 +		</ul>
    2.40 +	</div>
    2.41 +	<h4>SliTaz Packages</h4>
    2.42 +	<ul>
    2.43 +		<li><a href="#header">Top of the page</a></li>
    2.44 +		<li>Copyright &copy; <span class="year"></span>
    2.45 +			<a href="http://www.slitaz.org/">SliTaz</a></li>
    2.46 +		<li><a href="http://www.slitaz.org/en/about/">About the project</a></li>
    2.47 +		<li><a href="http://pkgs.slitaz.org/search.cgi">Search packages</a></li>
    2.48 +		<li>Page modified the _DATE_</li>
    2.49 +		<li><a href="http://validator.w3.org/check?uri=referer"><img
    2.50 +		src="http://pkgs.slitaz.org/pics/website/xhtml10.png" 
    2.51 +		title="Code validé XHTML 1.0" alt="Valid XHTML 1.0"
    2.52 +		style="width: 80px; height: 15px; vertical-align: middle;" /></a></li>
    2.53 +	</ul>
    2.54  </div>
    2.55  
    2.56  </body>
     3.1 --- a/tazpkg-web/stuff/html/header.html	Tue Jan 11 13:40:16 2011 +0100
     3.2 +++ b/tazpkg-web/stuff/html/header.html	Tue Jan 11 14:07:34 2011 +0100
     3.3 @@ -15,16 +15,16 @@
     3.4  	<meta name="publisher" content="www.slitaz.org" />
     3.5  	<link rel="shortcut icon" href="http://pkgs.slitaz.org/favicon.ico" />
     3.6  	<link rel="stylesheet"  type="text/css" href="http://pkgs.slitaz.org/slitaz.css" />
     3.7 -	<link rel="alternate" type="application/rss+xml" title="SliTaz Stable Packages" href="rss/stable.xml" />
     3.8 -	<link rel="alternate" type="application/rss+xml" title="SliTaz Cooking Packages" href="rss/cooking.xml" />
     3.9 +	<link rel="alternate" type="application/rss+xml" title="SliTaz Stable Packages" href="/rss/stable.xml" />
    3.10 +	<link rel="alternate" type="application/rss+xml" title="SliTaz Cooking Packages" href="/rss/cooking.xml" />
    3.11  </head>
    3.12 -<body bgcolor="#ffffff">
    3.13 +<body>
    3.14  
    3.15  <!-- Header -->
    3.16  <div id="header">
    3.17 -	<a name="top"></a>
    3.18 +    <!-- Logo -->
    3.19  	<a href="http://pkgs.slitaz.org/"><img id="logo"
    3.20 -	src="http://pkgs.slitaz.org/pics/website/logo.png" title="pkgs.slitaz.org" alt="pkgs.slitaz.org"
    3.21 -	style="border: 0px solid ; width: 200px; height: 74px;" /></a>
    3.22 +		src="/pics/website/logo.png" 
    3.23 +		title="pkgs.slitaz.org" alt="pkgs.slitaz.org" /></a>
    3.24  	<p id="titre">#!/Packages</p>
    3.25  </div>
     4.1 --- a/tazpkg-web/stuff/search.cgi	Tue Jan 11 13:40:16 2011 +0100
     4.2 +++ b/tazpkg-web/stuff/search.cgi	Tue Jan 11 14:07:34 2011 +0100
     4.3 @@ -238,21 +238,15 @@
     4.4  	<link rel="shortcut icon" href="/favicon.ico" />
     4.5  	<link rel="stylesheet"  type="text/css" href="/slitaz.css" />
     4.6  </head>
     4.7 -<body bgcolor="#ffffff">
     4.8 +<body>
     4.9  
    4.10  <!-- Header -->
    4.11  <div id="header">
    4.12 -	<a name="top"></a>
    4.13 -<!-- Access -->
    4.14 -<div id="access">
    4.15 -	<a href="http://www.slitaz.org/" title="SliTaz Web site">Website</a> |
    4.16 -	<a href="http://doc.slitaz.org/" title="SliTaz Community Documentation">Doc</a> |
    4.17 -	<a href="http://labs.slitaz.org/" title="SliTaz laboratories">Labs</a>
    4.18 -</div>
    4.19 +    <!-- Logo -->
    4.20  	<a href="http://pkgs.slitaz.org/"><img id="logo"
    4.21 -	src="/pics/website/logo.png" title="pkgs.slitaz.org" alt="pkgs.slitaz.org"
    4.22 -	style="border: 0px solid ; width: 200px; height: 74px;" /></a>
    4.23 -	<p id="titre">#!/tazpkg/packages</p>
    4.24 +		src="/pics/website/logo.png" 
    4.25 +		title="pkgs.slitaz.org" alt="pkgs.slitaz.org" /></a>
    4.26 +	<p id="titre">#!/Packages</p>
    4.27  </div>
    4.28  _EOF_
    4.29  }
    4.30 @@ -265,34 +259,35 @@
    4.31  <i>$(ls $WOK/ | wc -l) packages and $(unlzma -c $PACKAGES_REPOSITORY/files.list.lzma | wc -l) files in $SLITAZ_VERSION database</i>
    4.32  </center>
    4.33  
    4.34 -<!-- End of content with round corner -->
    4.35 -</div>
    4.36 -<div id="content_bottom">
    4.37 -<div class="bottom_left"></div>
    4.38 -<div class="bottom_right"></div>
    4.39 +<!-- End of content -->
    4.40  </div>
    4.41  
    4.42 -<!-- Start of footer and copy notice -->
    4.43 -<div id="copy">
    4.44 -<p>
    4.45 -Dernière modification : $DATE -
    4.46 -<a href="#top">Top of the page</a>
    4.47 -</p>
    4.48 -<p>
    4.49 -Copyright &copy; $(date +%Y) <a href="http://www.slitaz.org/">SliTaz</a> -
    4.50 -<a href="http://www.gnu.org/licenses/gpl.html">GNU General Public License</a>
    4.51 -</p>
    4.52 -<!-- End of copy -->
    4.53 -</div>
    4.54 -
    4.55 -<!-- Bottom and logo's -->
    4.56 -<div id="bottom">
    4.57 -<p>
    4.58 -<a href="http://validator.w3.org/check?uri=referer"><img
    4.59 -	src="/pics/website/xhtml10.png" alt="Valid XHTML 1.0"
    4.60 -	title="Code validé XHTML 1.0"
    4.61 -	style="width: 80px; height: 15px;" /></a>
    4.62 -</p>
    4.63 +<!-- Footer -->
    4.64 +<div id="footer">
    4.65 +	<div class="right_box">
    4.66 +	<h4>SliTaz Network</h4>
    4.67 +		<ul>
    4.68 +			<li><a href="http://www.slitaz.org/">Main Website</a></li>
    4.69 +			<li><a href="http://doc.slitaz.org/">Documentation</a></li>
    4.70 +			<li><a href="http://forum.slitaz.org/">Support Forum</a></li>
    4.71 +			<li><a href="http://scn.slitaz.org/">Community Network</a></li>
    4.72 +			<li><a href="http://twitter.com/slitaz">SliTaz on Twitter</a></li>
    4.73 +			<li><a href="http://distrowatch.com/slitaz">SliTaz on DistroWatch</a></li>
    4.74 +		</ul>
    4.75 +	</div>
    4.76 +	<h4>SliTaz Packages</h4>
    4.77 +	<ul>
    4.78 +		<li><a href="#header">Top of the page</a></li>
    4.79 +		<li>Copyright &copy; <span class="year"></span>
    4.80 +			<a href="http://www.slitaz.org/">SliTaz</a></li>
    4.81 +		<li><a href="http://www.slitaz.org/en/about/">About the project</a></li>
    4.82 +		<li><a href="http://pkgs.slitaz.org/search.cgi">Search packages</a></li>
    4.83 +		<li>Page modified the _DATE_</li>
    4.84 +		<li><a href="http://validator.w3.org/check?uri=referer"><img
    4.85 +		src="http://pkgs.slitaz.org/pics/website/xhtml10.png" 
    4.86 +		title="Code validé XHTML 1.0" alt="Valid XHTML 1.0"
    4.87 +		style="width: 80px; height: 15px; vertical-align: middle;" /></a></li>
    4.88 +	</ul>
    4.89  </div>
    4.90  
    4.91  </body>
    4.92 @@ -423,18 +418,11 @@
    4.93  	xhtml_header
    4.94  	cat << _EOT_
    4.95  
    4.96 -<!-- Content top. -->
    4.97 -<div id="content_top">
    4.98 -<div class="top_left"></div>
    4.99 -<div class="top_right"></div>
   4.100 -</div>
   4.101 -
   4.102  <!-- Content -->
   4.103  <div id="content">
   4.104 -<a name="content"></a>
   4.105  
   4.106 -<h1><font color="#3E1220">$package</font></h1>
   4.107 -<h2><font color="#DF8F06">$search</font></h2>
   4.108 +<h1>$package</h1>
   4.109 +<h2>$search</h2>
   4.110  _EOT_
   4.111  	search_form
   4.112  	xhtml_footer
   4.113 @@ -442,18 +430,11 @@
   4.114  	xhtml_header
   4.115  	cat << _EOT_
   4.116  
   4.117 -<!-- Content top. -->
   4.118 -<div id="content_top">
   4.119 -<div class="top_left"></div>
   4.120 -<div class="top_right"></div>
   4.121 -</div>
   4.122 -
   4.123  <!-- Content -->
   4.124  <div id="content">
   4.125 -<a name="content"></a>
   4.126  
   4.127 -<h1><font color="#3E1220">$package</font></h1>
   4.128 -<h2><font color="#DF8F06">$search</font></h2>
   4.129 +<h1>$package</h1>
   4.130 +<h2>$search</h2>
   4.131  _EOT_
   4.132  	search_form
   4.133  	if [ "$OBJECT" = "Depends" ]; then
     5.1 Binary file tazpkg-web/stuff/style/pics/website/header-img.png has changed
     6.1 --- a/tazpkg-web/stuff/style/slitaz.css	Tue Jan 11 13:40:16 2011 +0100
     6.2 +++ b/tazpkg-web/stuff/style/slitaz.css	Tue Jan 11 14:07:34 2011 +0100
     6.3 @@ -1,10 +1,10 @@
     6.4  /*
     6.5  	CSS style for SliTaz GNU/Linux website
     6.6 -	www.slitaz.org - (c) 2007 Pankso
     6.7 +	www.slitaz.org - (c) 2011 Pankso
     6.8  */
     6.9  
    6.10  html {
    6.11 -	height:  102%;
    6.12 +	min-height:  102%;
    6.13  }
    6.14  
    6.15  body {
    6.16 @@ -40,20 +40,21 @@
    6.17  	color: #b64b22;
    6.18  }
    6.19  
    6.20 +#access img {
    6.21 +	vertical-align: middle;
    6.22 +}
    6.23 +
    6.24  /* Header and title */
    6.25  
    6.26 -#header{
    6.27 +#header {
    6.28  	/*background: #f0ba08 url(pics/website/header.png) repeat-x top;*/
    6.29  	background: #351a0a url(pics/website/header-img.png) no-repeat top right;
    6.30  	color: black;
    6.31  	width: 100%;
    6.32  	height: 42px;
    6.33  	border-top: 1px solid black;
    6.34 -	border-bottom: 1px solid black;
    6.35 -	margin-bottom: 30px;
    6.36 -	-moz-box-shadow: 0 1px 5px #333;
    6.37 -	-webkit-box-shadow: 0 1px 5px #333;
    6.38 -	box-shadow: 0 1px 5px #333;
    6.39 +	border-bottom: 1px solid #999;
    6.40 +	margin-bottom: 33px;
    6.41  }
    6.42  
    6.43  #titre {
    6.44 @@ -69,9 +70,11 @@
    6.45  	float: left;
    6.46  	left: 16px;
    6.47  	top: -10px;
    6.48 +	width: 200px;
    6.49 +	height: 74px;
    6.50  }
    6.51  
    6.52 -/* Navigation */
    6.53 +/* Side bar Navigation */
    6.54  
    6.55  #nav {
    6.56  	position: absolute;
    6.57 @@ -119,15 +122,10 @@
    6.58  	display: block;
    6.59  }
    6.60  
    6.61 -#nav hr {
    6.62 -	margin: 2px 0px 1px 0px;
    6.63 -	border: 0px;
    6.64 -	border-top: 1px solid #BDBDBD;
    6.65 -}
    6.66 -
    6.67  #nav ul {
    6.68  	-moz-border-radius: 8px;
    6.69  	-webkit-border-radius: 8px;
    6.70 +	border-radius: 8px;
    6.71  	list-style-type: none;
    6.72  	margin: 10px 0;
    6.73  	padding: 10px 24px 10px 24px;
    6.74 @@ -172,11 +170,6 @@
    6.75  	background: inherit;
    6.76  }
    6.77  
    6.78 -#nav hr {
    6.79 -	height: 0px;
    6.80 -	border: 0px solid #eaeaea;
    6.81 -}
    6.82 -
    6.83  /* Page content */
    6.84  
    6.85  #content {
    6.86 @@ -193,8 +186,8 @@
    6.87  	color: black;
    6.88  	text-align: justify;
    6.89  	height: auto;
    6.90 -	margin: 6px 0px 0px 0px;
    6.91 -	padding: 0px 80px 35% 80px;
    6.92 +	margin: 0;
    6.93 +	padding: 0px 80px 40px 80px;
    6.94  }
    6.95  
    6.96  #content li, #content-full li {
    6.97 @@ -202,41 +195,6 @@
    6.98  	text-align: left;
    6.99  }
   6.100  
   6.101 -/* Legal informations */
   6.102 -
   6.103 -#copy {
   6.104 -	font-size: 11px ;
   6.105 -	text-align: left ;
   6.106 -	background: transparent;
   6.107 -	color: #a8a8a8;
   6.108 -	padding-top: 10px;
   6.109 -	margin: 0 0 0 80px;
   6.110 -}
   6.111 -
   6.112 -#copy a {
   6.113 -	background: inherit;
   6.114 -	color: #a8a8a8;
   6.115 -}
   6.116 -
   6.117 -#copy a:hover {
   6.118 -	background: inherit;
   6.119 -	color: #666666;
   6.120 -}
   6.121 -
   6.122 -/* Footer */
   6.123 -
   6.124 -#bottom {
   6.125 -	float: none;
   6.126 -	background: inherit;
   6.127 -	color: black;
   6.128 -	width: auto;
   6.129 -	clear: both;
   6.130 -	padding: 0;
   6.131 -	margin: 0 0 0 80px;
   6.132 -	text-align: left;
   6.133 -	vertical-align: middle;
   6.134 -}
   6.135 -
   6.136  #news li {
   6.137  	list-style-type: square;
   6.138  	border-bottom: 1px dotted #BEBEBE;
   6.139 @@ -252,80 +210,29 @@
   6.140  	text-align: center;
   6.141  }
   6.142  
   6.143 -#gallery table {
   6.144 -	margin: 30px 0px 30px 0px;
   6.145 +/* Box and block. */
   6.146 +
   6.147 +.infobox {
   6.148 +	margin: 20px 60px;
   6.149 +	padding: 12px;
   6.150 +	background: #f8f8f8;
   6.151  }
   6.152  
   6.153 -/* Clouds */
   6.154 -
   6.155 -#cloud {
   6.156 -	padding: 20px 0px 20px 0px;
   6.157 -	line-height: 3em;
   6.158 -	text-align: center;
   6.159 -}
   6.160 -#cloud a { padding: 4px; color: #956411; }
   6.161 -#cloud a.tag1 { font-size: 0.7em; font-weight: 100; }
   6.162 -#cloud a.tag2 { font-size: 0.8em; font-weight: 200; }
   6.163 -#cloud a.tag3 { font-size: 0.9em; font-weight: 300; }
   6.164 -#cloud a.tag4 { font-size: 1.0em; font-weight: 400; }
   6.165 -#cloud a.tag5 { font-size: 1.2em; font-weight: 500; }
   6.166 -#cloud a.tag6 { font-size: 1.4em; font-weight: 600; }
   6.167 -#cloud a.tag7 { font-size: 1.6em; font-weight: 700; }
   6.168 -#cloud a.tag8 { font-size: 1.8em; font-weight: 800; }
   6.169 -#cloud a.tag9 { font-size: 2.2em; font-weight: 900; }
   6.170 -#cloud a.tag10 { font-size: 2.5em; font-weight: 900; }
   6.171 -
   6.172 -/* CSS class. */
   6.173 -
   6.174 -.infobox {
   6.175 -	margin: 10px;
   6.176 -	padding: 12px;
   6.177 -	background: #f8f8f8;
   6.178 -	-moz-border-radius: 8px;
   6.179 -	-webkit-border-radius: 8px;
   6.180 -	border-radius: 8px;
   6.181 -	-moz-box-shadow: 0 1px 3px #666;
   6.182 -	-webkit-box-shadow: 0 1px 3px #666;
   6.183 -	box-shadow: 0 1px 3px #666;
   6.184 -}
   6.185 -
   6.186 -.imagebox {
   6.187 -	min-width: 300px;
   6.188 -	margin: 10px 15%;
   6.189 -	padding: 8px;
   6.190 -	background: transparent;
   6.191 -	text-align: center;
   6.192 -	/* CSS3 transition */
   6.193 -	-webkit-transition-property: background-color;
   6.194 -	-webkit-transition-duration: 3s;
   6.195 -	-moz-transition-property: background-color;
   6.196 -	-moz-transition-duration: 3s;
   6.197 -	transition-property: background-color;
   6.198 -	transition-duration: 3s;
   6.199 -}
   6.200 -
   6.201 -.imagebox:hover, .imagebox img {
   6.202 -	-moz-border-radius: 8px;
   6.203 -	-webkit-border-radius: 8px;
   6.204 -	border-radius: 8px;
   6.205 -	-moz-box-shadow: 0 1px 3px #666;
   6.206 -	-webkit-box-shadow: 0 1px 3px #666;
   6.207 -	box-shadow: 0 1px 3px #666;
   6.208 -}
   6.209 +.infobox img { vertical-align: middle; }
   6.210 +/* .infobox:hover { background-color: #f2b21d; } */
   6.211 +.infobox:hover { background-color: #FBFBFB; }
   6.212  
   6.213  .block {
   6.214  	/*padding-bottom: 35%;*/
   6.215  	color: black;
   6.216  	min-height: 200px;
   6.217 -}
   6.218 -
   6.219 -.block h3 img {
   6.220 -	padding: 0 2px 2px 0;
   6.221 -	margin: 0;
   6.222 +	margin-bottom: 40px;
   6.223  }
   6.224  
   6.225  .block ul {
   6.226 -	list-style-type: square;
   6.227 +	list-style-type: none;
   6.228 +	margin: 0;
   6.229 +	padding: 0 20px;
   6.230  }
   6.231  
   6.232  .block_left {
   6.233 @@ -333,7 +240,7 @@
   6.234  	float: left;
   6.235  	background-color: #eaeaea;
   6.236  	margin: 4px 2px;
   6.237 -	padding: 0 6px;
   6.238 +	padding: 0 10px 10px 10px;
   6.239  }
   6.240  
   6.241  .block_right {
   6.242 @@ -341,10 +248,28 @@
   6.243  	float: right;
   6.244  	background-color: #eaeaea;
   6.245  	margin: 4px 2px;
   6.246 -	padding: 0 6px;
   6.247 +	padding: 0 10px 10px 10px;
   6.248  }
   6.249  
   6.250 -.block_left, .block_right {
   6.251 +#block_top {
   6.252 +	color: black;
   6.253 +	background-color: #eaeaea;
   6.254 +	min-height: 180px;
   6.255 +	margin-bottom: 40px;
   6.256 +	margin-right: 340px;
   6.257 +	padding: 0 10px;
   6.258 +}
   6.259 +
   6.260 +#block_nav {
   6.261 +	width: 300px;
   6.262 +	min-height: 180px;
   6.263 +	float: right;
   6.264 +	background-color: #eaeaea;
   6.265 +	margin: 0;
   6.266 +	padding: 0 10px;
   6.267 +}
   6.268 +
   6.269 +.infobox, .block_left, .block_right, #block_top, #block_nav, #footer {
   6.270  	-moz-border-radius: 8px;
   6.271  	-webkit-border-radius: 8px;
   6.272  	border-radius: 8px;
   6.273 @@ -358,44 +283,178 @@
   6.274  	-moz-transition-duration: 2s;
   6.275  	transition-property: background-color;
   6.276  	transition-duration: 2s;
   6.277 -	/* For browsers that don't support RGBa
   6.278 -	background: rgb(0, 0, 0);*/
   6.279 -	/* RGBa with 0.6 opacity
   6.280 -	background: rgba(0, 0, 0, 0.2);*/
   6.281  }
   6.282  
   6.283 -.block_left:hover, .block_right:hover, .imagebox:hover, #slidebox:hover {
   6.284 -	background-color: #f2b21d;
   6.285 +#block_nav {
   6.286 +	font-weight: bold;
   6.287 +}
   6.288 +
   6.289 +#block_nav a {
   6.290 +	text-decoration: none;
   6.291 +}
   6.292 +
   6.293 +#block_nav li a:hover {
   6.294 +	color: #b64b22;
   6.295 +}
   6.296 +
   6.297 +#block_nav ul {
   6.298 +	margin: 0;
   6.299 +	list-style-type: none;
   6.300 +}
   6.301 +
   6.302 +#block_nav h3 {
   6.303 +	font-size: 110%;
   6.304 +}
   6.305 +
   6.306 +.block_left:hover, .block_right:hover, #block_top:hover,
   6.307 +#block_nav:hover, #footer:hover { 
   6.308 +	background-color: #f8f8f8;
   6.309 +}
   6.310 +
   6.311 +.right_box {
   6.312 +	width: 50%;
   6.313 +	float: right;
   6.314 +}
   6.315 +
   6.316 +.floor {
   6.317 +	color: #999999;
   6.318 +	font-size: 20px;
   6.319 +	-webkit-transform: rotate(-45deg) skew(15deg, 15deg);
   6.320 +	-moz-transform: rotate(-45deg) skew(15deg, 15deg);
   6.321 +	-o-transform: rotate(-45deg) skew(15deg, 15deg);
   6.322 +	-ms-transform: rotate(-45deg) skew(15deg, 15deg);
   6.323 +	transform: rotate(-45deg) skew(15deg, 15deg);
   6.324 +}
   6.325 +	
   6.326 +/* Button */
   6.327 +
   6.328 +.button { margin-left: 20px; }
   6.329 +
   6.330 +.button a { 
   6.331 +	background-color: #b64b22;
   6.332 +	color: #ffffff;
   6.333 +	margin-right: 6px;
   6.334 +	padding: 6px 10px;
   6.335 +	font-size: 14px;
   6.336 +	-moz-border-radius: 4px;
   6.337 +	-webkit-border-radius: 4px;
   6.338 +	border-radius: 4px;
   6.339 +	-moz-box-shadow: 0 1px 3px #666;
   6.340 +	-webkit-box-shadow: 0 1px 3px #666;
   6.341 +	box-shadow: 0 1px 3px #666;
   6.342 +}
   6.343 +
   6.344 +.button a:hover, input[type=submit]:hover { 
   6.345 +	background-color: #a3431f;
   6.346 +	color: #ffffff;
   6.347 +}
   6.348 +
   6.349 +input[type=submit] {
   6.350 +	border: 1px solid #b64b22;
   6.351 +	background-color: #b64b22;
   6.352 +	color: white;
   6.353 +	font-weight: bold;
   6.354 +	cursor: pointer;
   6.355 +	padding: 2px 10px;
   6.356 +	font-size: 14px;
   6.357 +	-moz-border-radius: 2px;
   6.358 +	-webkit-border-radius: 2px;
   6.359 +	border-radius: 2px;
   6.360 +	-moz-box-shadow: 0 0 5px #666;
   6.361 +	-webkit-box-shadow: 0 0 5px#666;
   6.362 +	box-shadow: 0 0 5px #666;
   6.363 +}
   6.364 +
   6.365 +input[type=text] {
   6.366 +	border: 1px solid #333333;
   6.367 +	padding: 3px;
   6.368 +	width: 100%;
   6.369 +	max-width: 500px;
   6.370 +}
   6.371 +
   6.372 +/* Clouds */
   6.373 +
   6.374 +#cloud {
   6.375 +	padding: 10px 0px;
   6.376 +	line-height: 3em;
   6.377 +	text-align: center;
   6.378 +}
   6.379 +#cloud a { padding: 0 2px; color: #956411; }
   6.380 +#cloud a.tag1 { font-size: 0.7em; font-weight: 100; }
   6.381 +#cloud a.tag2 { font-size: 0.8em; font-weight: 200; }
   6.382 +#cloud a.tag3 { font-size: 0.9em; font-weight: 300; }
   6.383 +#cloud a.tag4 { font-size: 1.0em; font-weight: 400; }
   6.384 +#cloud a.tag5 { font-size: 1.2em; font-weight: 500; }
   6.385 +#cloud a.tag6 { font-size: 1.4em; font-weight: 600; }
   6.386 +#cloud a.tag7 { font-size: 1.6em; font-weight: 700; }
   6.387 +#cloud a.tag8 { font-size: 1.8em; font-weight: 800; }
   6.388 +#cloud a.tag9 { font-size: 2.2em; font-weight: 900; }
   6.389 +#cloud a.tag10 { font-size: 2.5em; font-weight: 900; }
   6.390 +
   6.391 +/* Slideshow. */
   6.392 +
   6.393 +#slideshow
   6.394 +{
   6.395 +	overflow: hidden;
   6.396 +	margin: 10px auto 10px;
   6.397 +	position: relative;
   6.398 +	width: 260px;
   6.399 +	height: 163px;
   6.400 +}
   6.401 +
   6.402 +#slideshow img
   6.403 +{
   6.404 +	border: 0;
   6.405 +	width: 260px;
   6.406 +	height: 163px;
   6.407 +}
   6.408 +
   6.409 +#twitter {
   6.410 +	margin-top: 20px;
   6.411 +	-moz-border-radius: 8px;
   6.412 +	-webkit-border-radius: 8px;
   6.413 +	border-radius: 8px;
   6.414 +	-moz-box-shadow: 0 1px 3px #666;
   6.415 +	-webkit-box-shadow: 0 1px 3px #666;
   6.416 +	box-shadow: 0 1px 3px #666;
   6.417  }
   6.418  
   6.419  /* HTML styles */
   6.420  
   6.421  h1 {
   6.422  	color: #444444;
   6.423 -	background: inherit;
   6.424 +	background: transparent;
   6.425  	text-align: left;
   6.426  	margin: 0px 0px 4px 0px;
   6.427  	font-size: 150%;
   6.428  	font-weight: bold;
   6.429 +	padding: 5px 0 0 10px;
   6.430  }
   6.431  
   6.432  h2 {
   6.433  	color: #b64b22;
   6.434  	padding: 0;
   6.435 -	margin: 4px 0 0 0;
   6.436 +	margin: 20px 0 0 0;
   6.437  	font-size: 130%;
   6.438  	font-weight: bold;
   6.439  }
   6.440  
   6.441  h3 {
   6.442  	font-weight: bold;
   6.443 -	color: #390012;
   6.444 +	color: #666666;
   6.445  	background: transparent;
   6.446  }
   6.447 +	
   6.448 +h3 img { 
   6.449 +	vertical-align: middle;
   6.450 +	width: 20px;
   6.451 +	height: 20px;
   6.452 +	padding-right: 4px; 
   6.453 +}
   6.454  
   6.455  a {
   6.456  	text-decoration: underline;
   6.457 -	color: #0F314E;
   6.458 +	color: #103A5E;
   6.459  	background: inherit;
   6.460  }
   6.461  
   6.462 @@ -472,89 +531,57 @@
   6.463  	color: black;
   6.464  	background: #F3F3F3;
   6.465  	border: 1px solid #DEDEDE;
   6.466 +	border-radius: 4px;
   6.467 +	-moz-border-radius: 4px;
   6.468 +	-webkit-border-radius: 4px;
   6.469 +}
   6.470 +
   6.471 +p.get a {
   6.472 +	font-weight: bold;
   6.473 +	text-decoration: none;
   6.474 +}
   6.475 +
   6.476 +.pkgs-search { 
   6.477 +	text-align: center; 
   6.478 +	padding: 40px 20px 80px 20px;
   6.479  }
   6.480  
   6.481  .year:after {
   6.482 -	/* content: "2007-2010"; */
   6.483 -	content: "2010";
   6.484 +	/* content: "2007-2011"; */
   6.485 +	content: "2011";
   6.486  }
   6.487  
   6.488 -/* Slideshow */
   6.489 +/* Footer */
   6.490  
   6.491 -@-webkit-keyframes 'AutoSlide' {
   6.492 -	0% {
   6.493 -		left: 0px; /*1ère image*/
   6.494 -	}
   6.495 -	10% {
   6.496 -		left: 0px; /*idem pour attente*/
   6.497 -	}
   6.498 -	25% {
   6.499 -		left: -240px; /*2ème image*/
   6.500 -	}
   6.501 -	35% {
   6.502 -		left: -240px; /*idem pour attente*/
   6.503 -	}
   6.504 -	70% {
   6.505 -		left: -480px; /*3ème image*/
   6.506 -	}
   6.507 -	75% {
   6.508 -		left: -480px; /*idem pour attente*/
   6.509 -	}
   6.510 -	80% {
   6.511 -		left: -720px; /*idem pour attente*/
   6.512 -	}
   6.513 -	90% {
   6.514 -		left: -720px; /*idem pour attente*/
   6.515 -	}
   6.516 -	100% {
   6.517 -		left: 0px; /*1ère image*/
   6.518 -	}
   6.519 -}
   6.520 -
   6.521 -#slidebox {
   6.522 -	margin: 10px 15%;
   6.523 -	padding: 8px;
   6.524 -	min-width: 300px;
   6.525 -	/* CSS3 transition */
   6.526 -	-webkit-transition-property: background-color;
   6.527 -	-webkit-transition-duration: 3s;
   6.528 -	-moz-transition-property: background-color;
   6.529 -	-moz-transition-duration: 3s;
   6.530 -	transition-property: background-color;
   6.531 -	transition-duration: 3s;
   6.532 -}
   6.533 -#slidebox:hover {
   6.534 +#footer {
   6.535 +	margin: 0px 80px 80px 80px;
   6.536 +	padding: 10px;
   6.537 +	background: #eaeaea;
   6.538 +	color: #666666;
   6.539 +	height: 180px;
   6.540 +	clear: both;
   6.541 +	border-radius: 8px;
   6.542 +	-moz-border-radius: 8px;
   6.543 +	-webkit-border-radius: 8px;
   6.544  	-moz-box-shadow: 0 1px 3px #666;
   6.545  	-webkit-box-shadow: 0 1px 3px #666;
   6.546  	box-shadow: 0 1px 3px #666;
   6.547  }
   6.548 -#slidebox:hover, #slidebox img {
   6.549 -	-moz-border-radius: 8px;
   6.550 -	-webkit-border-radius: 8px;
   6.551 -	border-radius: 8px;
   6.552 +#footer a {
   6.553 +	background: inherit;
   6.554 +	color: #666666;
   6.555  }
   6.556 -
   6.557 -#slideshow {
   6.558 -	position: relative;
   6.559 -	width: 240px;
   6.560 -	height: 150px;
   6.561 -	margin:  10px auto;
   6.562 -	overflow: hidden;
   6.563 +#footer a:hover {
   6.564 +	background: inherit;
   6.565 +	color: #333333;
   6.566  }
   6.567 -
   6.568 -#sContent li {
   6.569 -	display: inline;
   6.570 +#footer ul {
   6.571 +	list-style-type: none;
   6.572  }
   6.573 -#sContent {
   6.574 -	position: absolute;
   6.575 -	top: 0;
   6.576 -	left: 0;
   6.577 -	width: 1000px;
   6.578 -	margin: 0;
   6.579 -	padding: 0;
   6.580 -	/*CSS3 keyframes animation*/
   6.581 -	-webkit-animation-name: AutoSlide;
   6.582 -	-webkit-animation-duration: 10s;
   6.583 -	-webkit-animation-iteration-count: infinite;
   6.584 -	-webkit-animation-timing-function: ease-in-out;
   6.585 +#footer li {
   6.586 +	padding: 2px;
   6.587  }
   6.588 +#footer h4 {
   6.589 +	margin: 0 20px;
   6.590 +	font-size: 125%;
   6.591 +}
     7.1 --- a/tazpkg-web/stuff/tazpkg-web	Tue Jan 11 13:40:16 2011 +0100
     7.2 +++ b/tazpkg-web/stuff/tazpkg-web	Tue Jan 11 14:07:34 2011 +0100
     7.3 @@ -49,18 +49,11 @@
     7.4  {
     7.5  	cat >> $PAGES_DIR/$page.html << _EOF_
     7.6  
     7.7 -<!-- Content top. -->
     7.8 -<div id="content_top">
     7.9 -<div class="top_left"></div>
    7.10 -<div class="top_right"></div>
    7.11 -</div>
    7.12 -
    7.13  <!-- Content -->
    7.14  <div id="content">
    7.15 -<a name="content"></a>
    7.16  
    7.17 -<h1><font color="#3E1220">Packages $RELEASE</font></h1>
    7.18 -<h2><font color="#DF8F06">$h2</font></h2>
    7.19 +<h1>Packages $RELEASE</h1>
    7.20 +<h2>$h2</font></h2>
    7.21  _EOF_
    7.22  }
    7.23