Changeset 1829fbf in OpenWorkouts-current for ow/static/less/pages/verify_account.less


Ignore:
Timestamp:
Feb 20, 2019, 9:31:22 PM (5 years ago)
Author:
Borja Lopez <borja@…>
Branches:
current, feature/docs, master
Children:
38171c6
Parents:
42d775c
Message:

(#61) Several fixes for the multipart/alternative (text+html) version of the verify
your account email:

  • Use premailer [1] to embed all styles into the body of the html part of the email (ensuring the styles are rendered correctly in most email clients)
  • Fixed some styles (RGB colors, transparencies, etc don't work in mail clients)
  • Ensure the different bodies (text and html) have the proper content type and charset set.

[1] https://pypi.org/project/premailer

File:
1 edited

Legend:

Unmodified
Added
Removed
  • ow/static/less/pages/verify_account.less

    r42d775c r1829fbf  
    55    justify-content: center;
    66    align-items: center;
    7     min-height: calc(100vh - 98px);
     7    /* dynamic min-height based on window height does not work well
     8     with premailer and generating the proper html with styles for mails */
     9    min-height: 400px;
    810    padding: 1em 0;
    9     color: @color-main-light;
     11    /* RGB calculated color does not work well with premailer and
     12       generating the proper html with styles for mails */
     13    color: #151515;
    1014
    1115    .info {
    1216        max-width: 580px;
    13         background-color: fadeout(@color-main, 40%);
     17        /* RGB calculated color does not work well with premailer and
     18         generating the proper html with styles for mails */
     19        background-color: #e1e1e1;
    1420        border-radius: 6px;
    1521        padding: 2em  1.5em;
     
    2026
    2127    a {
    22         color: @color-main-light;
     28        /* RGB calculated color does not work well with premailer and
     29           generating the proper html with styles for mails */
     30        color: #151515;
    2331        font-size: 13px;
    2432        text-decoration: none;
    2533        margin-right: .75em;
    2634        &:hover {
    27             color: white;
     35            color: #151515;
    2836        }
    2937    }
    3038
    3139    .button {
    32         transition: all 500ms ease-in-out;
    3340        background-color: @color-app;
     41        background: @color-app;
    3442        color: white;
    3543        text-transform: uppercase;
    3644        &:hover {
    37             background-color: darken(@color-app, 10%);
     45            background-color: @color-app-important;
    3846        }
    3947    }
Note: See TracChangeset for help on using the changeset viewer.