From: Geoff Kimball Date: Fri, 4 Mar 2016 21:35:04 +0000 (-0800) Subject: Add docs page for callout X-Git-Tag: v2.0.0-rc.3~12^2~4 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=0f70577990402d1b18cf8101a19f28e63811117c;p=thirdparty%2Ffoundation%2Ffoundation-emails.git Add docs page for callout --- diff --git a/docs/pages/callout.md b/docs/pages/callout.md new file mode 100644 index 00000000..cf5c33b6 --- /dev/null +++ b/docs/pages/callout.md @@ -0,0 +1,40 @@ +--- +title: Callout +description: Formerly panels, callouts can be used to create sidebar panels or call out important content in an email. +sass: scss/components/_callout.scss +tags: + - panel + - alert +--- + +## Basics + +Callouts use a full table structure, with the class `.callout` applied to the innermost ``. + +When using [Inky](inky.html) HTML, the `` tag will create this structure for you. + +```inky + +

Beware of the Kraken!

+
+``` + +--- + +## Coloring Classes + +The color of a callout can be changed by adding the class `.success`, `.warning`, or `.alert` to the element. + +```inky + +

Successfully avoided Kraken.

+
+ + +

There may be Krakens around.

+
+ + +

Incoming Kraken!

+
+``` diff --git a/docs/partials/component-list.html b/docs/partials/component-list.html index 78793892..c74aa018 100644 --- a/docs/partials/component-list.html +++ b/docs/partials/component-list.html @@ -5,11 +5,11 @@

  • Components
  • -
  • Alignment
  • -
  • Block Grid
  • +
  • Alignment
  • +
  • Block Grid
  • Button
  • -
  • Callout
  • -
  • Global
  • +
  • Callout
  • +
  • Global
  • Grid
  • Grid
  • diff --git a/package.json b/package.json index 617c2d5f..bab4c09e 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "browser-sync": "^2.9.10", "cheerio": "^0.19.0", "foundation-docs": "zurb/foundation-docs", - "foundation-sites": "^6.0.5", + "foundation-sites": "^6.2.0", "gulp": "^3.8.11", "gulp-autoprefixer": "^2.3.1", "gulp-cached": "^1.1.0",