From: Eric Morris <eric@zurb.com>
Date: Thu, 7 Nov 2013 06:28:58 +0000 (-0800)
Subject: Add in generalized button styles and switch away from loud comments
X-Git-Tag: v1.0.0~16
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=e3a78575fa506afeb94b374f8c49276717c8bfb3;p=thirdparty%2Ffoundation%2Ffoundation-emails.git

Add in generalized button styles and switch away from loud comments
---

diff --git a/css/ink.css b/css/ink.css
index eb8ccd62..6ca0bc53 100644
--- a/css/ink.css
+++ b/css/ink.css
@@ -1,10 +1,9 @@
-/* Ink v0.7.0 - Copyright 2013 ZURB Inc */
-
 /**********************************************
-* Client-specific Styles & Reset              *
+* Ink v0.9.0 - Copyright 2013 ZURB Inc        *
 **********************************************/
 
-/* Force Outlook to provide a "view in browser" menu link. */
+/* Client-specific Styles & Reset */
+
 #outlook a { 
   padding:0; 
 } 
@@ -17,12 +16,10 @@ body{
   padding:0;
 }
 
-/* Force Hotmail to display emails at full width */ 
 .ExternalClass { 
   width:100%;
 } 
 
-/* Force Hotmail to display normal line spacing.  More on that: http://www.emailonacid.com/forum/viewthread/43/ */
 .ExternalClass, 
 .ExternalClass p, 
 .ExternalClass span, 
@@ -88,9 +85,7 @@ hr {
   border: none;
 }
 
-/**********************************************
-* Responsive Grid                             *
-**********************************************/
+/* Responsive Grid */
 
 table.body {
   height: 100%;
@@ -196,9 +191,7 @@ td.expander {
   padding: 0 !important;
 }
 
-/**********************************************
-* Block Grid                                  *
-**********************************************/
+/* Block Grid */
 
 .block-grid {
   width: 100%;
@@ -238,9 +231,7 @@ td.expander {
   width:52px;
 }
 
-/**********************************************
-* Alignment & Visibility Classes              *
-**********************************************/
+/* Alignment & Visibility Classes */
 
 table.center, td.center {
   text-align: center;
@@ -271,9 +262,7 @@ img.center {
   display: none;
 }
 
-/**********************************************
-* Typography                                  *
-**********************************************/
+/* Typography */
 
 body, h1, h2, h3, h4, h5, h6, p { 
   color: #222222;
@@ -350,9 +339,7 @@ h6 a:visited {
   color: #2ba6cb !important; 
 } 
 
-/**********************************************
-* Panels                                      *
-**********************************************/
+/* Panels */
 
 td.panel {
   background: #f2f2f2;
@@ -360,24 +347,22 @@ td.panel {
   padding: 10px !important;
 }
 
-/**********************************************
-* Buttons                                     *
-**********************************************/
+/* Buttons */
 
-a.button table,
-a.tiny-button table,
-a.small-button table,
-a.medium-button table,
-a.large-button table {
+.button table,
+.tiny-button table,
+.small-button table,
+.medium-button table,
+.large-button table {
   width: 100%;
   overflow: hidden;
 }
 
-a.button td,
-a.tiny-button td,
-a.small-button td,
-a.medium-button td,
-a.large-button td {
+.button table td,
+.tiny-button table td,
+.small-button table td,
+.medium-button table td,
+.large-button table td {
   display: block;
   width: auto !important;
   text-align: center;
@@ -389,112 +374,108 @@ a.large-button td {
   border: 1px solid #2284a1;
 }
 
-a.tiny-button td {
+.tiny-button table td {
   padding: 5px 10px;
   font-size: 12px;
   font-weight: normal;
 }
 
-a.button td,
-a.small-button td {
+.button table td,
+.small-button table td {
   padding: 8px 15px;
   font-size: 16px;
 }
 
-a.medium-button td {
+.medium-button table td {
   padding: 12px 24px;
   font-size: 20px;
 }
 
-a.large-button td {
+.large-button table td {
   padding: 21px 30px;
   font-size: 24px;
 }
 
-a:hover.button td,
-a:hover.tiny-button td,
-a:hover.small-button td,
-a:hover.medium-button td,
-a:hover.large-button td {
+.button:hover table td,
+.tiny-button:hover table td,
+.small-button:hover table td,
+.medium-button:hover table td,
+.large-button:hover table td {
   background: #2795b6 !important;
 }
 
-a.button,
-a:hover.button,
-a:active.button,
-a:visited.button,
-a.tiny-button,
-a:hover.tiny-button,
-a:active.tiny-button,
-a:visited.tiny-button,
-a.small-button,
-a:hover.small-button,
-a:active.small-button,
-a:visited.small-button,
-a.medium-button,
-a:hover.medium-button,
-a:active.medium-button,
-a:visited.medium-button,
-a.large-button,
-a:hover.large-button,
-a:active.large-button,
-a:visited.large-button {
+.button,
+.button:hover,
+.button:active,
+.button:visited,
+.tiny-button,
+.tiny-button:hover,
+.tiny-button:active,
+.tiny-button:visited,
+.small-button,
+.small-button:hover,
+.small-button:active,
+.small-button:visited,
+.medium-button,
+.medium-button:hover,
+.medium-button:active,
+.medium-button:visited,
+.large-button,
+.large-button:hover,
+.large-button:active,
+.large-button:visited {
   color: #ffffff !important; 
   font-family: Helvetica, Arial, sans-serif; 
   text-decoration: none;
 }
 
-a.secondary td {
+.secondary table td {
   background: #e9e9e9;
   border-color: #d0d0d0;
 }
 
-a:hover.secondary td {
+.secondary:hover table td {
   background: #d0d0d0 !important;
 }
 
-a.success td {
+.success table td {
   background: #5da423;
   border-color: #457a1a;
 }
 
-a:hover.success td {
+.success:hover table td {
   background: #457a1a !important;
 }
 
-a.alert td {
+.alert table td {
   background: #c60f13;
   border-color: #970b0e;
 }
 
-a:hover.alert td {
+.alert:hover table td {
   background: #970b0e !important;
 }
 
-a.radius td {
+.radius table td {
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
 }
 
-a.rounded td {
+.rounded table td {
   -webkit-border-radius: 500px;
   -moz-border-radius: 500px;
   border-radius: 500px;
 }
 
-/**********************************************
-* Outlook First                               *
-**********************************************/
+/* Outlook First */
 
 body.outlook img {
   width: auto !important;
   max-width: none !important;
 }
 
-/**********************************************
-* Media Queries                               *
-**********************************************/
+/*  Media Queries */
 
 @media only screen and (max-width: 600px) {