fixes callout bottom margin

diff --git a/package.json b/package.json
index 20eb17957d68aa6d8e97c5f45666e6ff39d8c53b..a9fcd437dacba486ec5f447d46447f67f56a14dc 100644 (file)
--- a/package.json
+++ b/package.json
@@ -42,7 +42,7 @@
     "gulp-sourcemaps": "^1.6.0",
     "gulp-wrap": "^0.11.0",
     "gulp-zip": "^3.2.0",
-    "inky": "^1.2.6",
+    "inky": "^1.3.1",
     "lazypipe": "^1.0.1",
     "motion-ui": "^1.1.1",
     "multiline": "^1.0.2",

diff --git a/scss/components/_callout.scss b/scss/components/_callout.scss
index 7eca1d5873b7d0f62192351d37c7270e432cdd6e..cd667fb5b47b1bdf5b58c2c2981c4ce87f69dc76 100644 (file)
--- a/scss/components/_callout.scss
+++ b/scss/components/_callout.scss
@@ -42,13 +42,16 @@ $callout-border-warning: 1px solid darken($warning-color, 20%) !default;
 /// @type Border
 $callout-border-alert: 1px solid darken($alert-color, 20%) !default;
 
+table.callout {
+  margin-bottom: $callout-margin-bottom;
+  Margin-bottom: $callout-margin-bottom;
+}
+
 th.callout {
   width: 100%;
   border: $callout-border;
   padding: $callout-padding;
   background: $callout-background;
-  margin-bottom: $callout-margin-bottom;
-  Margin-bottom: $callout-margin-bottom;
 
   &.primary {
     background: scale-color($primary-color, $lightness: $callout-background-fade);

diff --git a/test/visual/pages/callout-in-grid.html b/test/visual/pages/callout-in-grid.html
index c74aaa2e2147305520ee1d51d236de5076ee9531..fac2151a060801a8d30b4bf54c847bac29187ec4 100644 (file)
--- a/test/visual/pages/callout-in-grid.html
+++ b/test/visual/pages/callout-in-grid.html
@@ -11,6 +11,26 @@
           </columns>
         </row>
       </callout>
+      <callout class="secondary">
+        <row>
+          <columns>
+            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque necessitatibus perferendis doloremque quod quam nisi, unde ipsum qui, nesciunt reiciendis adipisci. Ratione nemo adipisci aspernatur quaerat tempore omnis delectus ipsam!</p>
+          </columns>
+          <columns>
+            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita, doloremque explicabo aperiam vitae autem dolorum id placeat cumque praesentium qui, similique rerum error quibusdam sed officia eligendi obcaecati illum. Quo!</p>
+          </columns>
+        </row>
+      </callout>
+      <callout class="secondary">
+        <row>
+          <columns>
+            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque necessitatibus perferendis doloremque quod quam nisi, unde ipsum qui, nesciunt reiciendis adipisci. Ratione nemo adipisci aspernatur quaerat tempore omnis delectus ipsam!</p>
+          </columns>
+          <columns>
+            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita, doloremque explicabo aperiam vitae autem dolorum id placeat cumque praesentium qui, similique rerum error quibusdam sed officia eligendi obcaecati illum. Quo!</p>
+          </columns>
+        </row>
+      </callout>
     </columns>
   </row>