github.com/masterhung0112/hk_server/v5@v5.0.0-20220302090640-ec71aef15e1c/templates/license_up_for_renewal.html (about)

     1  {{define "license_up_for_renewal"}}
     2  
     3  <!-- FILE: license_up_for_renewal.mjml -->
     4  <!doctype html>
     5  <html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
     6  
     7  <head>
     8    <title>
     9    </title>
    10    <!--[if !mso]><!-->
    11    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    12    <!--<![endif]-->
    13    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    14    <meta name="viewport" content="width=device-width, initial-scale=1">
    15    <style type="text/css">
    16      #outlook a {
    17        padding: 0;
    18      }
    19  
    20      body {
    21        margin: 0;
    22        padding: 0;
    23        -webkit-text-size-adjust: 100%;
    24        -ms-text-size-adjust: 100%;
    25      }
    26  
    27      table,
    28      td {
    29        border-collapse: collapse;
    30        mso-table-lspace: 0pt;
    31        mso-table-rspace: 0pt;
    32      }
    33  
    34      img {
    35        border: 0;
    36        height: auto;
    37        line-height: 100%;
    38        outline: none;
    39        text-decoration: none;
    40        -ms-interpolation-mode: bicubic;
    41      }
    42  
    43      p {
    44        display: block;
    45        margin: 13px 0;
    46      }
    47    </style>
    48    <!--[if mso]>
    49          <xml>
    50          <o:OfficeDocumentSettings>
    51            <o:AllowPNG/>
    52            <o:PixelsPerInch>96</o:PixelsPerInch>
    53          </o:OfficeDocumentSettings>
    54          </xml>
    55          <![endif]-->
    56    <!--[if lte mso 11]>
    57          <style type="text/css">
    58            .mj-outlook-group-fix { width:100% !important; }
    59          </style>
    60          <![endif]-->
    61    <style type="text/css">
    62      @media only screen and (min-width:480px) {
    63        .mj-column-per-100 {
    64          width: 100% !important;
    65          max-width: 100%;
    66        }
    67      }
    68    </style>
    69    <style media="screen and (min-width:480px)">
    70      .moz-text-html .mj-column-per-100 {
    71        width: 100% !important;
    72        max-width: 100%;
    73      }
    74    </style>
    75    <style type="text/css">
    76      @media only screen and (max-width:480px) {
    77        table.mj-full-width-mobile {
    78          width: 100% !important;
    79        }
    80  
    81        td.mj-full-width-mobile {
    82          width: auto !important;
    83        }
    84      }
    85    </style>
    86    <style type="text/css">
    87      @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700);
    88  
    89      .emailBody {
    90        background: #F3F3F3 !important;
    91      }
    92  
    93      .emailBody a {
    94        text-decoration: none !important;
    95        color: #166DE0 !important;
    96      }
    97  
    98      .title div {
    99        font-weight: 600 !important;
   100        font-size: 28px !important;
   101        line-height: 36px !important;
   102        letter-spacing: -0.01em !important;
   103        color: #3D3C40 !important;
   104      }
   105  
   106      .subTitle div {
   107        font-size: 16px !important;
   108        line-height: 24px !important;
   109        color: rgba(61, 60, 64, 0.64) !important;
   110      }
   111  
   112      .button a {
   113        background-color: #166DE0 !important;
   114        font-weight: 600 !important;
   115        font-size: 16px !important;
   116        line-height: 18px !important;
   117        color: #FFFFFF !important;
   118        padding: 15px 24px !important;
   119      }
   120  
   121      .messageButton a {
   122        background-color: #FFFFFF !important;
   123        border: 1px solid #FFFFFF !important;
   124        box-sizing: border-box !important;
   125        color: #166DE0 !important;
   126        padding: 12px 20px !important;
   127        font-weight: 600 !important;
   128        font-size: 14px !important;
   129        line-height: 14px !important;
   130      }
   131  
   132      .info div {
   133        font-size: 14px !important;
   134        line-height: 20px !important;
   135        color: #3D3C40 !important;
   136        padding: 40px 0px !important;
   137      }
   138  
   139      .footerTitle div {
   140        font-weight: 600 !important;
   141        font-size: 16px !important;
   142        line-height: 24px !important;
   143        color: #3D3C40 !important;
   144        padding: 0px 0px 4px 0px !important;
   145      }
   146  
   147      .footerInfo div {
   148        font-size: 14px !important;
   149        line-height: 20px !important;
   150        color: #3D3C40 !important;
   151        padding: 0px 48px 0px 48px !important;
   152      }
   153  
   154      .footerInfo a {
   155        color: #166DE0 !important;
   156      }
   157  
   158      .appDownloadButton a {
   159        background-color: #FFFFFF !important;
   160        border: 1px solid #166DE0 !important;
   161        box-sizing: border-box !important;
   162        color: #166DE0 !important;
   163        padding: 13px 20px !important;
   164        font-weight: 600 !important;
   165        font-size: 14px !important;
   166        line-height: 14px !important;
   167      }
   168  
   169      .emailFooter div {
   170        font-size: 12px !important;
   171        line-height: 16px !important;
   172        color: rgba(61, 60, 64, 0.56) !important;
   173        padding: 8px 24px 8px 24px !important;
   174      }
   175  
   176      .postCard {
   177        padding: 0px 24px 40px 24px !important;
   178      }
   179  
   180      .messageCard {
   181        background: #FFFFFF !important;
   182        border: 1px solid rgba(61, 60, 64, 0.08) !important;
   183        box-sizing: border-box !important;
   184        box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.12) !important;
   185        border-radius: 4px !important;
   186        padding: 32px !important;
   187      }
   188  
   189      .messageAvatar img {
   190        width: 32px !important;
   191        height: 32px !important;
   192        padding: 0px !important;
   193        border-radius: 32px !important;
   194      }
   195  
   196      .messageAvatarCol {
   197        width: 32px !important;
   198      }
   199  
   200      .postNameAndTime {
   201        padding: 0px 0px 4px 0px !important;
   202        display: flex;
   203      }
   204  
   205      .senderName {
   206        font-family: Open Sans, sans-serif;
   207        text-align: left !important;
   208        font-weight: 600 !important;
   209        font-size: 14px !important;
   210        line-height: 20px !important;
   211        color: #3D3C40 !important;
   212      }
   213  
   214      .time {
   215        font-family: Open Sans, sans-serif;
   216        font-size: 12px;
   217        line-height: 16px;
   218        color: rgba(61, 60, 64, 0.56);
   219        padding: 2px 6px;
   220        align-items: center;
   221        float: left;
   222      }
   223  
   224      .channelBg {
   225        background: rgba(61, 60, 64, 0.08);
   226        border-radius: 4px;
   227        display: flex;
   228      }
   229  
   230      .channelLogo {
   231        width: 10px;
   232        height: 10px;
   233        padding: 5px 4px 5px 6px;
   234        float: left;
   235      }
   236  
   237      .channelName {
   238        font-family: Open Sans, sans-serif;
   239        font-weight: 600;
   240        font-size: 10px;
   241        line-height: 16px;
   242        letter-spacing: 0.01em;
   243        text-transform: uppercase;
   244        color: rgba(61, 60, 64, 0.64);
   245        padding: 2px 6px 2px 0px;
   246      }
   247  
   248      .senderMessage div {
   249        text-align: left !important;
   250        font-size: 14px !important;
   251        line-height: 20px !important;
   252        color: #3D3C40 !important;
   253        padding: 0px !important;
   254      }
   255  
   256      .senderInfoCol {
   257        width: 394px !important;
   258        padding: 0px 0px 0px 12px !important;
   259      }
   260  
   261      @media all and (min-width: 541px) {
   262        .emailBody {
   263          padding: 32px !important;
   264        }
   265      }
   266  
   267      @media all and (max-width: 540px) and (min-width: 401px) {
   268        .emailBody {
   269          padding: 16px !important;
   270        }
   271  
   272        .messageCard {
   273          padding: 16px !important;
   274        }
   275  
   276        .senderInfoCol {
   277          width: 80% !important;
   278          padding: 0px 0px 0px 12px !important;
   279        }
   280      }
   281  
   282      @media all and (max-width: 400px) {
   283        .emailBody {
   284          padding: 0px !important;
   285        }
   286  
   287        .footerInfo div {
   288          padding: 0px !important;
   289        }
   290  
   291        .messageCard {
   292          padding: 16px !important;
   293        }
   294  
   295        .postCard {
   296          padding: 0px 0px 40px 0px !important;
   297        }
   298  
   299        .senderInfoCol {
   300          width: 80% !important;
   301          padding: 0px 0px 0px 12px !important;
   302        }
   303      }
   304    </style>
   305  </head>
   306  
   307  <body style="word-spacing:normal;">
   308    <div class="emailBody" style="">
   309      <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
   310      <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;border-radius:0;max-width:600px;">
   311        <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#FFFFFF;background-color:#FFFFFF;width:100%;border-radius:0;">
   312          <tbody>
   313            <tr>
   314              <td style="direction:ltr;font-size:0px;padding:24px;text-align:center;">
   315                <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:552px;" width="552" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
   316                <div style="margin:0px auto;max-width:552px;">
   317                  <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
   318                    <tbody>
   319                      <tr>
   320                        <td style="border-left:1px solid #E5E5E5;border-right:1px solid #E5E5E5;border-top:1px solid #E5E5E5;direction:ltr;font-size:0px;padding:24px;text-align:center;">
   321                          <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:502px;" ><![endif]-->
   322                          <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
   323                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
   324                              <tbody>
   325                                <tr>
   326                                  <td align="left" style="font-size:0px;padding:0px;word-break:break-word;">
   327                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;">
   328                                      <tbody>
   329                                        <tr>
   330                                          <td style="width:132px;">
   331                                            <img alt="" height="21" src="{{.Props.SiteURL}}/static/images/logo_email_gray.png" style="border:0;display:block;outline:none;text-decoration:none;height:21.76px;width:100%;font-size:13px;" width="132" />
   332                                          </td>
   333                                        </tr>
   334                                      </tbody>
   335                                    </table>
   336                                  </td>
   337                                </tr>
   338                              </tbody>
   339                            </table>
   340                          </div>
   341                          <!--[if mso | IE]></td></tr></table><![endif]-->
   342                        </td>
   343                      </tr>
   344                    </tbody>
   345                  </table>
   346                </div>
   347                <!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:552px;" width="552" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
   348                <div style="margin:0px auto;max-width:552px;">
   349                  <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
   350                    <tbody>
   351                      <tr>
   352                        <td style="border-left:1px solid #E5E5E5;border-right:1px solid #E5E5E5;direction:ltr;font-size:0px;padding:0 60px;text-align:center;">
   353                          <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:430px;" ><![endif]-->
   354                          <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
   355                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
   356                              <tbody>
   357                                <tr>
   358                                  <td align="center" class="title" style="font-size:0px;padding:10px 0px;word-break:break-word;">
   359                                    <div style="font-family:Arial;font-size:28px;font-weight:bold;line-height:32px;text-align:center;color:#000000;">{{.Props.Title}}</div>
   360                                  </td>
   361                                </tr>
   362                                <tr>
   363                                  <td align="center" style="font-size:0px;padding:10px 0px;padding-bottom:24px;word-break:break-word;">
   364                                    <div style="font-family:Arial;font-size:16px;line-height:24px;text-align:center;color:#000000;">{{.Props.SubTitle}}</div>
   365                                  </td>
   366                                </tr>
   367                                <tr>
   368                                  <td align="center" style="font-size:0px;padding:10px 0px;padding-bottom:24px;word-break:break-word;">
   369                                    <div style="font-family:Arial;font-size:16px;font-weight:bold;line-height:24px;text-align:center;color:#000000;">{{.Props.SubTitleTwo}}</div>
   370                                  </td>
   371                                </tr>
   372                                <tr>
   373                                  <td align="center" vertical-align="middle" class="button" style="font-size:0px;padding:0px;word-break:break-word;">
   374                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
   375                                      <tr>
   376                                        <td align="center" bgcolor="#0058CC" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#0058CC;" valign="middle">
   377                                          <a href="{{.Props.ButtonURL}}" style="display:inline-block;background:#0058CC;color:#ffffff;font-family:Arial;font-size:16px;font-weight:normal;line-height:24px;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:4px;" target="_blank">
   378                                            {{.Props.Button}}
   379                                          </a>
   380                                        </td>
   381                                      </tr>
   382                                    </table>
   383                                  </td>
   384                                </tr>
   385                              </tbody>
   386                            </table>
   387                          </div>
   388                          <!--[if mso | IE]></td></tr></table><![endif]-->
   389                        </td>
   390                      </tr>
   391                    </tbody>
   392                  </table>
   393                </div>
   394                <!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:552px;" width="552" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
   395                <div style="margin:0px auto;max-width:552px;">
   396                  <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
   397                    <tbody>
   398                      <tr>
   399                        <td style="border-left:1px solid #E5E5E5;border-right:1px solid #E5E5E5;direction:ltr;font-size:0px;padding:40px;text-align:center;">
   400                          <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:470px;" ><![endif]-->
   401                          <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
   402                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
   403                              <tbody>
   404                                <tr>
   405                                  <td align="center" style="font-size:0px;padding:0px;word-break:break-word;">
   406                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;">
   407                                      <tbody>
   408                                        <tr>
   409                                          <td style="width:320px;">
   410                                            <img alt="" height="auto" src="https://ucarecdn.com/8cd90d9d-8902-4845-a15b-f4664e5fcfb3/-/format/auto/-/quality/lighter/-/max_icc_size/10/-/resize/1288x/" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;" width="320" />
   411                                          </td>
   412                                        </tr>
   413                                      </tbody>
   414                                    </table>
   415                                  </td>
   416                                </tr>
   417                              </tbody>
   418                            </table>
   419                          </div>
   420                          <!--[if mso | IE]></td></tr></table><![endif]-->
   421                        </td>
   422                      </tr>
   423                    </tbody>
   424                  </table>
   425                </div>
   426                <!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:552px;" width="552" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
   427                <div style="margin:0px auto;max-width:552px;">
   428                  <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
   429                    <tbody>
   430                      <tr>
   431                        <td style="border-left:1px solid #E5E5E5;border-right:1px solid #E5E5E5;direction:ltr;font-size:0px;padding:24px 24px 24px 24px;text-align:center;">
   432                          <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:502px;" ><![endif]-->
   433                          <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
   434                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-top:1px solid #E5E5E5;vertical-align:top;" width="100%">
   435                              <tbody>
   436                                <tr>
   437                                  <td align="left" class="footerTitle" style="font-size:0px;padding:24px 0px 0px 0px;word-break:break-word;">
   438                                    <div style="font-family:Arial;font-size:13px;line-height:1;text-align:left;color:#000000;">{{.Props.QuestionTitle}}</div>
   439                                  </td>
   440                                </tr>
   441                                <tr>
   442                                  <td align="left" style="font-size:0px;padding:0px 0px ;word-break:break-word;">
   443                                    <div style="font-family:Arial;font-size:14px;line-height:20px;text-align:left;color:#3D3C40;">{{.Props.QuestionInfo}}
   444                                      <a href='mailto:{{.Props.SupportEmail}}'>
   445                                        {{.Props.SupportEmail}}
   446                                      </a>
   447                                    </div>
   448                                  </td>
   449                                </tr>
   450                              </tbody>
   451                            </table>
   452                          </div>
   453                          <!--[if mso | IE]></td></tr></table><![endif]-->
   454                        </td>
   455                      </tr>
   456                    </tbody>
   457                  </table>
   458                </div>
   459                <!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:552px;" width="552" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
   460                <div style="margin:0px auto;max-width:552px;">
   461                  <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
   462                    <tbody>
   463                      <tr>
   464                        <td style="border-bottom:1px solid #E5E5E5;border-left:1px solid #E5E5E5;border-right:1px solid #E5E5E5;direction:ltr;font-size:0px;padding:0px 24px 24px 24px;text-align:center;">
   465                          <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:502px;" ><![endif]-->
   466                          <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
   467                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-top:1px solid #E5E5E5;vertical-align:top;" width="100%">
   468                              <tbody>
   469                                <tr>
   470                                  <td align="center" class="emailFooter" style="font-size:0px;padding:0px;word-break:break-word;">
   471                                    <div style="font-family:Arial;font-size:12px;line-height:20px;text-align:center;color:#AAAAAA;">{{.Props.Organization}}
   472                                      {{.Props.FooterV2}}
   473                                    </div>
   474                                  </td>
   475                                </tr>
   476                              </tbody>
   477                            </table>
   478                          </div>
   479                          <!--[if mso | IE]></td></tr></table><![endif]-->
   480                        </td>
   481                      </tr>
   482                    </tbody>
   483                  </table>
   484                </div>
   485                <!--[if mso | IE]></td></tr></table></td></tr></table><![endif]-->
   486              </td>
   487            </tr>
   488          </tbody>
   489        </table>
   490      </div>
   491      <!--[if mso | IE]></td></tr></table><![endif]-->
   492    </div>
   493  </body>
   494  
   495  </html>
   496  
   497  {{end}}