Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: backclick.html

Issue 29646555: Issue 6210 - Implement Subscription (Double-opt-in) template for newsletter (Closed)
Patch Set: Testing backclick template changes Created Dec. 22, 2017, 5:11 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « .hgignore ('k') | default.html » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: backclick.html
===================================================================
new file mode 100644
--- /dev/null
+++ b/backclick.html
@@ -0,0 +1,491 @@
+<!doctype html>
+<html lang="en" dir="ltr">
+<head>
+ <!-- website-defaults/includes/meta/standard -->
+ <meta charset="utf-8">
+ <meta http-equiv="x-ua-compatible" content="ie=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Adblock Plus newsletter signup form</title>
+ <meta name="description" content="A newsletter sign up form, so users can stay up to date with all things related to Adblock Plus.">
+
+ <!-- Resources -->
+ <style>
+.unstyled, .unstyled * { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; list-style: none !important; }
+
+.sr-only { position: absolute !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; border: 0 !important; }
+
+/** Center within a responsive fixed width Use modifier classes defined in _width.scss to change said fixed width */
+.container { width: 1140px; max-width: 100%; margin-right: auto; margin-left: auto; padding-right: 1em; padding-left: 1em; }
+
+/** Clear without collapsed margin */
+.clearfix:after, .clearfix:before { display: table; content: " "; }
+
+.clearfix:after { clear: both; }
+
+/** Align a block to the start of a line */
+.float-start { float: left; }
+
+[dir="rtl"] .float-start { float: right; }
+
+/** Align a block to the end of a line */
+.float-end { float: right; }
+
+[dir="rtl"] .float-end { float: left; }
+
+/** Force full-width */
+.full-width { display: block; width: 100%; }
+
+/** Fix a block to the width of a phone */
+.phone-width { width: auto; }
+
+/** Fix a block to the width of a phablet */
+.phablet-width { width: 540px; }
+
+/** Fix a block to the width of a tablet */
+.tablet-width { width: 720px; }
+
+/** Fix a block to the width of a desktop */
+.desktop-width { width: 960px; }
+
+/** Fix a block to the width of a large desktop */
+.large-desktop-width { width: 1140px; }
+
+/******************************************************************************* CSS Reset */
+/* Reset margins, paddings, and font globally */
+html, body, h1, h2, h3, h4, h5, h6, a, p, span, em, small, strong, sub, sup, strike, s, mark, del, ins, abbr, dfn, blockquote, q, cite, code, pre, kbd, samp, var, output, ruby, ol, ul, li, dl, dt, dd, div, section, article, main, aside, nav, header, hgroup, footer, img, figure, figcaption, address, time, audio, video, canvas, object, iframe, embed, details, summary, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0px; padding: 0px; border: 0px; font-size: 100%; font: inherit; vertical-align: baseline; }
+
+/* Add the correct display in IE 9-. */
+article, aside, footer, header, nav, section, main { display: block; }
+
+/* Set default box-sizing (opinionated) */
+*, *:before, *:after { box-sizing: inherit; }
+
+html { box-sizing: border-box; }
+
+/* Remove the margin in all browsers (opinionated). */
+body { margin: 0px; }
+
+/* Remove list styles (opinionated) */
+ol, ul { list-style: none; }
+
+/* Remove quotes ("") in most browsers (opinionated) */
+blockquote, q { quotes: none; }
+
+/* Remove quotes ("") in Safari (opinionated) */
+blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }
+
+/* Share borders between adjacent cells (opinionated) */
+table { border-collapse: collapse; border-spacing: 0; }
+
+/* Normalize inline content (opinionated) */
+b, strong { font-weight: bolder; }
+
+small { font-size: smaller; }
+
+abbr { text-decoration: underline; cursor: help; }
+
+sup { position: relative; font-size: 75%; vertical-align: super; }
+
+a, a:visited { color: inherit; /* Remove the gray background on active links in IE 10. */ background-color: transparent; text-decoration: none; /* Set default pointer regardless of href (opinionated) */ cursor: pointer; }
+
+a:hover, a:active, a:focus { text-decoration: underline; }
+
+img { /* Make fixed width images responsive */ max-width: 100%; /* Remove the border on images inside links in IE 10-. */ border-style: none; }
+
+/* Set correct display for hidden attribute in IE 10- */
+[hidden] { display: none; }
+
+/******************************************************************************* Base styles */
+html { color: #212121; background-color: #fff; font-family: "Source Sans Pro", sans-serif; line-height: 1.5; }
+
+/******************************************************************************* Basic forms fields /* 1. Reset */
+/* Change the font styles in all browsers (opinionated). */
+input, optgroup, select, textarea { font: inherit; }
+
+/* Show the overflow in IE and Edge */
+input { overflow: visible; }
+
+/* Remove the inheritance of text transform in Edge, Firefox, and IE. */
+select { text-transform: none; }
+
+/* Set block display (opinionated) */
+fieldset { display: block; }
+
+/* Correct the text wrapping in Edge and IE. */
+legend { display: table; max-width: 100%; white-space: normal; }
+
+/* Remove the default vertical scrollbar in IE. */
+textarea { overflow: auto; }
+
+/* Remove the padding in IE 10-. */
+[type="checkbox"], [type="radio"] { padding: 0px; }
+
+/******************************************************************************* Buttons /* 1. Reset */
+button { margin: 0px; color: inherit; font: inherit; /* Show the overflow in IE and Edge */ overflow: visible; /* Remove rounded corners in Chrome 62+ */ border-radius: 0; /* Remove the inheritance of text transform in Edge, Firefox, and IE. */ text-transform: none; }
+
+/** 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` controls in Android 4. 2. Correct the inability to style clickable types in iOS and Safari. */
+button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }
+
+/* Remove the inner border and padding in Firefox. */
+button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { padding: 0px; border-style: none; }
+
+/* Restore the focus styles unset by the previous rule. */
+button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }
+
+/******************************************************************************* Layout */
+html { background-color: #F3F3F3; }
+
+@media (min-width: 576px) { body { display: table; width: 100%; min-height: 100vh; } }
+
+/* .outer-container */
+@media (min-width: 576px) { .outer-container { display: table-cell; vertical-align: middle; } }
+
+/* #page-header */
+#page-header { margin-top: 2em; margin-bottom: 1em; }
+
+@media (min-width: 576px) { #page-header { margin-top: 0; margin-bottom: 2em; text-align: center; } }
+
+#page-header figure { display: inline-table; font-size: 1.5em; font-weight: 300; }
+
+@media (min-width: 576px) { #page-header figure { font-size: 2em; } }
+
+#page-header figure img, #page-header figure figcaption { display: table-cell; vertical-align: middle; }
+
+#page-header figure img { height: 1.5em; }
+
+@media (min-width: 576px) { #page-header figure img { height: 2em; } }
+
+#page-header figure figcaption { padding: 0 0.5em; }
+
+#page-header figure strong { font-weight: 700; }
+
+#page-header h1 { margin: 1em auto 0.5em; font-weight: 700; }
+
+/* #sign-up, #page-footer */
+#sign-up, #page-footer { width: 100%; }
+
+@media (min-width: 576px) { #sign-up, #page-footer { max-width: 320px; margin-right: auto; margin-left: auto; } }
+
+#page-footer { margin-top: 1em; text-align: center; }
+
+@media (min-width: 576px) { #page-footer { text-align: left; } }
+
+/******************************************************************************* Content */
+a, a:visited { color: #077CA6; text-decoration: underline; }
+
+/******************************************************************************* Form */
+input, button { width: 100%; height: 2.6em; border-radius: 4px; }
+
+/* Input field */
+input { margin-bottom: 2em; padding: 0 0.5em; border: 1px solid #CDCDCD; }
+
+/* Error state */
+.invalid { border-color: #f44336; }
+
+.error-message { display: none; }
+
+.invalid + .error-message { display: block; margin-top: -0.5em; margin-bottom: 1em; color: #f44336; }
+
+/* Buttons */
+button { border: 0; text-transform: uppercase; }
+
+.secondary { color: #fff; background-color: #C70D2B; }
+ </style>
+
+<!--FILTER-COMMENTS-->
+</head>
+<body>
+ <div class="outer-container">
+ <div class="container phablet-width content">
+
+ <header id="page-header">
+ <figure>
+ <img src="https://eyeo.com/images/backclick/abp-logo.png" srcset="https://eyeo.com/images/backclick/abp-logo.svg 2x" alt="ABP inside red octagon">
+ <figcaption>Adblock <strong>Plus</strong></figcaption>
+ </figure>
+
+ <!--NEW-USER-->
+ <h1>Sign up for the Adblock Plus newsletter</h1>
+ <p>Stay up to date with all things Adblock Plus</p>
+ <!--/NEW-USER-->
+
+ <!--UNCONFIRMED--><!--SUCCESS-->
+ <h1>Confirm your email</h1>
+ <p>You will now receive a confirmation e-mail.</p>
+ <!--/SUCCESS--><!--/UNCONFIRMED-->
+
+ <!--CONFIRMED--><!--SUCCESS-->
+ <h1>Confirmation successful</h1>
+ <p>You have been successfully signed up for the AdblockPlus newsletter</p>
+ <!--/SUCCESS--><!--/CONFIRMED-->
+ </header>
+
+ <!--NEW-USER-->
+ <form name="abonnenten_anmeldung" action="web.subscribe?tid=14&mid=0" method="post" id="sign-up">
+
+ <div>
+ <label for="email">Email Address *</label>
+
+ <?GIS EMAIL params="id='email' type='email' class='<!--ERROR:ROBINSON-->invalid<!--/ERROR:ROBINSON--><!--ERROR:INCORRECT-EMAIL-->invalid<!--/ERROR:INCORRECT-EMAIL--><!--ERROR:NO-EMAIL-->invalid<!--/ERROR:NO-EMAIL--><!--ALREADY-CONFIRMED--><!--ERROR-->invalid<!--/ERROR--><!--/ALREADY-CONFIRMED-->' required" mandatory?>
+
+ <!--ERROR:ROBINSON-->
+ <div class="error-message">
+ Sie sind mit der E-Mail-Adresse<br>
+ '<i><?gis name="eMail" content="form"?></i>' in unserer Robinsonliste vermerkt und
+ können sich deshalb nicht anmelden!
+ </div>
+ <!--/ERROR:ROBINSON-->
+
+ <!--ERROR:NO-EMAIL-->
+ <div class="error-message">Please enter a valid email address</div>
+ <!--/ERROR:NO-EMAIL-->
+
+ <!--ERROR:INCORRECT-EMAIL-->
+ <div class="error-message">Please enter a valid email address</div>
+ <!--/ERROR:INCORRECT-EMAIL-->
+
+ <!--ALREADY-CONFIRMED--><!--ERROR-->
+ <div class="error-message">This email address is already subscribed</div>
+ <!--/ERROR--><!--/ALREADY-CONFIRMED-->
+ </div>
+
+ <div>
+ <label for="fullname">Full name</label>
+ <?GIS FULLNAME params="id='fullname'"?>
+ </div>
+
+ <?GIS NEWSLETTER 10 checked params="hidden"?>
+
+ <input type="hidden" name="REFRESH" value="../web.html">
+
+ <button type="submit" class="secondary">Sign Up</button>
+ </form>
+ <footer id="page-footer">
+ <a href="https://eyeo.com/en/privacy" target="_blank">Privacy Policy</a>
+ </footer>
+ <!--/NEW-USER-->
+
+ </div>
+ </div>
+</body>
+</html>
+
+<!--*******************************************************************************
+* EMAIL TEMPLATES
+
+Der folgende Abschnitt beschreibt Elemente der Bestätigungs-eMail.
+"DOI" steht hierbei für Double-Opt-In. Der potentielle Abonnent bekommt
+eine eMail zugesendet, die einen Bestätigungs-Link beinhaltet. Dieser
+Link wird im Abschnitt "BODY" mit dem TAG "$$DOI-LINK$$ gesetzt. Dieser
+TAG muss enthalten sein, ansonsten kann der Abonnent die Anmeldung nicht
+bestätigen!
+Im Abschnitt "TO" kann man über die Notation $$FELDNAME$$ auf Felder
+zugreifen, die der potentielle Abonnent gerade ausgefüllt hat.
+Dies kann auch im Abschnitt "SUBJECT" und "BODY" geschehen.
+Ist eines dieser Felder das Feld Anrede, so können mit der im Kapitel der
+XML-Schnittstelle
+beschriebenen Notation "$$männl$weibl$$" geschlechtsspezifische
+Satzabschnitte
+eingefügt werden.
+****************************************************************************** -->
+
+<!--*******************************************************************************
+* Confirm Email Template
+****************************************************************************** -->
+<!--DOI-EMAIL-->
+<!--SENDER-EMAIL-->confirm@eyeomail.com<!--/SENDER-EMAIL-->
+<!--SENDER-NAME-->Adblock Plus<!--/SENDER-NAME-->
+<!--PRIORITY-->1<!--/PRIORITY-->
+<!--TO-->$$FULLNAME$$<!--/TO-->
+<!--SUBJECT-->Adblock Plus Newsletter Confirmation<!--/SUBJECT-->
+<!--BODY-->
+<html>
+<head>
+<title>test</title>
+<style type="text/css">
+html,body{
+ margin:0;
+ padding:0;
+ height:100%;
+ border:none;
+ font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;
+}
+</style>
+</head>
+<body bgcolor="#EBEBEB">
+<div style="width:100%;height:100%;background-color:#EBEBEB">
+<table border="0" cellspacing="0" cellpadding="0" width="600" bgcolor="#D9E1E8" align="center">
+ <tr>
+ <td width="600" height="70">
+ <img src="http://asp.backclick.de/email-header/email-header-anmeldebestaetigung.png">
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2" width="600">
+
+ <table cellpadding="0" border="0" cellspacing="25" width="600">
+ <tr>
+ <td style="color:#003366;" width="600">
+ Dear $$FULLNAME$$,<br><br>
+ um Ihre Anmeldung zu vervollständigen, müssen Sie auf den folgenden Link<br>
+ klicken, oder diesen kopieren und in Ihrer Browserzeile einfügen und die entsprechende<br>
+ Seite aufrufen:<br><br>
+
+ $$DOI-LINK$$<br><br>
+
+ Sie werden dann mit folgenden Daten:<br><br>
+ E-Mail: $$EMAIL$$<br>
+ Passwort: $$PASSWORD$$<br>
+ FULLNAME: $$FULLNAME$$<br><br>
+
+ <!--SUCCESS:NEW-NEWSLETTER-->für folgende Newsletter:<br><br><!--/SUCCESS:NEW-NEWSLETTER-->
+
+ <!--SUCCESS:NEW-NEWSLETTER-1--> - Newsletter 1<br><!--/SUCCESS:NEW-NEWSLETTER-1-->
+
+ <br>angemeldet.<br><br>
+ </td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ <tr>
+ <td bgcolor="#3A5775" colspan="2" width="600">
+ <div style="margin-left:25px;margin-top:10px;margin-bottom:10px;font-size:10pt;color:white">
+ Sollten Sie diese E-Mail ungewollt erhalten haben, bitten wir<br>
+ Sie darum, diese E-Mail einfach zu ignorieren.
+ </div>
+ </td>
+ </tr>
+</table>
+</div>
+</body>
+</html>
+<!--/BODY-->
+<!--TEXT-->
+Dear $$FULLNAME$$,
+um Ihre Anmeldung zu vervollständigen, müssen Sie auf den folgenden Link
+klicken, oder diesen kopieren und in Ihrer Browserzeile einfügen und die entsprechende
+Seite aufrufen:
+
+$$DOI-LINK$$
+
+Sie werden dann mit folgenden Daten:
+
+E-Mail: $$EMAIL$$
+Passwort: $$PASSWORD$$
+FULLNAME: $$FULLNAME$$
+
+<!--SUCCESS:NEW-NEWSLETTER-->für folgende Newsletter:<!--/SUCCESS:NEW-NEWSLETTER-->
+
+<!--SUCCESS:NEW-NEWSLETTER-1--> - Newsletter 1<!--/SUCCESS:NEW-NEWSLETTER-1--><!--SUCCESS:NEW-NEWSLETTER-2-->
+- Newsletter 2<!--/SUCCESS:NEW-NEWSLETTER-2--><!--SUCCESS:NEW-NEWSLETTER-3-->
+- Newsletter 3<!--/SUCCESS:NEW-NEWSLETTER-3--><!--SUCCESS:NEW-NEWSLETTER-4-->
+- Newsletter 3<!--/SUCCESS:NEW-NEWSLETTER-4-->
+
+angemeldet.
+
+-----------
+Sollten Sie diese E-Mail ungewollt erhalten haben, bitten wir
+Sie darum, diese E-Mail einfach zu ignorieren.
+<!--/TEXT-->
+<!--/DOI-EMAIL-->
+
+<!--*******************************************************************************
+* Subscription Confirmed Template
+****************************************************************************** -->
+<!--
+Für den Abschnitt "CONFIRM-EMAIL" gelten die gleichen Regeln, wie für
+den Abschnitt "DOI"
+-->
+
+<!--CONFIRM-EMAIL-->
+<!--SENDER-NAME-->Adblock Plus<!--/SENDER-NAME-->
+<!--PRIORITY-->3<!--/PRIORITY-->
+<!--TO-->$$FULLNAME$$<!--/TO-->
+<!--SUBJECT-->Adblock Plus Newsletter Subscription Successful<!--/SUBJECT-->
+<!--BODY-->
+<html>
+<head>
+<title>test</title>
+<style type="text/css">
+html,body{
+ margin:0;
+ padding:0;
+ height:100%;
+ border:none;
+ font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;
+}
+</style>
+</head>
+<body bgcolor="#EBEBEB">
+<div style="width:100%;height:100%;background-color:#EBEBEB">
+<table border="0" cellspacing="0" cellpadding="0" width="600" bgcolor="#D9E1E8" align="center">
+ <tr>
+ <td width="600" height="70">
+ <img src="http://asp.backclick.de/email-header/email-header-anmeldung-erfolgreich.png">
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2" width="600">
+ <table cellpadding="0" border="0" cellspacing="25" width="600">
+ <tr>
+ <td style="color:#003366;" width="600">
+ Sie wurden mit folgenden Daten<br><br>
+
+ E-Mail: $$EMAIL$$<br>
+ FULLNAME: $$FULLNAME$$<br>
+ Passwort: $$PASSWORD$$<br><br>
+
+ <!--SUCCESS:NEW-NEWSLETTER-->für folgende Newsletter:<br><br><!--/SUCCESS:NEW-NEWSLETTER-->
+
+ <!--SUCCESS:NEW-NEWSLETTER-1--> - Newsletter 1<br><!--/SUCCESS:NEW-NEWSLETTER-1-->
+ <br>angemeldet.<br><br>
+
+ Viel Vergnügen beim Lesen Ihrer Newsletter wünscht Ihnen<br><br>
+
+ <strong>Ihr Redaktions-Team</strong><br><br>
+ </td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ <tr>
+ <td bgcolor="#3A5775" colspan="2" width="600">
+ <div style="margin-left:25px;margin-top:10px;margin-bottom:10px;font-size:10pt;color:white">
+ Sollten Sie diese E-Mail ungewollt erhalten haben, bitten wir<br>
+ Sie darum, diese E-Mail einfach zu ignorieren.
+ </div>
+ </td>
+ </tr>
+</table>
+</div>
+</body>
+</html>
+<!--/BODY-->
+<!--TEXT-->
+Dear $$FULLNAME$$,
+
+Sie wurden mit folgenden Daten
+
+E-Mail: $$EMAIL$$
+FULLNAME: $$FULLNAME$$
+Passwort: $$PASSWORD$$
+
+<!--SUCCESS:NEW-NEWSLETTER-->für folgende Newsletter:<!--/SUCCESS:NEW-NEWSLETTER-->
+
+<!--SUCCESS:NEW-NEWSLETTER-1--> - Newsletter 1<!--/SUCCESS:NEW-NEWSLETTER-1--><!--SUCCESS:NEW-NEWSLETTER-2-->
+- Newsletter 2<!--/SUCCESS:NEW-NEWSLETTER-2--><!--SUCCESS:NEW-NEWSLETTER-3-->
+- Newsletter 3<!--/SUCCESS:NEW-NEWSLETTER-3--><!--SUCCESS:NEW-NEWSLETTER-4-->
+- Newsletter 4<!--/SUCCESS:NEW-NEWSLETTER-4-->
+
+angemeldet.
+
+Viel Vergnügen beim Lesen Ihrer Newsletter wünscht Ihnen
+
+Ihr Redaktions-Team
+
+-----------
+Sollten Sie diese E-Mail ungewollt erhalten haben, bitten wir
+Sie darum, diese E-Mail einfach zu ignorieren.
+<!--/TEXT-->
+<!--/CONFIRM-EMAIL-->
« no previous file with comments | « .hgignore ('k') | default.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld