Merge pull request #7690 from woothemes/email-styling-issues

Email styling inconsistencies
This commit is contained in:
Mike Jolley 2015-03-12 10:36:24 +00:00
commit c79fee2c82
2 changed files with 17 additions and 28 deletions

View File

@ -4,32 +4,13 @@
*
* @author WooThemes
* @package WooCommerce/Templates/Emails
* @version 2.0.0
* @version 2.3.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly
}
// Load colours
$base = get_option( 'woocommerce_email_base_color' );
$base_lighter_40 = wc_hex_lighter( $base, 40 );
// For gmail compatibility, including CSS styles in head/body are stripped out therefore styles need to be inline. These variables contain rules which are added to the template inline.
$template_footer = "
border-top:0;
-webkit-border-radius:6px;
";
$credit = "
border:0;
color: $base_lighter_40;
font-family: Arial;
font-size:12px;
line-height:125%;
text-align:center;
";
?>
</div>
</td>
@ -45,12 +26,12 @@ $credit = "
<tr>
<td align="center" valign="top">
<!-- Footer -->
<table border="0" cellpadding="10" cellspacing="0" width="600" id="template_footer" style="<?php echo $template_footer; ?>">
<table border="0" cellpadding="10" cellspacing="0" width="600" id="template_footer">
<tr>
<td valign="top">
<table border="0" cellpadding="10" cellspacing="0" width="100%">
<tr>
<td colspan="2" valign="middle" id="credit" style="<?php echo $credit; ?>">
<td colspan="2" valign="middle" id="credit">
<?php echo wpautop( wp_kses_post( wptexturize( apply_filters( 'woocommerce_email_footer_text', get_option( 'woocommerce_email_footer_text' ) ) ) ) ); ?>
</td>
</tr>

View File

@ -18,6 +18,7 @@ $text = get_option( 'woocommerce_email_text_color' );
$bg_darker_10 = wc_hex_darker( $bg, 10 );
$base_lighter_20 = wc_hex_lighter( $base, 20 );
$base_lighter_40 = wc_hex_lighter( $base, 40 );
$text_lighter_20 = wc_hex_lighter( $text, 20 );
// !important; is a gmail hack to prevent styles being stripped if it doesn't like something.
@ -33,30 +34,37 @@ $text_lighter_20 = wc_hex_lighter( $text, 20 );
#template_container {
box-shadow: 0 1px 4px rgba(0,0,0,0.1) !important;
background-color: <?php echo esc_attr( $body ); ?>;
border: 1px solid <?php echo $bg_darker_10; ?>;
border: 1px solid <?php echo esc_attr( $bg_darker_10 ); ?>;
border-radius: 3px !important;
}
#template_header {
background-color: <?php echo esc_attr( $base ); ?>;
border-radius: 3px 3px 0 0 !important;
color: <?php echo $base_text; ?>;
color: <?php echo esc_attr( $base_text ); ?>;
border-bottom: 0;
font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
font-weight: bold;
line-height: 100%;
vertical-align: middle;
font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
}
#template_header h1 {
color: <?php echo $base_text; ?>;
color: <?php echo esc_attr( $base_text ); ?>;
}
#template_footer td {
padding: 0;
-webkit-border-radius: 6px;
}
#template_footer #credit {
border:0;
color: <?php echo esc_attr( $base_lighter_40 ); ?>;
font-family: Arial;
font-size:12px;
line-height:125%;
text-align:center;
padding: 0 48px 48px 48px;
}
@ -81,7 +89,7 @@ $text_lighter_20 = wc_hex_lighter( $text, 20 );
}
#body_content_inner {
color: <?php echo $text_lighter_20;?>;
color: <?php echo esc_attr( $text_lighter_20 ); ?>;
font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
font-size: 14px;
line-height: 150%;
@ -98,7 +106,7 @@ h1 {
margin: 0;
padding: 36px 48px;
text-align: <?php echo is_rtl() ? 'right' : 'left'; ?>;
text-shadow: 0 1px 0 <?php echo $base_lighter_20; ?>;
text-shadow: 0 1px 0 <?php echo esc_attr( $base_lighter_20 ); ?>;
-webkit-font-smoothing: antialiased;
}