Merge pull request #6086 from basiclines/browser-apply-building_blocks

Bug 806816 - [BB][Browser] Apply building blocks [buttons]

apps/browser/index.html

@@ -12,6 +12,7 @@
     <!-- Localization -->
     <link rel="resource" type="application/l10n" href="locales/locales.ini">
     <!-- Shared code -->
+    <link rel="stylesheet" type="text/css" href="shared/style/buttons.css">
     <script type="application/javascript" src="shared/js/l10n.js"></script>
     <script type="application/javascript" defer src="shared/js/gesture_detector.js"></script>
   </head>
@@ -197,7 +198,7 @@ <h1 data-l10n-id="firefox-settings">Firefox Settings</h1>
       <ul>
         <li>
           <button id="about-firefox-button"
-                  data-l10n-id="about-firefox">About Firefox</button>
+                  data-l10n-id="about-firefox" class="icon icon-view">About Firefox</button>
         </li>
       </ul>
       <header>
@@ -212,7 +213,6 @@ <h2 data-l10n-id="privacy-and-security">Privacy & Security</h2>
           <button id="clear-private-data-button"
                   data-l10n-id="clear-private-data">Clear Private Data</button>
         </li>
-
       </ul>
     </section>
 

apps/browser/style/browser.css

@@ -345,18 +345,19 @@ menu[type="toolbar"] {
   padding: 0;
 }
 
-menu button {
+menu[type="toolbar"] button {
   background-color: transparent;
   -moz-appearance: none;
+  background-position: center;
+  background-repeat: no-repeat;
   border: none;
+  border-radius: 0;
   display: block;
   margin: 0;
   padding: 0;
   width: 80px;
   height: 45px;
   float: left;
-  background-position: center;
-  background-repeat: no-repeat;
 }
 
 #back-button {
@@ -826,6 +827,9 @@ li[role="listitem"] small {
 
 #tray-toolbar button {
   width: 60px;
+  background-repeat: no-repeat;
+  background-position: center, left;
+  border-radius: 0;
 }
 
 #settings-button {
@@ -836,7 +840,6 @@ li[role="listitem"] small {
 
 #new-tab-button {
   background-image: url('images/add.png'), url('images/header-divider.png');
-  background-position: center, left;
   float: right;
   height: 50px;
 }
@@ -864,16 +867,10 @@ li[role="listitem"] small {
 }
 
 #settings li button {
-  display: block;
-  color: #333;
-  width: 100%;
-  line-height: 40px;
-  font-size: 16px;
-  border-radius: 5px;
-  border: 1px solid #999;
-  background-image: -moz-linear-gradient(#FAFAFA, #CCC);
+  margin: 0;
 }
 
+
 #settings li#enable-cookies {
   margin-bottom: 20px;
 }