fixes expanded button on large

diff --git a/scss/components/_button.scss b/scss/components/_button.scss
index 5c8f5820cb1e34a31618fcbf3f368604e99c5a76..dfc029688d5d297b7b3669a7dc338003d2b00c2a 100755 (executable)
--- 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 7f3d2f21c57a338bd027ab56c9b3786e8544b895..8f682791d2f17a01d12d5d545fc3a05524d55ff4 100755 (executable)
--- 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 213112d38f9260904d7c73eb83029d2b19b846cf..3f1583c5a615fdc6062cb0f2733f3618887fc3ff 100644 (file)
--- 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 7d9a6f828faddb315a8e485aad51c5ced1accd70..96924da8db40bca807e299871f031537236c20ad 100644 (file)
--- 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