From 2fa386bee9951a9059ef0c094285d69d5dffddb0 Mon Sep 17 00:00:00 2001
From: connors <connor.sears@github.com>
Date: Sat, 15 Feb 2014 12:09:10 -0800
Subject: [PATCH] icon top

---
 dist/android-theme.css                   |  7 ++--
 dist/ratchet.css                         |  7 ++--
 docs-assets/css/docs.css                 |  7 ++--
 examples/app-default/choose-theater.html | 42 ++++++++++++------------
 lib/sass/bars.scss                       |  8 +++--
 lib/sass/theme-android.scss              |  8 +++--
 6 files changed, 48 insertions(+), 31 deletions(-)

diff --git a/dist/android-theme.css b/dist/android-theme.css
index 3b8c461..9dd1713 100644
--- a/dist/android-theme.css
+++ b/dist/android-theme.css
@@ -179,7 +179,7 @@ a:active {
   color: #33b5e5;
 }
 .bar-tab .tab-item .icon {
-  margin-top: 5px;
+  top: 2px;
 }
 
 .title {
@@ -219,13 +219,16 @@ a:active {
   color: #33b5e5;
   opacity: .6;
 }
+.bar-nav .btn-link .icon {
+  top: 2px;
+}
 
 .bar .segmented-control {
   top: 7px;
 }
 
 .bar .icon {
-  margin-top: 13px;
+  top: 13px;
 }
 
 .bar input[type="search"] {
diff --git a/dist/ratchet.css b/dist/ratchet.css
index 1b5c6a0..d80c9d3 100644
--- a/dist/ratchet.css
+++ b/dist/ratchet.css
@@ -548,7 +548,7 @@ input[type="button"] {
 .bar-tab .tab-item .icon {
   width: 24px;
   height: 24px;
-  margin-top: 4px;
+  top: 2px;
 }
 .bar-tab .tab-item .icon ~ .tab-label {
   display: block;
@@ -596,6 +596,9 @@ input[type="button"] {
   margin-right: -8px;
   margin-left: -3px;
 }
+.bar-nav .btn-link .icon {
+  top: 2px;
+}
 
 .bar .btn-block {
   padding: 7px 0 6px;
@@ -616,9 +619,9 @@ input[type="button"] {
 
 .bar .icon {
   position: relative;
+  top: 10px;
   z-index: 20;
   font-size: 24px;
-  margin-top: 11px;
 }
 .bar .icon.pull-left {
   margin-left: -3px;
diff --git a/docs-assets/css/docs.css b/docs-assets/css/docs.css
index d81a9f8..c31e226 100644
--- a/docs-assets/css/docs.css
+++ b/docs-assets/css/docs.css
@@ -1357,7 +1357,7 @@ hr {
   color: #33b5e5;
 }
 .platform-android .bar-tab .tab-item .icon {
-  margin-top: 5px;
+  top: 2px;
 }
 .platform-android .title {
   position: static;
@@ -1394,11 +1394,14 @@ hr {
   color: #33b5e5;
   opacity: .6;
 }
+.platform-android .bar-nav .btn-link .icon {
+  top: 2px;
+}
 .platform-android .bar .segmented-control {
   top: 7px;
 }
 .platform-android .bar .icon {
-  margin-top: 13px;
+  top: 13px;
 }
 .platform-android .bar input[type="search"] {
   height: 35px;
diff --git a/examples/app-default/choose-theater.html b/examples/app-default/choose-theater.html
index c1bc79d..7640295 100644
--- a/examples/app-default/choose-theater.html
+++ b/examples/app-default/choose-theater.html
@@ -23,7 +23,7 @@
       </a>
       <h1 class="title">Argo</h1>
     </header>
-    
+
     <div class="bar bar-standard bar-header-secondary">
       <form>
         <input type="search" placeholder="Search theaters">
@@ -34,54 +34,54 @@
       <ul class="table-view">
         <li class="table-view-cell table-view-divider">Theaters nearby</li>
         <li class="table-view-cell">
-          <strong>Metreon 16</strong>
+          Metreon 16
           <p>1.3 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>AMC 5</strong>
+          AMC 5
           <p>3.5 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>Regal 42</strong>
+          Regal 42
           <p>7.3 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>Shorline theater</strong>
+          Shorline theater
           <p>12.5 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>AMC 16</strong>
+          AMC 16
           <p>12.2 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>BW3 16</strong>
+          BW3 16
           <p>13.4 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>MC Hammer 16</strong>
+          MC Hammer 16
           <p>14.1 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>AMC 3</strong>
+          AMC 3
           <p>14.3 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>AMC 2</strong>
+          AMC 2
           <p>14.7 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
         <li class="table-view-cell">
-          <strong>AMC 10</strong>
+          AMC 10
           <p>15 miles away</p>
-          <a class="btn btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
+          <a class="btn btn-outlined btn-positive" href="checkout.html" data-transition="slide-in">Buy Tickets</a>
         </li>
       </ul>
     </div>
diff --git a/lib/sass/bars.scss b/lib/sass/bars.scss
index f537fa7..f4d0ff4 100644
--- a/lib/sass/bars.scss
+++ b/lib/sass/bars.scss
@@ -112,7 +112,7 @@
     .icon {
       width: 24px;
       height: 24px;
-      margin-top: 4px;
+      top: 2px;
 
       // Make the label smaller if it's used with an icon
       ~ .tab-label {
@@ -174,6 +174,10 @@
       margin-left: -3px;
     }
   }
+  // Position icons in link buttons correctly.
+  .icon {
+    top: 2px;
+  }
 }
 
 
@@ -214,9 +218,9 @@
 
 .bar .icon {
   position: relative;
+  top: 10px;
   z-index: 20; // Position the buttons on top of .title
   font-size: 24px;
-  margin-top: 11px;
 
   &.pull-left {
     margin-left: -3px;
diff --git a/lib/sass/theme-android.scss b/lib/sass/theme-android.scss
index 6ebe6ab..e46bcaa 100644
--- a/lib/sass/theme-android.scss
+++ b/lib/sass/theme-android.scss
@@ -265,7 +265,7 @@ a {
     }
     
     .icon {
-      margin-top: 5px;
+      top: 2px;
     }
   }
 }
@@ -316,6 +316,10 @@ a {
       color: $primary-color;
       opacity: .6;
     }
+    // Position icons in link buttons correctly.
+    .icon {
+      top: 2px;
+    }
   }
 }
 
@@ -328,7 +332,7 @@ a {
 
 // Bars with Ratchicons
 .bar .icon {
-  margin-top: 13px;
+  top: 13px;
 }
 
 // Standard bars with search forms