From: RafiBomb <rafi@zurb.com>
Date: Fri, 15 Apr 2016 14:26:52 +0000 (-0700)
Subject: fixes expanded button on large
X-Git-Tag: v2.1.0~13
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=e8e532e4ccb5f0b30077ffcdf6ff5f774e54f5d1;p=thirdparty%2Ffoundation%2Ffoundation-emails.git

fixes expanded button on large
---

diff --git a/scss/components/_button.scss b/scss/components/_button.scss
index 5c8f5820..dfc02968 100755
--- a/scss/components/_button.scss
+++ b/scss/components/_button.scss
@@ -151,7 +151,6 @@ table.expanded {
 
     a {
       text-align: center;
-      width: 100%;
     }
   }
 
@@ -161,6 +160,17 @@ table.expanded {
 }
 
 
+// expanded buttons anchor width
+@for $i from 1 through $grid-column-count {
+  td.large-#{$i} table.expand table a,
+  th.large-#{$i} table.expand table a,
+  td.large-#{$i} table.expanded table a,
+  th.large-#{$i} table.expanded table a {
+    width: -zf-grid-calc-px($i, $grid-column-count, $global-width) !important;
+  }
+}
+
+
 
 table.button:hover,
 table.button:visited,
diff --git a/scss/components/_media-query.scss b/scss/components/_media-query.scss
index 7f3d2f21..8f682791 100755
--- a/scss/components/_media-query.scss
+++ b/scss/components/_media-query.scss
@@ -114,9 +114,28 @@
     width: auto !important;
   }
 
-  // Buttons
-  table.button.expand {
-    width: 100% !important;
+// Rules for the Center Tag    
+ // @for $i from 1 through ($grid-column-count - 1 ) {   
+ //   .body .columns td.small-#{$i},    
+ //   .body .column td.small-#{$i},   
+ //   td.small-#{$i} center,    
+   
+ //   .body .columns th.small-#{$i},    
+ //   .body .column th.small-#{$i},   
+ //   th.small-#{$i} center {   
+ //     display: inline-block !important;   
+ //     width: -zf-grid-calc-pct($i, $grid-column-count) !important;    
+ //   }   
+ // }
+
+  // expanded buttons anchor width
+  @for $i from 1 through $grid-column-count {
+    td.small-#{$i} table.expand table a,
+    th.small-#{$i} table.expand table a,
+    td.small-#{$i} table.expanded table a,
+    th.small-#{$i} table.expanded table a {
+      width: -zf-grid-calc-pct($i, $grid-column-count) !important;
+    }
   }
 }
 
diff --git a/scss/settings/_settings.scss b/scss/settings/_settings.scss
index 213112d3..3f1583c5 100644
--- a/scss/settings/_settings.scss
+++ b/scss/settings/_settings.scss
@@ -137,7 +137,7 @@ $menu-item-color: $primary-color;
 // 8. Thumbnial
 // ------------
 
-$thumbnail-border: solid 4px $white;
+$thumbnail-border: 4px solid $white;
 $thumbnail-margin-bottom: $global-margin;
 $thumbnail-shadow: 0 0 0 1px rgba($black, 0.2);
 $thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5);
diff --git a/test/visual/pages/button-expanded-inky.html b/test/visual/pages/button-expanded-inky.html
index 7d9a6f82..96924da8 100644
--- a/test/visual/pages/button-expanded-inky.html
+++ b/test/visual/pages/button-expanded-inky.html
@@ -1,10 +1,46 @@
 <container>
   <row>
-  <columns small="12" large="6">
-    <button href="zurb.com" class="expand">button 1</button>
-  </columns>
-  <columns small="12" large="6">
-    <button href="zurb.com" class="expanded">example text 2</button>
-  </columns>
+    <columns small="12" large="6">
+      <button href="zurb.com" class="expand">button</button>
+    </columns>
+    <columns small="12" large="6">
+      <button href="zurb.com" class="expand">example text 2</button>
+    </columns>
+  </row>
+
+  <row>
+    <columns small="6" large="6">
+      <button href="zurb.com" class="expand">button</button>
+    </columns>
+    <columns small="6" large="6">
+      <button href="zurb.com" class="expand">example text 2</button>
+    </columns>
+  </row>
+
+  <row>
+    <columns small="12" large="3">
+      <button href="zurb.com" class="expand">button</button>
+    </columns>
+    <columns small="12" large="9">
+      <button href="zurb.com" class="expand">example text 2</button>
+    </columns>
+  </row>
+
+  <row>
+    <columns small="12" large="4">
+      <button href="zurb.com" class="expand">button</button>
+    </columns>
+    <columns small="12" large="8">
+      <button href="zurb.com" class="expand">example text 2</button>
+    </columns>
+  </row>
+
+  <row>
+    <columns small="4" large="4">
+      <button href="zurb.com" class="small expand">button</button>
+    </columns>
+    <columns small="6" large="8">
+      <button href="zurb.com" class="small expand">example text 2</button>
+    </columns>
   </row>
 </container>
\ No newline at end of file