]> git.ipfire.org Git - thirdparty/foundation/foundation-emails.git/commitdiff
removes center tag rules in media query fixes #352
authorRafiBomb <rafi@zurb.com>
Thu, 14 Apr 2016 22:18:19 +0000 (15:18 -0700)
committerRafiBomb <rafi@zurb.com>
Thu, 14 Apr 2016 22:18:19 +0000 (15:18 -0700)
scss/components/_button.scss
scss/components/_media-query.scss
test/visual/pages/alignment.html
test/visual/pages/center.html
test/visual/pages/grid-inky.html

index b1228ffdcdcb6b3a1dd287e4c0b88412ffb02434..4ec03d0f9bfc8436ffbfcd75b1f76adde36dadda 100755 (executable)
@@ -159,6 +159,8 @@ table.expanded {
   }
 }
 
+
+
 table.button:hover,
 table.button:visited,
 table.button:active {
index 6308e597f5bc68b21a663b225afcb219e7bef1a9..7018b63496e956ba9223adb4136de2600ae7de5f 100755 (executable)
     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;
-    }
-  }
-
   @for $i from 1 through ($grid-column-count - 1) {
     table.body td.small-offset-#{$i},
     table.body th.small-offset-#{$i} {
     }
   }
 
-  //Centers the menus!
+  // Centers the menus!
   table.menu[align="center"] {
     width: auto !important;
   }
 
-  //Buttons
+  // Buttons
   table.button.expand {
     width: 100% !important;
   }
index 771a332a80136e32fd6b2a136e877e13e034449a..f7c4994f24ed2cef39066a3ed595fa3386c887d0 100644 (file)
@@ -1,14 +1,20 @@
+<style>
+  .columns {
+    border: 1px solid dodgerblue;
+  }
+</style>
+
 <container>
   <row>
-    <th class="small-4 large-4 columns first">
+    <columns class="small-4 large-4 columns first">
       <center>Centered Text</center>
-    </th>
-    <th class="small-4 large-4 columns">
+    </columns>
+    <columns class="small-4 large-4 columns">
       <center>Centered Text</center>
-    </th>
-    <th class="small-4 large-4 columns last">
+    </columns>
+    <columns class="small-4 large-4 columns last">
       <center>Centered Text</center>
-    </th>
+    </columns>
   </row>
 </container>
 
       <p class="text-left">Left Text</p>
       <h4 class="text-left">Left Text</h4>
       <br>
+      <p>Center on all clients</p>
       <center>
         <img src="http://placehold.it/200?text=center" alt="">
       </center>
       <br>
+      <p>Center on all clients except Outlook 20017, 10, 13</p>
       <img class="float-center" src="http://placehold.it/200?text=center" alt="">
       <img class="float-right" src="http://placehold.it/200?text=right" alt="">
       <img class="float-left" src="http://placehold.it/200?text=left" alt="">
 
 <container>
   <row>
-    <columns></columns>
-    <columns>Centering a column</columns>
-    <columns></columns>
+    <columns small="4"></columns>
+    <columns small="4">Centering a column</columns>
+    <columns small="4"></columns>
   </row>
+
+  <center>
+    <button href="some-place">Center Button</button>
+  </center>
+
+  <row>
+    <columns small="6" large="6">
+      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae error nam, sequi culpa deleniti aperiam saepe, similique laborum corrupti vitae iste mollitia reiciendis corporis qui, quae possimus eos quidem nostrum.</p>
+      <center>
+        <button href="some-place">Center Always</button>
+      </center>
+    </columns>
+    <columns small="6" large="6">
+      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae error nam, sequi culpa deleniti aperiam saepe, similique laborum corrupti vitae iste mollitia reiciendis corporis qui, quae possimus eos quidem nostrum.</p>
+      <center>
+        <button href="some-place">Center Always</button>
+      </center>
+    </columns>
+  </row>
+
 </container>
index d67bac6a4230ad1c6c64a2a7e5b29e165b3e8e8b..a79ca91ee63c1120839e50686fee64dc92e2229b 100644 (file)
@@ -1,3 +1,9 @@
+<style>
+  .columns {
+    border: 1px solid dodgerblue;
+  }
+</style>
+
 <container>
   <row>
     <columns small="12" large="12" class="text-center">
       </center>
     </columns>
   </row>
+    <row>
+    <columns small="6" large="6" class="text-center">
+      <center>
+        <img src="http://placehold.it/150">
+      </center>
+    </columns>
+        <columns small="6" large="6" class="text-center">
+      <center>
+        <img src="http://placehold.it/150">
+      </center>
+    </columns>
+  </row>
 </container>
 
index 4af5e7ca707c553cd132c88b047194d80099a44b..ba8e8dafe4752e850809f8d4f0684e2324e96ca2 100644 (file)
@@ -3,6 +3,9 @@
   table.body {
     background: red !important;
   }
+  .columns {
+    border: 1px solid dodgerblue;
+  }
 </style>
 
 <container>
       <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Suscipit totam quasi ab aliquam saepe non fugiat laborum, veniam corporis alias impedit est nesciunt. Provident numquam cum libero vero minus fuga.</p>
     </columns>
   </row>
-  <row class="collapse">
-    <columns small="12" large="12">
-      <p>This is a collapse column sit amet, consectetur adipisicing elit. Suscipit totam quasi ab aliquam saepe non fugiat laborum, veniam corporis alias impedit est nesciunt. Provident numquam cum libero vero minus fuga.</p>
-    </columns>
-  </row>
   <row>
     <columns small="12" large="6">
       <p>One Word</p>