[Author Prev][Author Next][Thread Prev][Thread Next][Author Index][Thread Index]

[tor-commits] r25461: {website} properly style the icons in the project page (in website/trunk: css projects/en)



Author: art
Date: 2012-02-21 23:25:22 +0000 (Tue, 21 Feb 2012)
New Revision: 25461

Modified:
   website/trunk/css/layout.css
   website/trunk/projects/en/projects.wml
Log:
properly style the icons in the project page

Modified: website/trunk/css/layout.css
===================================================================
--- website/trunk/css/layout.css	2012-02-21 23:15:55 UTC (rev 25460)
+++ website/trunk/css/layout.css	2012-02-21 23:25:22 UTC (rev 25461)
@@ -50,23 +50,23 @@
 		height: 97px;
 		display: block;
 	}
-	
+
 	#nav {
 	  float: right;
 	}
-		
+
 		#nav ul {
 			height: 50px;
 			float: right;
 			margin-bottom: 0;
 		}
-	
+
 			#nav ul li {
 				float: left;
 				display: inline;
 				width: auto;
 			}
-			
+
 #calltoaction {
   height: 30px;
   float: right;
@@ -74,7 +74,7 @@
   margin-right: 5px;
   text-align: center;
   }
-	
+
   #calltoaction ul {
     padding: 0;
     margin: 0px;
@@ -90,7 +90,7 @@
     width: 100px;
     margin-left: 0px;
     }
-  
+
   #calltoaction ul li a:link,
   #calltoaction ul li a:visited {
     display: block;
@@ -112,7 +112,7 @@
     font-weight: bold;
     text-shadow: 1px 1px 0px #111111;
     }
-  
+
   #calltoaction ul li:first-child a:link,
   #calltoaction ul li:first-child a:visited,
   #calltoaction ul li:hover:first-child a {
@@ -149,7 +149,7 @@
     background: url(../images/cta-buttons.jpg) top right no-repeat #885ca4;
     color: #FFFFFF;
     }
-  
+
   #calltoaction ul li:hover:last-child a {
     background: url(../images/cta-buttons.jpg) bottom right no-repeat #ff9800;
     }
@@ -164,7 +164,7 @@
 			padding: 23px 15px;
 			margin-bottom: 15px;
 		}
-		
+
 		#download a:link,
 		#download a:visited {
 			margin: -17px 0 0;
@@ -175,7 +175,7 @@
 			padding: 35px 0 0 80px;
 			text-decoration: none;
 		}
-		
+
 		#download a .download-tor {
 			background: url(../images/button-download-arrow.png) right center no-repeat;
 			font-family: "Arial Narrow", Arial, sans-serif;
@@ -194,13 +194,13 @@
 			font-size: 0.833em;
 			line-height: 0.833em;
 		}
-		
+
 		#download a:hover {
 			background-position: 0 -114px;
 		}
 		#download a:hover .version,
 		#download a:hover .info { color: #f1c6a1; }
-		
+
 			#banner ul {
 				background: #387520 url(../images/banner-gradient.jpg) left top repeat-x;
 				border: 1px solid #366b32;
@@ -209,7 +209,7 @@
 				margin: 0 15px 0 0;
 				padding: 10px 10px 10px 30px;
 			}
-		
+
 			#banner ul li {
 				list-style: url(../images/white-bullet.png) outside;
 				padding: 5px 0;
@@ -230,48 +230,52 @@
 		width: 620px;
 		margin-right: 20px;
 	}
-	
+
 	#maincol {
 		float: right;
 		width: 710px;
 		margin-bottom: 20px;
 	}
-	
+
 	#maincol-left {
 		float: left;
 		width: 710px;
 		margin-bottom: 20px;
 	}
-			
+
+    #maincol .topforty .icon img {
+        border: none;
+    }
+
 		.subcol {
 			width: 280px;
 			float: left;
 			margin: 0 0 25px;
 		}
-		
+
 			#content .first {
 				margin-right: 20px;
 			}
 
 /* SIDEBAR ------------*/
-		
+
 #home #sidecol {
 	float: right;
 	width: 300px;
 }
-	
+
 #sidecol {
 	float: left;
 	width: 230px;
 	margin-right: 20px;
 }
-	
+
 #sidecol-right {
 	float: right;
 	width: 230px;
 	margin-left: 20px;
 }
-	
+
 	#torusers { margin: 0 0 27px; }
 		.user {
 			margin: 0 0 12px;
@@ -283,7 +287,7 @@
 			margin: 3px 10px 0 0;
 		}
 		.user p { margin: 0; }
-	
+
 /* IMGSHADOW ------------*/
 
 .img-shadow {
@@ -309,13 +313,13 @@
 		background-color: #f7f8f0;
 		border: 1px solid #eeefe8;
 	}
-	
+
 	.img-shadow .infoblock,
 	.img-shadow .important-infoblock {
 		padding: 15px;
 		width: 188px;
 	}
-	
+
 	.img-shadow .custom-infoblock {
 		padding: 15px;
 		height: 120px;
@@ -327,8 +331,8 @@
 	.img-shadow .custom-infoblock p {
 		margin: 0;
 	}
-	
-	
+
+
 /* SIDENAV ------------*/
 
 /*Note: #sidenav-sub is used on the downloads page as a tertiary navigation*/
@@ -338,39 +342,39 @@
 	padding: 10px 0 0;
 	width: 218px;
 }
-		
+
 	#sidenav ul li,
 	.sidenav-sub ul li { border-bottom: 1px solid #ddd; }
-	
+
 	#sidenav ul li.dropdown a:link,
 	#sidenav ul li.dropdown a:visited { background: url(../images/sidenav-arrow.gif) left center no-repeat; }
 	#sidenav ul li.dropdown a.active { background: url(../images/sidenav-arrow-active.gif) left center no-repeat; }
-	
+
 	.sidenav-sub ul li.dropdown a:link,
-	.sidenav-sub ul li.dropdown a:visited { 
+	.sidenav-sub ul li.dropdown a:visited {
 		background: url(../images/sidenav-arrow.gif) left top no-repeat;
 		margin-top: 12px;
 	}
-	
+
 	#sidenav ul li a:link,
 	#sidenav ul li a:visited {
 		display: block;
 		height: auto;
 		padding: 8px 15px 8px 26px;
 	}
-	
+
 	#sidenav ul li ul li a:link,
 	#sidenav ul li ul li a:visited {
 		padding-left: 37px;
 	}
-	
+
 	.sidenav-sub ul li a:link,
 	.sidenav-sub ul li a:visited {
 		display: block;
 		padding: 0 15px 10px 26px;
 		line-height: 16px;
 	}
-	
+
 	#sidenav ul li.active {
 		background: url(../images/sidenav-active.png) left center no-repeat;
 		width: 230px;
@@ -381,7 +385,7 @@
 	#sidenav ul li ul li ul li a:visited {
 		padding-left: 48px;
 	}
-	
+
 /* TABLE ------------*/
 
 table { width: 100%; }
@@ -433,7 +437,7 @@
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
-  }  
+  }
 
 .project img {
   border: none;
@@ -531,7 +535,7 @@
   font-size:0px;
   line-height:0px;
   }
-  
+
 .on:before {
   top: 14px;
   left: 10px;
@@ -539,7 +543,7 @@
   border-right:7px solid transparent;
   border-top:7px solid #FFFFFF;
   }
-  
+
 .off:before {
   top: 9px;
   left: 14px;
@@ -547,8 +551,8 @@
   border-top:7px solid transparent; /* right arrow slant */
   border-left:7px solid #FFFFFF; /* bottom, add background color here */
   }
-  
-  .accordionContent {	
+
+  .accordionContent {
   width: 708px;
   float: left;
   _float: none;  /* Float works in all browsers but IE6 */
@@ -748,7 +752,7 @@
 		background: url(../images/table-title.jpg) left top no-repeat;
 		height: 33px;
 		display: block;
-	}	
+	}
 
 .paypal {
 	float: left;
@@ -757,7 +761,7 @@
 	max-width: 365px;
 }
 	.paypal span { padding-right: 20px; }
-	
+
 .warning-top {
   padding: 10px 10px 10px 60px;
   margin: 0px 10px 0px 10px;
@@ -806,7 +810,7 @@
 		width: auto;
 		margin-right: 10px;
 	}
-	
+
 .featured-project { width: 313px; }
 
 /* FORM ------------*/
@@ -821,7 +825,7 @@
 }
 
 .donate-btn {
-    background: left top no-repeat; 
+    background: left top no-repeat;
 	height: 26px;
 	width: 92px;
 	text-indent: -9999px;
@@ -872,7 +876,7 @@
 }
 	.go:hover { background: #6ab334; }
 
-	
+
 /* FOOTER ------------*/
 
 #footer {
@@ -898,28 +902,28 @@
 		border-right: 1px solid #ddd;
 		float: left;
 	}
-	
+
 	#footer .newsletter {
 		padding: 0 0 15px 30px;
 		width: auto;
 		margin-left: 308px;
 	}
-	
+
 		#footer input.textfield {
 			width: 220px;
 			height: 26px;
 		}
-		
+
 		#footer input {
 			margin: 0;
 		}
-	
+
 	#footer .col {
 		float: left;
 		width: 100px;
 		margin-left: 20px;
 	}
-	
+
 		#footer .first { margin-left: 30px; }
 		#footer .wider { width: 201px; }
 
@@ -947,7 +951,7 @@
 		border-right: 1px solid #444444;
 		margin-left: -4px;
 		}
-	
+
 	.hlist li.last {
 		border-right: 0px solid #444444;
 		}
@@ -962,7 +966,7 @@
 		font-weight: bold;
 		padding: 0px 8px;
 		}
- 
+
 .dbox {
 	float: none;
 	text-align: center;
@@ -1006,7 +1010,7 @@
 		  -moz-box-shadow: 0px 0px 4px #cbcbaf;
 		  -webkit-box-shadow: 0px 0px 4px #cbcbaf;
  		  box-shadow: 0px 0px 4px #cbcbaf;
- 		  border:2px solid #cbcbaf;	
+ 		  border:2px solid #cbcbaf;
 		  background-color: #FFFFFF;
 		  }
 
@@ -1026,7 +1030,7 @@
 		margin-right: 0px;
 		text-align: left;
 		}
-	
+
 	.dbox select#t3 {
 		width: 100%;
 		margin-bottom: 20px;
@@ -1053,7 +1057,7 @@
 		float: left;
 		padding-right: 0px;
 		}
-	
+
 	.dbox div label {
 		padding: 0px 10px 0px 0px;
 		}
@@ -1063,7 +1067,7 @@
 		text-align: center;
 		margin: -15px auto 0px auto;
 		}
-	
+
 	.dbox small,
 	.dbox.donate #ppinfo {
 		margin: 0px auto 0px auto;
@@ -1100,11 +1104,11 @@
 		padding-bottom: 0px;
 		margin-bottom: 0px;
 		}
-	
+
 	.dbox.donate .drow {
 		margin: 0px 0px 0px 20px;
 		}
-	
+
 	.dbox.donate .drow div {
 		padding: 0px 0 0 0px;
 		width: auto;
@@ -1124,12 +1128,12 @@
 	.dbox.donate p {
 		padding: 5px 20px 15px 40px;
 		}
-	
+
 	.dbox.donate span {
 		float: left;
 		padding-right: 0px;
 		}
-	
+
 	.dbox.donate div label {
 		padding: 0px 10px 0px 0px;
 		}
@@ -1155,7 +1159,7 @@
 	.dbox.donate ul.amounts li label {
 		padding: 0px 0px 0px 5px;
 		}
-		
+
 	.dbox.donate input.donate-btn {
 		background: url(../images/btn_donateCC_LG.gif) left top no-repeat transparent;
 		height: 26px;
@@ -1187,7 +1191,7 @@
 		color: transparent;
 		border:0px solid transparent;
 		}
-	
+
 	.dbox.dsmall div label {
 		padding: 0px 0px 0px 0px;
 		}
@@ -1200,7 +1204,7 @@
 		bottom: 20px;
 		margin: 0px auto;
 		}
-	
+
 	.givv p {
 		text-align: justify;
 		margin-top: 10px;

Modified: website/trunk/projects/en/projects.wml
===================================================================
--- website/trunk/projects/en/projects.wml	2012-02-21 23:15:55 UTC (rev 25460)
+++ website/trunk/projects/en/projects.wml	2012-02-21 23:25:22 UTC (rev 25461)
@@ -15,7 +15,7 @@
 <table class="topforty">
 <tr>
 <td>
-<a href="<page torbutton/index>"><img
+<a href="<page torbutton/index>"><img class="icon"
                 src="$(IMGROOT)/icon-TorButton.jpg" alt="TorButton Icon"></a>
 <div class="name"><a href="<page torbutton/index>">Torbutton</a></div>
 <p>Torbutton is integrated into <a href="<page projects/torbrowser>">Tor
@@ -23,7 +23,7 @@
 to your privacy when using a web browser.</p>
 </td>
 <td>
-<a href="<page projects/torbrowser>"><img
+<a href="<page projects/torbrowser>"><img class="icon"
                 src="$(IMGROOT)/icon-TorBrowser.jpg" alt="TorBrowser Icon"></a>
 <div class="name"><a href="<page projects/torbrowser>">Tor Browser Bundle</a></div>
 <p>The Tor Browser Bundle contains everything you need to safely
@@ -33,7 +33,7 @@
 </tr>
 <tr>
 <td>
-<a href="<page projects/vidalia>"><img
+<a href="<page projects/vidalia>"><img class="icon"
               src="$(IMGROOT)/icon-Vidalia.jpg" alt="Vidalia Icon"></a>
 <div class="name"><a href="<page projects/vidalia>">Vidalia</a></div>
 <p>Vidalia is a graphical Tor controller.  It allows you to
@@ -41,7 +41,7 @@
 Tor without getting into configuration files and code.</p>
 </td>
 <td>
-<a href="http://www.atagar.com/arm/";><img
+<a href="http://www.atagar.com/arm/";><img class="icon"
                 src="$(IMGROOT)/icon-Arm.jpg" alt="Arm Icon"></a>
 <div class="name"><a href="<page projects/arm>">Arm</a></div>
 <p>Arm is a terminal status monitor for Tor, intended for
@@ -50,7 +50,7 @@
 Tor's resource utilization and state.</p> </td> </tr>
 <tr>
 <td>
-<a href="https://guardianproject.info/apps/orbot/";><img
+<a href="https://guardianproject.info/apps/orbot/";><img class="icon"
                 src="$(IMGROOT)/icon-Orbot.jpg" alt="Orbot Icon"></a>
 <div class="name"><a
 href="https://guardianproject.info/apps/orbot/";>Orbot</a></div>
@@ -62,7 +62,7 @@
 Orbot/Tor.</p>
 </td>
 <td>
-<a href="http://tails.boum.org/";><img
+<a href="http://tails.boum.org/";><img class="icon"
     src="$(IMGROOT)/icon-Tails.jpg" alt="Tails Icon"></a>
 <div class="name"><a href="https://tails.boum.org/";>Tails</a></div>
 <p>The Amnesic Incognito Live System is a live CD/USB distribution
@@ -72,7 +72,7 @@
 </tr>
 <tr>
 <td>
-<a href="http://torstatus.blutmagie.de/";><img
+<a href="http://torstatus.blutmagie.de/";><img class="icon"
                 src="$(IMGROOT)/icon-TorStatus.jpg" alt="TorStatus Icon"></a>
 <div class="name"><a href="http://torstatus.blutmagie.de/";>TorStatus</a></div>
 <p>Portal providing an overview of the Tor network, including a list of its
@@ -80,7 +80,7 @@
 href="http://torstatus.cyberphunk.org/";>cyberphunk</a> and others.</p>
 </td>
 <td>
-<a href="https://metrics.torproject.org/";><img src="$(IMGROOT)/onion.jpg"/>Metrics Portal</a>
+<a href="https://metrics.torproject.org/";><img class="icon" src="$(IMGROOT)/onion.jpg"/>Metrics Portal</a>
 <div class="name"><a href="https://metrics.torproject.org/";>Metrics Portal</a></div>
 <p>Analytics for the Tor network, including graphs of its available bandwidth
 and estimated userbase. This is a great resource for researchers interested in
@@ -89,7 +89,7 @@
 </tr>
 <tr>
 <td>
-<a href="https://cloud.torproject.org";><img
+<a href="https://cloud.torproject.org";><img class="icon"
               src="$(IMGROOT)/icon-Cloud.jpg" alt="Cloud Icon"></a>
 <div class="name"><a href="https://cloud.torproject.org/";>Tor Cloud</a></div>
 <p>The Tor Cloud project gives you a user-friendly way of deploying
@@ -99,7 +99,7 @@
 Get started with <a href="https://cloud.torproject.org";>Tor Cloud</a>.</p>
 </td>
 <td>
-<a href="<page projects/obfsproxy>"><img src="$(IMGROOT)/onion.jpg"/></a>
+<a href="<page projects/obfsproxy>"><img class="icon" src="$(IMGROOT)/onion.jpg"/></a>
 <div class="name"><a href="<page projects/obfsproxy>">Obfsproxy</a></div>
 <p>Obfsproxy is a pluggable transports proxy written in C. It shapes
 Tor traffic, making it harder for censors to detect and block the Tor

_______________________________________________
tor-commits mailing list
tor-commits@xxxxxxxxxxxxxxxxxxxx
https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-commits