[tor-commits] r24807: {website} Add cta-buttons.jpg, change the floating call to action butt (in website/trunk: css donate/en en images include)

Andrew Lewman andrew at torproject.org
Mon Jun 6 00:54:22 UTC 2011


Author: phobos
Date: 2011-06-06 00:54:21 +0000 (Mon, 06 Jun 2011)
New Revision: 24807

Added:
   website/trunk/images/cta-buttons.jpg
Modified:
   website/trunk/css/ie6.css
   website/trunk/css/ie7-and-down.css
   website/trunk/css/layout-rtl.css
   website/trunk/css/layout.css
   website/trunk/donate/en/donate.wml
   website/trunk/en/navigation.wmi
   website/trunk/include/head.wmi
   website/trunk/include/navigation.wmi
Log:
Add cta-buttons.jpg, change the floating call to action buttons, modify
the css to match the changes.


Modified: website/trunk/css/ie6.css
===================================================================
--- website/trunk/css/ie6.css	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/css/ie6.css	2011-06-06 00:54:21 UTC (rev 24807)
@@ -13,9 +13,24 @@
 #home #sidecol { width: 290px; }
 
 #calltoaction {
-	margin: 0;
+	width: 300px;
 }
 
+#calltoaction ul {
+	width: 300px;
+	}
+
+#calltoaction ul li {
+	padding: 0;
+	margin: 0px;
+	width: 100px;
+	}
+
+#calltoaction ul li a {
+	margin: 0;
+	width: 100px;
+	}
+	
 #banner ul li { list-style: url(../images/white-bullet.gif) outside; }
 
 #sidenav ul li {

Modified: website/trunk/css/ie7-and-down.css
===================================================================
--- website/trunk/css/ie7-and-down.css	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/css/ie7-and-down.css	2011-06-06 00:54:21 UTC (rev 24807)
@@ -2,10 +2,10 @@
 /* IE7 and Lower */
 
 
-#nav { margin: 0; }
+#nav { margin: 0; display: block; }
 #nav ul li a:link,
 #nav ul li a:visited {
-	display: block;
+	display: inline;
 	height: 50px;
 }
 
@@ -28,6 +28,15 @@
 		border-bottom: 1px solid #ddd;
 	}
 
+#calltoaction ul li:first-child a:link,
+#calltoaction ul li:first-child a:visited {
+   background: url(../images/cta-buttons.jpg) top center no-repeat;
+	}
+	
+#calltoaction ul li:hover:first-child a {
+   background: url(../images/cta-buttons.jpg) bottom center no-repeat #ff9800;
+	}
+
 .hlist {
 	text-align: center;
 	display: block;

Modified: website/trunk/css/layout-rtl.css
===================================================================
--- website/trunk/css/layout-rtl.css	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/css/layout-rtl.css	2011-06-06 00:54:21 UTC (rev 24807)
@@ -26,6 +26,7 @@
 			
 #calltoaction {
 	float: left;
+   margin-left: 5px;
 }
 	
 #calltoaction ul {
@@ -33,15 +34,13 @@
 }
     
 #calltoaction ul li {
-  float: right;
-  margin-right: 10px;
+  float: left;
+  margin-right: 0px;
 }
 
 #calltoaction ul li a:link,
 #calltoaction ul li a:visited{
-  border-right: 1px solid #6ab334;
-  border-left: 1px solid #5a952b;
-  float: right;
+  float: left;
 }
 
 #banner {
@@ -189,7 +188,7 @@
 .windows,
 .mac,
 .linux,
-.android { padding: 5px 20px 5px 0; }
+.android { padding: 5px 30px 5px 0; }
 
 .windows { background-position: right center; }
 .mac { background-position: right center; }
@@ -215,8 +214,15 @@
 .warning {
 	background-position: right center;
 }
-.warning p { padding-right: 40px; }
-
+	.warning h2 {
+ 	  background: url("../images/warning2.jpg") no-repeat scroll right top transparent;
+		padding-right: 40px;
+		}
+	
+	.warning p {
+		padding-right: 20px;
+		}
+	
 .focus .icon {
 	float: right;
 	margin-left: 10px;
@@ -250,6 +256,40 @@
 	padding-left: 20px;
 }
 
+/* DONATION ADDITIONS ----------- */
+.dbox {
+	margin: 0px 10px 0px 0px;
+	}
+
+	.dbox input ,
+	.dbox select {
+	   padding: 0px 5px 0px 0px;
+	   }
+	
+	.dbox select.cur {
+		margin-right: 0px;
+		margin-left: 5px;
+		text-align: right;
+		}
+
+.dbox.donate {
+	text-align: right;
+	}
+
+	.dbox.donate .drow {
+		margin: 0px 20px 0px 0px;
+		}
+
+	.dbox.donate ul.amounts {
+		padding-left: 40px;
+		padding-right: 0px;
+		}
+
+.dbox.dl {
+	margin: -50px 20px 20px 0px;
+	float: left;
+  	}
+
 #footer .about {
 	padding-left: 30px;
 	border-left: 1px solid #ddd;

Modified: website/trunk/css/layout.css
===================================================================
--- website/trunk/css/layout.css	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/css/layout.css	2011-06-06 00:54:21 UTC (rev 24807)
@@ -71,45 +71,95 @@
 		height: 30px;
 		float: right;
 		margin-top: 10px;
+		margin-right: 5px;
+		text-align: center;
 	}
 	
     #calltoaction ul {
       padding: 0;
-      margin: 0;
+      margin: 0px;
       height: 30px;
       list-style: none;
       float: right;
     }
-    
+    	     
       #calltoaction ul li {
         list-style: none;
         display: inline;
-        float: left;
-        width: auto;
-        margin-left: 10px;
+        float: none;
+        width: 100px;
+        margin-left: 0px;
       }
       
       #calltoaction ul li a:link,
-      #calltoaction ul li a:visited{
-        background: #96c35a;
-        border-top: 1px solid #6ab334;
-        border-left: 1px solid #6ab334;
-        border-bottom: 1px solid #5a952b;
-        border-right: 1px solid #5a952b;
+      #calltoaction ul li a:visited {
+        background: url(../images/cta-buttons.jpg) top center no-repeat;
         padding: 8px 8px 0px;
-        color: #222c14;
+        color: #FFFFFF;
         font-weight: bold;
         text-decoration: none;
-        font-size: 1.167em;
-        line-height: 1.167em;
+        font-size: 1.067em;
+        line-height: 1.067em;
         height: 22px;
+        width: 84px;
         float: left;
+        text-shadow: 0px -1px 2px #111111, 0px 1px 2px #666666;
       }
+
+      #calltoaction ul li:first-child a:link,
+      #calltoaction ul li:first-child a:visited {
+        background: url(../images/cta-buttons.jpg) top left no-repeat;
+        -webkit-border-top-left-radius: 7px;
+		  -webkit-border-bottom-left-radius: 7px;
+		  -moz-border-radius-topleft: 7px;
+		  -moz-border-radius-bottomleft: 7px;
+		  border-top-left-radius: 7px;
+		  border-bottom-left-radius: 7px;
+        padding-left: 7px;
+        width: 85px;
+        }
+
+      #calltoaction ul li:last-child a:link,
+      #calltoaction ul li:last-child a:visited {
+        background: url(../images/cta-buttons.jpg) top right no-repeat;
+		  -webkit-border-top-right-radius: 7px;
+		  -webkit-border-bottom-right-radius: 7px;
+		  -moz-border-radius-topright: 7px;
+		  -moz-border-radius-bottomright: 7px;
+		  border-top-right-radius: 7px;
+		  border-bottom-right-radius: 7px;
+        padding-right: 9px;
+        width: 83px;
+        color: #FFFFFF;
+       }
       
-      #calltoaction ul li a:hover,
-      #calltoaction ul li a.active { background: #6ab334; }
+      #calltoaction ul li:hover a {
+        background: url(../images/cta-buttons.jpg) bottom center no-repeat #ff9800;
+        font-weight: bold;
+        text-shadow: 1px 1px 4px #111111;
+        }
+      
+      #calltoaction ul li:hover:first-child a {
+        background: url(../images/cta-buttons.jpg) bottom left no-repeat #ff9800;
+        -webkit-border-top-left-radius: 7px;
+		  -webkit-border-bottom-left-radius: 7px;
+		  -moz-border-radius-topleft: 7px;
+		  -moz-border-radius-bottomleft: 7px;
+		  border-top-left-radius: 7px;
+		  border-bottom-left-radius: 7px;
+        }
 
+      #calltoaction ul li:hover:last-child a {
+        background: url(../images/cta-buttons.jpg) bottom right no-repeat #ff9800;
+		  -webkit-border-top-right-radius: 7px;
+		  -webkit-border-bottom-right-radius: 7px;
+		  -moz-border-radius-topright: 7px;
+		  -moz-border-radius-bottomright: 7px;
+		  border-top-right-radius: 7px;
+		  border-bottom-right-radius: 7px;
+        }
 
+
 /* BANNER ------------*/
 
 		#banner {
@@ -654,6 +704,12 @@
 		   background-color: #FFFFFF;
 			}
 
+		.dbox input.radio {
+			border: 0px solid;
+			background: #ffffed;
+			padding: 0px 0px;
+			}
+
 	.dbox select.cur {
 		margin-right: 5px;
 		text-align: left;

Modified: website/trunk/donate/en/donate.wml
===================================================================
--- website/trunk/donate/en/donate.wml	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/donate/en/donate.wml	2011-06-06 00:54:21 UTC (rev 24807)
@@ -92,15 +92,15 @@
 			   </select>
 			  </span>
 			  <ul class="amounts">	
-		      <li><input type="radio" name="amount" value="2000.00"><label for="2000">2000</label></li>
-	  	      <li><input type="radio" name="amount" value="1000.00"><label for="1000">1000</label></li>
-		      <li><input type="radio" name="amount" value="500.00"><label for="500">500</label></li>
-		      <li><input type="radio" name="amount" value="250.00"><label for="250">250</label></li>
-		      <li><input type="radio" name="amount" value="100.00"><label for="100">100</label></li>
-		      <li><input type="radio" name="amount" value="50.00"><label for="50">50</label></li>
-		      <li><input type="radio" name="amount" value="20.00" checked="checked"><label for="20">20</label></li>
-		      <li><input type="radio" name="amount" value="10.00"><label for="10">10</label></li>
-		      <li><input type="radio" name="amount" value="5.00"><label for="5">5</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="2000.00"><label for="2000">2000</label></li>
+	  	      <li><input type="radio" class="radio" name="amount" value="1000.00"><label for="1000">1000</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="500.00"><label for="500">500</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="250.00"><label for="250">250</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="100.00"><label for="100">100</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="50.00"><label for="50">50</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="20.00" checked="checked"><label for="20">20</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="10.00"><label for="10">10</label></li>
+		      <li><input type="radio" class="radio" name="amount" value="5.00"><label for="5">5</label></li>
 		    </ul>
 		   </div>
 		   <div>

Modified: website/trunk/en/navigation.wmi
===================================================================
--- website/trunk/en/navigation.wmi	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/en/navigation.wmi	2011-06-06 00:54:21 UTC (rev 24807)
@@ -7,18 +7,18 @@
 <:
     # path                              link text
     my @navigation = (
-        'index'                       , 'Home',
-        'about/overview'                 , 'About Tor',
+        'index'                        , 'Home',
+        'about/overview'              , 'About Tor',
         'docs/documentation'          , 'Documentation',
-        'projects/projects'         , 'Projects',
+        'projects/projects'           , 'Projects',
         'press/press'                 , 'Press',
         '<blog>'                      , 'Blog',
         'http://printfection.com/torprojectstore' , 'Store',
     );
     my @calltoaction = (
         'download/download'                , 'Download',
+        'getinvolved/volunteer'            , 'Volunteer',
         'donate/donate'                    , 'Donate',
-        'getinvolved/volunteer'          , 'Get Involved',
-    );      
+    );
 
 :>

Added: website/trunk/images/cta-buttons.jpg
===================================================================
(Binary files differ)


Property changes on: website/trunk/images/cta-buttons.jpg
___________________________________________________________________
Added: svn:mime-type
   + image/jpeg

Modified: website/trunk/include/head.wmi
===================================================================
--- website/trunk/include/head.wmi	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/include/head.wmi	2011-06-06 00:54:21 UTC (rev 24807)
@@ -21,6 +21,9 @@
   <ifeq "$(STYLESHEET)" "" "<link rel="stylesheet" type="text/css" href="$(DOCROOT)/css/master.css">">
 
   #<link href="css/master.css" rel="stylesheet" type="text/css">
+  <!--[if lte IE 8]>
+  <link rel="stylesheet" type="text/css" href="$(DOCROOT)/css/ie8-and-down.css">
+  <![endif]-->
   <!--[if lte IE 7]>
   <link rel="stylesheet" type="text/css" href="$(DOCROOT)/css/ie7-and-down.css">
   <![endif]-->

Modified: website/trunk/include/navigation.wmi
===================================================================
--- website/trunk/include/navigation.wmi	2011-06-06 00:51:15 UTC (rev 24806)
+++ website/trunk/include/navigation.wmi	2011-06-06 00:54:21 UTC (rev 24807)
@@ -17,8 +17,8 @@
     );
     my @calltoaction = (
         'download/download'                , 'Download',
+        'getinvolved/volunteer'            , 'Volunteer',
         'donate/donate'                    , 'Donate',
-        'getinvolved/volunteer'            , 'Get Involved',
     );
 
 :>



More information about the tor-commits mailing list