Author: phobos Date: 2011-08-07 21:16:31 +0000 (Sun, 07 Aug 2011) New Revision: 24946 Modified: website/trunk/css/layout-rtl.css website/trunk/css/layout.css website/trunk/css/typography.css website/trunk/en/index.wml website/trunk/images/icon-Arm.jpg website/trunk/images/icon-Tails.jpg website/trunk/images/icon-TorBrowser.jpg website/trunk/images/icon-TorButton.jpg website/trunk/images/icon-TorCheck.jpg website/trunk/images/icon-TorStatus.jpg website/trunk/images/icon-Vidalia.jpg Log: apply patch from jeremy to fix the project layout, standardize project icons, and css fixes for both rtl and ltr languages. Modified: website/trunk/css/layout-rtl.css =================================================================== --- website/trunk/css/layout-rtl.css 2011-08-04 17:48:07 UTC (rev 24945) +++ website/trunk/css/layout-rtl.css 2011-08-07 21:16:31 UTC (rev 24946) @@ -181,6 +181,15 @@ background-position: left top; } +.project { + float: right; + } + +.project img { + margin-right: 0px; + margin-left: 6px; + } + .meta { float: left; } Modified: website/trunk/css/layout.css =================================================================== --- website/trunk/css/layout.css 2011-08-04 17:48:07 UTC (rev 24945) +++ website/trunk/css/layout.css 2011-08-07 21:16:31 UTC (rev 24946) @@ -417,13 +417,34 @@ text-align: center; padding: 4px 0; } - .fauxhead { background: url(../images/table-arrow.jpg) right top no-repeat; width: 100%; height: 11px; } +#home-our-projects td { + height: 92px; + width: 296px; + padding: 6px; + } + +.project { + float: left; + padding: 6px; + border: 1px solid #CAC8A7; + height: 76px; + width: 284px; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; + } + +.project img { + border: none; + margin-right: 6px; + } + .beige { background: #f5f5df; } .gray { background: #e0e0e0; } @@ -502,7 +523,7 @@ } .featured-project { width: 313px; } - + /* FORM ------------*/ input, select { @@ -662,13 +683,13 @@ text-align: center; color: #222222; border: 2px solid #cbcbaf; - background-color: #ffffed; + background-color: #ffffed; padding: 20px 20px; width: 163px; margin: 0px 0px 0px 10px; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - border-radius: 5px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; } .dbox p { @@ -697,18 +718,18 @@ .dbox input:focus , .dbox select:focus { - -moz-box-shadow: 0px 0px 4px #cbcbaf; - -webkit-box-shadow: 0px 0px 4px #cbcbaf; - box-shadow: 0px 0px 4px #cbcbaf; - border:2px solid #cbcbaf; - background-color: #FFFFFF; - } + -moz-box-shadow: 0px 0px 4px #cbcbaf; + -webkit-box-shadow: 0px 0px 4px #cbcbaf; + box-shadow: 0px 0px 4px #cbcbaf; + border:2px solid #cbcbaf; + background-color: #FFFFFF; + } .dbox input.radio { - border: 0px solid; - background: #ffffed; - padding: 0px 0px; - } + border: 0px solid; + background: #ffffed; + padding: 0px 0px; + } .dbox select.cur { margin-right: 5px; @@ -733,14 +754,14 @@ width: 122px; margin-top: 0px; display: block; - background-color: transparent; - color: transparent; - border:0px solid transparent; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - border-radius: 5px; - margin: 10px auto 10px auto; - padding: 0px 0px 0px 0px; + background-color: transparent; + color: transparent; + border:0px solid transparent; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + margin: 10px auto 10px auto; + padding: 0px 0px 0px 0px; } .dbox span { @@ -847,9 +868,9 @@ width: 115px; margin-top: -3px; display: inline-block; - background-color: transparent; - color: transparent; - border:0px solid transparent; + background-color: transparent; + color: transparent; + border:0px solid transparent; } .dbox.dsmall { @@ -868,9 +889,9 @@ height: auto; margin-top: 0px; display: block; - background-color: transparent; - color: transparent; - border:0px solid transparent; + background-color: transparent; + color: transparent; + border:0px solid transparent; } .dbox.dsmall div label { Modified: website/trunk/css/typography.css =================================================================== --- website/trunk/css/typography.css 2011-08-04 17:48:07 UTC (rev 24945) +++ website/trunk/css/typography.css 2011-08-07 21:16:31 UTC (rev 24946) @@ -216,6 +216,11 @@ padding-left: 10px; margin: 0; } + +.project p { + line-height: 18px; +} + table h3 { font-size: 1.167em; } table p { margin: 0; Modified: website/trunk/en/index.wml =================================================================== --- website/trunk/en/index.wml 2011-08-04 17:48:07 UTC (rev 24945) +++ website/trunk/en/index.wml 2011-08-07 21:16:31 UTC (rev 24946) @@ -57,17 +57,21 @@ license: LGPL v2 --> <td> + <div class="project"> <a href="http://tails.boum.org/"><img src="$(IMGROOT)/icon-Tails.jpg" alt="Tails Icon"></a> <h3><a href="http://tails.boum.org/">Tails</a></h3> <p>Live CD/USB distribution preconfigured to use Tor safely.</p> + </div> </td> <td> + <div class="project"> <a href="https://guardianproject.info/apps/orbot/"><img src="$(IMGROOT)/icon-Orbot.jpg" alt="Orbot Icon"></a> <h3><a href="https://guardianproject.info/apps/orbot/">Orbot</a></h3> <p>Tor for <a href="https://code.google.com/android/">Google Android</a> devices.</p> + </div> </td> </tr> <tr> @@ -77,10 +81,12 @@ license: LGPL v3 --> <td> + <div class="project"> <a href="http://torstatus.blutmagie.de/"><img src="$(IMGROOT)/icon-TorStatus.jpg" alt="TorStatus Icon"></a> <h3><a href="http://torstatus.blutmagie.de/">TorStatus</a></h3> <p>Site providing an overview of the Tor network.</p> + </div> </td> <!-- Icon from the Crystal set author: Everaldo Coelho @@ -88,43 +94,53 @@ license: LGPL v2 --> <td> + <div class="project"> <a href="http://www.atagar.com/arm/"><img src="$(IMGROOT)/icon-Arm.jpg" alt="Arm Icon"></a> <h3><a href="http://www.atagar.com/arm/">Arm</a></h3> <p>Terminal application for monitoring and configuring Tor.</p> + </div> </td> </tr> <tr> <td> + <div class="project"> <a href="<page torbutton/index>"><img src="$(IMGROOT)/icon-TorButton.jpg" alt="Torbutton Icon"></a> <h3><a href="<page torbutton/index>">Torbutton</a></h3> <p>Torbutton is a 1-click way for Firefox users to enable or disable Tor in Firefox.</p> + </div> </td> <td> + <div class="project"> <a href="https://check.torproject.org/"><img src="$(IMGROOT)/icon-TorCheck.jpg" alt="Tor Check Icon"></a> <h3><a href="https://check.torproject.org/">Check</a></h3> <p>Check determines if you are successfully browsing with Tor.</p> + </div> </td> </tr> <tr> <td> + <div class="project"> <a href="<page projects/vidalia>"><img src="$(IMGROOT)/icon-Vidalia.jpg" alt="Vidalia Icon"></a> <h3><a href="<page projects/vidalia>">Vidalia</a></h3> <p>Vidalia is a graphical way to control and view Tor's connections and settings.</p> + </div> </td> <td> + <div class="project"> <a href="<page projects/torbrowser>"><img src="$(IMGROOT)/icon-TorBrowser.jpg" alt="TorBrowser Icon"></a> <h3><a href="<page projects/torbrowser>">Tor Browser</a></h3> <p>Tor Browser contains everything you need to safely browse the Internet. </p> + </div> </td> </tr> </table> Modified: website/trunk/images/icon-Arm.jpg =================================================================== (Binary files differ) Modified: website/trunk/images/icon-Tails.jpg =================================================================== (Binary files differ) Modified: website/trunk/images/icon-TorBrowser.jpg =================================================================== (Binary files differ) Modified: website/trunk/images/icon-TorButton.jpg =================================================================== (Binary files differ) Modified: website/trunk/images/icon-TorCheck.jpg =================================================================== (Binary files differ) Modified: website/trunk/images/icon-TorStatus.jpg =================================================================== (Binary files differ) Modified: website/trunk/images/icon-Vidalia.jpg =================================================================== (Binary files differ)