API tools faq
paste
Advertisement
Guest User

Forgot Password

a guest
Mar 24th, 2017
66
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 10.27 KB | None | 0 0
raw download clone embed print report
  1. <!doctype html>
  2. <html>
  3.   <head>
  4.     <meta name="viewport" content="width=device-width" />
  5.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6.     <title>UniTracker Forgot Password</title>
  7.     <style>
  8.       /* -------------------------------------
  9.           GLOBAL RESETS
  10.       ------------------------------------- */
  11.       img {
  12.         border: none;
  13.         -ms-interpolation-mode: bicubic;
  14.         max-width: 100%; }
  15.  
  16.       body {
  17.         background-color: #f6f6f6;
  18.         font-family: sans-serif;
  19.         -webkit-font-smoothing: antialiased;
  20.         font-size: 14px;
  21.         line-height: 1.4;
  22.         margin: 0;
  23.         padding: 0;
  24.         -ms-text-size-adjust: 100%;
  25.         -webkit-text-size-adjust: 100%; }
  26.  
  27.       table {
  28.         border-collapse: separate;
  29.         mso-table-lspace: 0pt;
  30.         mso-table-rspace: 0pt;
  31.         width: 100%; }
  32.         table td {
  33.           font-family: sans-serif;
  34.           font-size: 14px;
  35.           vertical-align: top; }
  36.  
  37.       /* -------------------------------------
  38.           BODY & CONTAINER
  39.      ------------------------------------- */
  40.  
  41.      .body {
  42.        background-color: #f6f6f6;
  43.         width: 100%; }
  44.  
  45.       /* Set a max-width, and make it display as block so it will automatically stretch to that width, but will also shrink down on a phone or something */
  46.       .container {
  47.         display: block;
  48.         Margin: 0 auto !important;
  49.         /* makes it centered */
  50.         max-width: 580px;
  51.         padding: 10px;
  52.         width: 580px; }
  53.  
  54.       /* This should also be a block element, so that it will fill 100% of the .container */
  55.       .content {
  56.         box-sizing: border-box;
  57.         display: block;
  58.         Margin: 0 auto;
  59.         max-width: 580px;
  60.         padding: 10px; }
  61.  
  62.       /* -------------------------------------
  63.           HEADER, FOOTER, MAIN
  64.       ------------------------------------- */
  65.       .main {
  66.         background: #fff;
  67.         border-radius: 3px;
  68.         width: 100%; }
  69.  
  70.       .wrapper {
  71.         box-sizing: border-box;
  72.         padding: 20px; }
  73.  
  74.       .footer {
  75.         clear: both;
  76.         padding-top: 10px;
  77.         text-align: center;
  78.         width: 100%; }
  79.         .footer td,
  80.         .footer p,
  81.         .footer span,
  82.         .footer a {
  83.           color: #999999;
  84.           font-size: 12px;
  85.           text-align: center; }
  86.  
  87.       /* -------------------------------------
  88.           TYPOGRAPHY
  89.       ------------------------------------- */
  90.       h1,
  91.       h2,
  92.       h3,
  93.       h4 {
  94.         color: #000000;
  95.         font-family: sans-serif;
  96.         font-weight: 400;
  97.         line-height: 1.4;
  98.         margin: 0;
  99.         Margin-bottom: 30px; }
  100.  
  101.       h1 {
  102.         font-size: 35px;
  103.         font-weight: 300;
  104.         text-align: center;
  105.         text-transform: capitalize; }
  106.  
  107.       p,
  108.       ul,
  109.       ol {
  110.         font-family: sans-serif;
  111.         font-size: 14px;
  112.         font-weight: normal;
  113.         margin: 0;
  114.         Margin-bottom: 15px; }
  115.         p li,
  116.         ul li,
  117.         ol li {
  118.           list-style-position: inside;
  119.           margin-left: 5px; }
  120.  
  121.       a {
  122.         color: #3498db;
  123.         text-decoration: underline; }
  124.  
  125.       /* -------------------------------------
  126.           BUTTONS
  127.       ------------------------------------- */
  128.       .btn {
  129.         box-sizing: border-box;
  130.         width: 100%; }
  131.         .btn > tbody > tr > td {
  132.           padding-bottom: 15px; }
  133.         .btn table {
  134.           width: auto; }
  135.         .btn table td {
  136.           background-color: #ffffff;
  137.           border-radius: 5px;
  138.           text-align: center; }
  139.         .btn a {
  140.           background-color: #ffffff;
  141.           border: solid 1px #3498db;
  142.           border-radius: 5px;
  143.           box-sizing: border-box;
  144.           color: #3498db;
  145.           cursor: pointer;
  146.           display: inline-block;
  147.           font-size: 14px;
  148.           font-weight: bold;
  149.           margin: 0;
  150.           padding: 12px 25px;
  151.           text-decoration: none;
  152.           text-transform: capitalize; }
  153.  
  154.       .btn-primary table td {
  155.         background-color: #3498db; }
  156.  
  157.       .btn-primary a {
  158.         background-color: #3498db;
  159.         border-color: #3498db;
  160.         color: #ffffff; }
  161.  
  162.       /* -------------------------------------
  163.           OTHER STYLES THAT MIGHT BE USEFUL
  164.       ------------------------------------- */
  165.       .last {
  166.         margin-bottom: 0; }
  167.  
  168.       .first {
  169.         margin-top: 0; }
  170.  
  171.       .align-center {
  172.         text-align: center; }
  173.  
  174.       .align-right {
  175.         text-align: right; }
  176.  
  177.       .align-left {
  178.         text-align: left; }
  179.  
  180.       .clear {
  181.         clear: both; }
  182.  
  183.       .mt0 {
  184.         margin-top: 0; }
  185.  
  186.       .mb0 {
  187.         margin-bottom: 0; }
  188.  
  189.       .preheader {
  190.         color: transparent;
  191.         display: none;
  192.         height: 0;
  193.         max-height: 0;
  194.         max-width: 0;
  195.         opacity: 0;
  196.         overflow: hidden;
  197.         mso-hide: all;
  198.         visibility: hidden;
  199.         width: 0; }
  200.  
  201.       .powered-by a {
  202.         text-decoration: none; }
  203.  
  204.       hr {
  205.         border: 0;
  206.         border-bottom: 1px solid #f6f6f6;
  207.         Margin: 20px 0; }
  208.  
  209.       /* -------------------------------------
  210.           RESPONSIVE AND MOBILE FRIENDLY STYLES
  211.       ------------------------------------- */
  212.       @media only screen and (max-width: 620px) {
  213.         table[class=body] h1 {
  214.           font-size: 28px !important;
  215.           margin-bottom: 10px !important; }
  216.         table[class=body] p,
  217.         table[class=body] ul,
  218.         table[class=body] ol,
  219.         table[class=body] td,
  220.         table[class=body] span,
  221.         table[class=body] a {
  222.           font-size: 16px !important; }
  223.         table[class=body] .wrapper,
  224.         table[class=body] .article {
  225.           padding: 10px !important; }
  226.         table[class=body] .content {
  227.           padding: 0 !important; }
  228.         table[class=body] .container {
  229.           padding: 0 !important;
  230.           width: 100% !important; }
  231.         table[class=body] .main {
  232.           border-left-width: 0 !important;
  233.           border-radius: 0 !important;
  234.           border-right-width: 0 !important; }
  235.         table[class=body] .btn table {
  236.           width: 100% !important; }
  237.         table[class=body] .btn a {
  238.           width: 100% !important; }
  239.         table[class=body] .img-responsive {
  240.           height: auto !important;
  241.           max-width: 100% !important;
  242.           width: auto !important; }}
  243.  
  244.       /* -------------------------------------
  245.           PRESERVE THESE STYLES IN THE HEAD
  246.       ------------------------------------- */
  247.       @media all {
  248.         .ExternalClass {
  249.           width: 100%; }
  250.         .ExternalClass,
  251.         .ExternalClass p,
  252.         .ExternalClass span,
  253.         .ExternalClass font,
  254.         .ExternalClass td,
  255.         .ExternalClass div {
  256.           line-height: 100%; }
  257.         .apple-link a {
  258.           color: inherit !important;
  259.           font-family: inherit !important;
  260.           font-size: inherit !important;
  261.           font-weight: inherit !important;
  262.           line-height: inherit !important;
  263.           text-decoration: none !important; }
  264.         .btn-primary table td:hover {
  265.           background-color: #34495e !important; }
  266.         .btn-primary a:hover {
  267.           background-color: #34495e !important;
  268.           border-color: #34495e !important; } }
  269.  
  270.     </style>
  271.   </head>
  272.   <body class="">
  273.     <table border="0" cellpadding="0" cellspacing="0" class="body">
  274.       <tr>
  275.         <td>&nbsp;</td>
  276.         <td class="container">
  277.           <div class="content">
  278.  
  279.             <!-- START CENTERED WHITE CONTAINER -->
  280.             <span class="preheader">Here is how to reset your UniTracker password.</span>
  281.             <table class="main">
  282.  
  283.               <!-- START MAIN CONTENT AREA -->
  284.               <tr>
  285.                 <td class="wrapper">
  286.                   <table border="0" cellpadding="0" cellspacing="0">
  287.                     <tr>
  288.                       <div style="margin-right: 35%; margin-left: 35%; margin-bottom: 30px;">
  289.                         <img src="https://uni-tracker.com/img/coloured_logo.png" style="width:100%;" align="middle"/>
  290.                       </div>
  291.                     </tr>
  292.                     <tr>
  293.                       <td>
  294.                         <p>Hi there,</p>
  295.                         <p>You recently requested a password reset for your UniTracker account.</p>
  296.                         <p>To complete the process, click the button below</p>
  297.                         <p>
  298.                         <table border="0" cellpadding="0" cellspacing="0" class="btn btn-primary">
  299.                           <tbody>
  300.                             <tr>
  301.                               <td align="left">
  302.                                 <table border="0" cellpadding="0" cellspacing="0">
  303.                                   <tbody>
  304.                                     <tr>
  305.                                       <td> <a href="https://uni-tracker.com" target="_blank">Reset password</a> </td>
  306.                                     </tr>
  307.                                   </tbody>
  308.                                 </table>
  309.                               </td>
  310.                             </tr>
  311.                           </tbody>
  312.                         </table>
  313.                         <p>Thanks!</p>
  314.                         <p>The UniTracker Team</p>
  315.                       </td>
  316.                     </tr>
  317.                   </table>
  318.                 </td>
  319.               </tr>
  320.  
  321.               <!-- END MAIN CONTENT AREA -->
  322.               </table>
  323.  
  324.             <!-- START FOOTER -->
  325.             <div class="footer">
  326.               <table border="0" cellpadding="0" cellspacing="0">
  327.                 <tr>
  328.                   <td class="content-block">
  329.                     <span class="apple-link">&#9400; UniTracker 2017</span>
  330.                   </td>
  331.                 </tr>
  332.                 <tr>
  333.                   <td class="content-block powered-by">
  334.                     Powered by <a href="http://htmlemail.io">HTMLemail</a>.
  335.                   </td>
  336.                 </tr>
  337.               </table>
  338.             </div>
  339.  
  340.             <!-- END FOOTER -->
  341.            
  342. <!-- END CENTERED WHITE CONTAINER --></div>
  343.         </td>
  344.         <td>&nbsp;</td>
  345.       </tr>
  346.     </table>
  347.   </body>
  348. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!