slitaz-configs rev 79

Improve web homepage with community link and google custom search
author Christophe Lincoln <pankso@slitaz.org>
date Fri Jan 14 07:07:11 2011 +0100 (2011-01-14)
parents 6c6ba7432678
children 135cb938c0e4
files rootfs/usr/share/webhome/index.html rootfs/usr/share/webhome/pics/website/tools.png rootfs/usr/share/webhome/pics/website/users.png rootfs/usr/share/webhome/slitaz.css
line diff
     1.1 --- a/rootfs/usr/share/webhome/index.html	Thu Jan 13 18:38:47 2011 +0000
     1.2 +++ b/rootfs/usr/share/webhome/index.html	Fri Jan 14 07:07:11 2011 +0100
     1.3 @@ -26,23 +26,12 @@
     1.4  
     1.5  <!-- Block begin -->
     1.6  <div class="block">
     1.7 -	<!-- Nav block begin -->
     1.8 -	<div id="block_nav" style="min-height: 200px;">
     1.9 -		<h3><img src="pics/website/network.png" alt="png" />SliTaz</h3>
    1.10 -		<ul>
    1.11 -			<li><a href="http://www.slitaz.org/">Main Website</a></li>
    1.12 -			<li><a href="http://doc.slitaz.org/">Documentation</a></li>
    1.13 -			<li><a href="http://forum.slitaz.org/">Support Forum</a></li>
    1.14 -			<li><a href="http://scn.slitaz.org/">Community Network</a></li>
    1.15 -			<li><a href="http://pkgs.slitaz.org/">Packages</a></li>
    1.16 -			<li><a href="http://twitter.com/slitaz">SliTaz on Twitter</a></li>
    1.17 -			<li><a href="http://distrowatch.com/slitaz">SliTaz on DistroWatch</a></li>
    1.18 -		</ul>	
    1.19 -	<!-- Nav block end -->
    1.20 -	</div>
    1.21 -	<!-- Top block begin -->
    1.22 -	<div id="block_top" style="min-height: 200px;">
    1.23 -	<h1 style="margin-bottom: 50px;">Search the web</h1>
    1.24 +	<!-- Left block begin -->
    1.25 +	<div class="block_left" style="height: 400px; overflow: auto;">
    1.26 +	<h1>Search the web</h1>
    1.27 +		<p>
    1.28 +			Welcome to your SliTaz local homepage.
    1.29 +		</p>
    1.30  		<form method="get" action="http://www.google.com/search">
    1.31  				<p>
    1.32  					<input type="text" name="q" size="24" style="width: 70%;" 
    1.33 @@ -50,15 +39,73 @@
    1.34  					<input type="submit" value="Google" />
    1.35  				</p>
    1.36  			</form>
    1.37 -			<form method="get" action="http://www.wikipedia.org/search-redirect.php">
    1.38 +			<!-- <form method="get" action="http://www.wikipedia.org/search-redirect.php">
    1.39  				<p>
    1.40  					<input type="hidden" name="language" value="en" />
    1.41  					<input type="text" name="search" size="24" style="width: 70%;"
    1.42  						maxlength="255" />
    1.43  					<input type="submit" name="go" value="Wikipedia" />
    1.44  				</p>
    1.45 -			</form>
    1.46 -	<!-- Top block end -->
    1.47 +			</form> -->
    1.48 +		<h3><img src="pics/website/network.png" alt="png" />SliTaz Network</h3>
    1.49 +		<ul>
    1.50 +			<li><a href="http://www.slitaz.org/">Main Website</a></li>
    1.51 +			<li><a href="http://doc.slitaz.org/">Documentation</a></li>
    1.52 +			<li><a href="http://forum.slitaz.org/">Support Forum</a></li>
    1.53 +			<li><a href="http://pkgs.slitaz.org/">Packages</a></li>
    1.54 +			<li><a href="http://boot.slitaz.org/">Web Boot</a></li>
    1.55 +		</ul>
    1.56 +		<h3><img src="pics/website/users.png" alt=".png" />Join the community!</h3>
    1.57 +		<ul>
    1.58 +			<li><a href="http://scn.slitaz.org/image">Community Artwork</a></li>
    1.59 +			<li><a href="http://scn.slitaz.org/blog">Community Blog</a></li>
    1.60 +			<li><a href="http://twitter.com/slitaz">SliTaz on Twitter</a></li>
    1.61 +			<li><a href="http://www.facebook.com/pages/SliTaz/125559834176383">SliTaz on Facebook</a></li>
    1.62 +			<li><a href="http://en.wikipedia.org/wiki/SliTaz_GNU/Linux">SliTaz on Wikipedia</a></li>
    1.63 +		</ul>
    1.64 +	<!-- Left block end -->
    1.65 +	</div>
    1.66 +	<!-- Right block begin -->
    1.67 +	<div class="block_right" style="height: 400px; overflow: auto;">
    1.68 +		<h3><img src="pics/website/tools.png" alt=".png" />SliTaz Search</h3>
    1.69 +		<!-- Google custom search -->
    1.70 +		<div id="cse" style="width: 100%;">Loading</div>
    1.71 +		<script src="http://www.google.com/jsapi" type="text/javascript"></script>
    1.72 +		<script type="text/javascript">
    1.73 +		  google.load('search', '1', {language : 'en', style : google.loader.themes.MINIMALIST});
    1.74 +		  google.setOnLoadCallback(function() {
    1.75 +		    var customSearchControl = new google.search.CustomSearchControl('000868395082919927601:nddq7yjdcxg');
    1.76 +		    customSearchControl.setResultSetSize(google.search.Search.SMALL_RESULTSET);
    1.77 +		    customSearchControl.draw('cse');
    1.78 +		  }, true);
    1.79 +		</script>
    1.80 +		 <style type="text/css">
    1.81 +			input.gsc-search-button {
    1.82 +			    border-color: #b64b22;
    1.83 +			    background-color: #b64b22;
    1.84 +			    cursor: pointer;
    1.85 +			    font-size: 14px;
    1.86 +				-moz-border-radius: 2px;
    1.87 +				-webkit-border-radius: 2px;
    1.88 +				border-radius: 2px;
    1.89 +				-moz-box-shadow: 0 0 5px #666;
    1.90 +				-webkit-box-shadow: 0 0 5px#666;
    1.91 +				box-shadow: 0 0 5px #666;
    1.92 +				-moz-text-shadow: 0 0 0 #666;
    1.93 +				-webkit-text-shadow: 0 0 0 #666;
    1.94 +				text-shadow: 0 0 0 #666;
    1.95 +				
    1.96 +			}
    1.97 +			.gsc-control-cse {
    1.98 +				border: 0pt solid #ffffff;
    1.99 +				background-color: transparent;
   1.100 +			}
   1.101 +			.gs-webResult.gs-result a.gs-title:link,
   1.102 +			.gs-webResult.gs-result a.gs-title:link b { color: #103a5e; }
   1.103 +			.gsc-cursor-page { color: #103a5e; }
   1.104 +			a.gsc-trailing-more-results:link { color: #103a5e; }
   1.105 +		</style>
   1.106 +	<!-- Right block end -->
   1.107  	</div>
   1.108  <!-- Block end -->
   1.109  </div>
     2.1 Binary file rootfs/usr/share/webhome/pics/website/tools.png has changed
     3.1 Binary file rootfs/usr/share/webhome/pics/website/users.png has changed
     4.1 --- a/rootfs/usr/share/webhome/slitaz.css	Thu Jan 13 18:38:47 2011 +0000
     4.2 +++ b/rootfs/usr/share/webhome/slitaz.css	Fri Jan 14 07:07:11 2011 +0100
     4.3 @@ -316,6 +316,39 @@
     4.4  	float: right;
     4.5  }
     4.6  
     4.7 +.floor {
     4.8 +	color: #999999;
     4.9 +	font-size: 20px;
    4.10 +	-webkit-transform: rotate(-45deg) skew(15deg, 15deg);
    4.11 +	-moz-transform: rotate(-45deg) skew(15deg, 15deg);
    4.12 +	-o-transform: rotate(-45deg) skew(15deg, 15deg);
    4.13 +	-ms-transform: rotate(-45deg) skew(15deg, 15deg);
    4.14 +	transform: rotate(-45deg) skew(15deg, 15deg);
    4.15 +}
    4.16 +
    4.17 +#twitter, .feedbox {
    4.18 +	margin-top: 20px;
    4.19 +	-moz-border-radius: 8px;
    4.20 +	-webkit-border-radius: 8px;
    4.21 +	border-radius: 8px;
    4.22 +	-moz-box-shadow: 0 1px 3px #666;
    4.23 +	-webkit-box-shadow: 0 1px 3px #666;
    4.24 +	box-shadow: 0 1px 3px #666;
    4.25 +}
    4.26 +
    4.27 +.feedbox {
    4.28 +	background-color: #f9f9f9;
    4.29 +	padding: 10px 20px;
    4.30 +	margin: 20px 100px;
    4.31 +}
    4.32 +
    4.33 +.feedbox div {
    4.34 +	height: 320px;
    4.35 +	overflow: auto;
    4.36 +}
    4.37 +
    4.38 +.feedbox ul { list-style-type: none; margin: 0; }
    4.39 +
    4.40  /* Button */
    4.41  
    4.42  .button { margin-left: 20px; }
    4.43 @@ -345,7 +378,7 @@
    4.44  	color: white;
    4.45  	font-weight: bold;
    4.46  	cursor: pointer;
    4.47 -	padding: 2px 10px;
    4.48 +	padding: 3px 10px;
    4.49  	font-size: 14px;
    4.50  	-moz-border-radius: 2px;
    4.51  	-webkit-border-radius: 2px;
    4.52 @@ -353,23 +386,23 @@
    4.53  	-moz-box-shadow: 0 0 5px #666;
    4.54  	-webkit-box-shadow: 0 0 5px#666;
    4.55  	box-shadow: 0 0 5px #666;
    4.56 +	margin-left: -5px;
    4.57  }
    4.58  
    4.59  input[type=text] {
    4.60  	border: 1px solid #333333;
    4.61 -	padding: 3px;
    4.62 -	width: 100%;
    4.63 -	max-width: 500px;
    4.64 +	padding: 5px;
    4.65 +	width: 99%;
    4.66  }
    4.67  
    4.68  /* Clouds */
    4.69  
    4.70  #cloud {
    4.71 -	padding: 20px 0px 20px 0px;
    4.72 +	padding: 10px 0px;
    4.73  	line-height: 3em;
    4.74  	text-align: center;
    4.75  }
    4.76 -#cloud a { padding: 4px; color: #956411; }
    4.77 +#cloud a { padding: 0 2px; color: #444444; }
    4.78  #cloud a.tag1 { font-size: 0.7em; font-weight: 100; }
    4.79  #cloud a.tag2 { font-size: 0.8em; font-weight: 200; }
    4.80  #cloud a.tag3 { font-size: 0.9em; font-weight: 300; }
    4.81 @@ -399,16 +432,6 @@
    4.82  	height: 163px;
    4.83  }
    4.84  
    4.85 -#twitter {
    4.86 -	margin-top: 20px;
    4.87 -	-moz-border-radius: 8px;
    4.88 -	-webkit-border-radius: 8px;
    4.89 -	border-radius: 8px;
    4.90 -	-moz-box-shadow: 0 1px 3px #666;
    4.91 -	-webkit-box-shadow: 0 1px 3px #666;
    4.92 -	box-shadow: 0 1px 3px #666;
    4.93 -}
    4.94 -
    4.95  /* HTML styles */
    4.96  
    4.97  h1 {
    4.98 @@ -435,7 +458,7 @@
    4.99  	background: transparent;
   4.100  }
   4.101  	
   4.102 -h3 img { 
   4.103 +h3 img, h2 img { 
   4.104  	vertical-align: middle;
   4.105  	width: 20px;
   4.106  	height: 20px;
   4.107 @@ -549,6 +572,7 @@
   4.108  	background: #eaeaea;
   4.109  	color: #666666;
   4.110  	height: 180px;
   4.111 +	clear: both;
   4.112  	border-radius: 8px;
   4.113  	-moz-border-radius: 8px;
   4.114  	-webkit-border-radius: 8px;