[% # The default colours. color_blue = "#0F87C5" color_blue_darker = "#00527C" color_blue_pale = "#D6E2EB" color_grey = "#D2D2D2" color_gunmetal = "#42494C" color_gunmetal_light = "#81959D" color_yellow = "#FDD008" color_red_dark = "#ce2626" color_green_dark = "#39a515" color_dark_grey = "#3B3F44" color_black = "#000000" color_white = "#ffffff" link_text_color = color_blue link_hover_text_color = color_blue_darker body_background_color = color_gunmetal body_font_family = "Helvetica, Arial, sans-serif" body_text_color = color_gunmetal_light header_background_color = color_yellow header_text_color = color_black header_padding = "15px 20px" # a full CSS padding property (eg: top/right/bottom/left) logo_file = "email-logo.gif" logo_width = "192" # pixel measurement, but without 'px' suffix logo_height = "35" # pixel measurement, but without 'px' suffix logo_font_size = "24px" primary_column_background_color = color_white primary_column_background_color_dark_mode = color_dark_grey primary_column_text_color = color_black primary_column_text_color_dark_mode = color_white secondary_column_background_color = color_blue_pale secondary_column_background_color_dark_mode = color_blue_darker secondary_column_text_color = color_gunmetal secondary_column_text_color_dark_mode = color_white column_divider_color = color_grey column_padding = "20" # a single CSS pixel measurement without the "px" suffix preview_photo_border = "1px solid rgba(0,0,0,0.1)" list_item_border_bottom = "1px solid $color_grey" button_border_radius = "4px" # a full CSS border-radius property button_background_color = color_yellow button_background_color_fixed = color_green_dark button_background_color_notfixed = color_red_dark button_background_color_dontknow = color_yellow button_text_color = color_black button_text_color_fixed = color_white button_text_color_notfixed = color_white button_text_color_dontknow = color_black button_font_weight = "bold" text_input_border_color = "#999"; submit_footer_td_style = "text-align: left; vertical-align: top; font-weight: normal; color: #000;" submit_footer_h2_style = "font-size: 16px; line-height: 18px; margin: 0 0 10px 0;"; submit_footer_link_style = "color: #9CD0EA;"; %] [% # Handy point at which your cobrand can override any of those default colours before the rest of the settings are constructed. %] [% TRY %][% PROCESS '_email_color_overrides.html' %][% CATCH file %][% END %] [% # Variables used inside the email templates. table_reset = 'cellspacing="0" cellpadding="0" border="0" width="100%"' wrapper_table = table_reset link_style = "color: $link_text_color;" link_hover_style = "text-decoration: none; color: $link_hover_text_color;" link_style_dark_mode = "color: $link_text_color !important;" td_style = "font-family: $body_font_family; font-size: 16px; line-height: 21px; font-weight: normal; text-align: left;" body_style = "margin: 0;" wrapper_style = "$td_style background: $body_background_color; color: $body_text_color;" wrapper_max_width = 620 # in pixels without "px" suffix wrapper_min_width = 520 # in pixels without "px" suffix hint_min_width = wrapper_min_width - (column_padding * 2) hint_style = "min-width: ${ hint_min_width }px; padding: ${ column_padding }px; color: $body_text_color; font-size: 12px; line-height: 18px;" warning_style = "min-width: ${ hint_min_width }x; padding: ${ column_padding }px; background-color: $color_red_dark; color: $color_white;" header_style = "padding: $header_padding; background: $header_background_color; color: $header_text_color;" only_column_style = "padding: ${ column_padding }px; vertical-align: top; background-color: $primary_column_background_color; color: $primary_column_text_color;" primary_column_style = "vertical-align: top; width: 50%; background-color: $primary_column_background_color; color: $primary_column_text_color;" secondary_column_style = "vertical-align: top; width: 50%; background-color: $secondary_column_background_color; color: $secondary_column_text_color; border-left: 1px solid $column_divider_color;"; # Use these to add padding inside primary and secondary columns. MACRO start_padded_box BLOCK ~%] [%~ END; end_padded_box = '' logo_style = "font-size: $logo_font_size; line-height: ${ logo_height }px; vertical-align: middle;" h1_style = "margin: 0 0 20px 0; font-size: 28px; line-height: 30px;" h2_style = "margin: 0 0 20px 0; font-size: 21px; line-height: 24px;" p_style = "margin: 0 0 0.8em 0;" secondary_p_style = "font-size: 14px; line-height: 20px; $p_style" preview_photo_style = "display: block; margin: 0 0 1em 1em; border: $preview_photo_border;" map_image_style = "display: block; width: 100%; height: auto;" # A list of reports/comments, not a bullet pointed list list_item_style = "padding-bottom: 20px; margin-bottom: 20px; border-bottom: $list_item_border_bottom;" list_item_h2_style = "margin: 0 0 16px 0; font-size: 21px; line-height: 24px;" list_item_p_style = "margin: 0 0 16px 0;" list_item_date_style = "font-size: 14px; line-height: 20px; margin: 0; color: $color_gunmetal_light;" list_item_photo_style = "float: right; margin: 0 0 1em 1em; border: none;" ul_attrs = 'style="margin:0; margin-left: 25px; padding:0;" align="left" type="disc"' contact_meta_style = "padding: 15px ${ column_padding }px; vertical-align: top; background-color: $secondary_column_background_color; border-bottom: 1px solid $column_divider_color;" contact_th_style = "vertical-align: top; padding: 0.4em 1em 0 0; white-space: nowrap; text-align: left;" contact_td_style = "vertical-align: top; padding: 0.4em 0 0.4em 0; width: 100%;" contact_admin_links_style = "display: block;" rss_meta_style = "padding: 5px ${ column_padding }px; vertical-align: top; background-color: $secondary_column_background_color; color: $secondary_column_text_color; border-bottom: 1px solid $column_divider_color; font-size: 14px;" text_input_style = "padding: 0.5em 0.75em; border-radius: 0.3em; border: 1px solid $text_input_border_color; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset; width: 30em; max-width: 100%; margin-top: 0.5em; font-size: 1em;"; # The below is so the buttons work okay in Outlook: https://litmus.com/blog/a-guide-to-bulletproof-buttons-in-email-design button_style = "display: inline-block; border: 10px solid $button_background_color; border-width: 10px 15px; border-radius: $button_border_radius; background-color: $button_background_color; color: $button_text_color; font-size: 18px; line-height: 21px; font-weight: $button_font_weight; text-decoration: underline;" fixed_button_style = "$button_style border-color: $button_background_color_fixed; background-color: $button_background_color_fixed; color: $button_text_color_fixed; margin: 0 0.2em;" notfixed_button_style = "$button_style border-color: $button_background_color_notfixed; background-color: $button_background_color_notfixed; color: $button_text_color_notfixed; margin: 0 0.2em;" dontknow_button_style = "$button_style border-color: $button_background_color_dontknow; background-color: $button_background_color_dontknow; color: $button_text_color_dontknow; margin: 0 0.2em;" %] [% # Handy point at which your cobrand can override any of the constructed variables before they are sent to the templates. %] [% TRY %][% PROCESS '_email_setting_overrides.html' %][% CATCH file %][% END %]