summaryrefslogtreecommitdiffstats
path: root/browser/components/pocket/content/panels/tmpl
diff options
context:
space:
mode:
Diffstat (limited to 'browser/components/pocket/content/panels/tmpl')
-rw-r--r--browser/components/pocket/content/panels/tmpl/ho2/ho2_articleinfo.handlebars9
-rw-r--r--browser/components/pocket/content/panels/tmpl/ho2/ho2_download.handlebars13
-rw-r--r--browser/components/pocket/content/panels/tmpl/ho2/ho2_download_error.handlebars13
-rw-r--r--browser/components/pocket/content/panels/tmpl/ho2/ho2_sharebutton.handlebars7
-rw-r--r--browser/components/pocket/content/panels/tmpl/item_recs.handlebars24
-rw-r--r--browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_a.handlebars12
-rw-r--r--browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_b.handlebars11
-rw-r--r--browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_c.handlebars11
-rw-r--r--browser/components/pocket/content/panels/tmpl/saved_premiumextras.handlebars2
-rw-r--r--browser/components/pocket/content/panels/tmpl/saved_premiumshell.handlebars8
-rw-r--r--browser/components/pocket/content/panels/tmpl/saved_shell.handlebars33
-rw-r--r--browser/components/pocket/content/panels/tmpl/saved_tmplogin.handlebars20
-rw-r--r--browser/components/pocket/content/panels/tmpl/signup_shell.handlebars27
-rw-r--r--browser/components/pocket/content/panels/tmpl/signupstoryboard_shell.handlebars54
14 files changed, 244 insertions, 0 deletions
diff --git a/browser/components/pocket/content/panels/tmpl/ho2/ho2_articleinfo.handlebars b/browser/components/pocket/content/panels/tmpl/ho2/ho2_articleinfo.handlebars
new file mode 100644
index 0000000000..f9633c17e1
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/ho2/ho2_articleinfo.handlebars
@@ -0,0 +1,9 @@
+<div class="pkt_ext_experiment_saved_tile pkt_ext_cf {{#if has_image }}pkt_ext_has_image{{/if}}">
+ {{#if has_image}}
+ <div class="pkt_ext_save_image" style="background-image:url('{{image_src}}'); background-size:cover; background-position:center center;" data-imgsrc="{{image_src}}"></div>
+ {{/if}}
+ <div class="pkt_ext_save_title">
+ <div class="pkt_ext_save_open">{{title}}</div>
+ <div class="pkt_ext_save_source">{{domain}}</div>
+ </div>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/ho2/ho2_download.handlebars b/browser/components/pocket/content/panels/tmpl/ho2/ho2_download.handlebars
new file mode 100644
index 0000000000..747cf6b6cf
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/ho2/ho2_download.handlebars
@@ -0,0 +1,13 @@
+<div class="pkt_ext_detail pkt_ext_saved_sendcollectemail">
+ <h3 class="pkt_ext_heading">Check your inbox</h3>
+ <p class="pkt_ext_description">We’ve sent an email to <span class="pkt_ext_bold">{{email}}</span> with a link to install the Pocket app, where your article will be waiting for you.</p>
+
+ <div class="pkt_ext_download_section">
+ <p class="pkt_ext_description">You can also get it on the App Store here:</p>
+
+ <div class="pkt_ext_download_button_wrapper">
+ <a href="https://getpocket.com/apps/link/pocket-iphone/?s=fx_save_hanger" target="_blank" ><div class="pkt_ext_apple_download"></div></a>
+ <a href="https://getpocket.com/apps/link/pocket-android/?s=fx_save_hanger" target="_blank" ><img class="pkt_ext_google_download" alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png'/></a>
+ </div>
+ </div>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/ho2/ho2_download_error.handlebars b/browser/components/pocket/content/panels/tmpl/ho2/ho2_download_error.handlebars
new file mode 100644
index 0000000000..303a7af13c
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/ho2/ho2_download_error.handlebars
@@ -0,0 +1,13 @@
+<div class="pkt_ext_detail pkt_ext_saved_sendcollectemail">
+ <h3 class="pkt_ext_heading">There was a problem</h3>
+ <p class="pkt_ext_description">Email failed to send, please try again later</p>
+
+ <div class="pkt_ext_download_section">
+ <p class="pkt_ext_description">You can also get the Pocket app on the App Store here:</p>
+
+ <div class="pkt_ext_download_button_wrapper">
+ <a href="https://getpocket.com/apps/link/pocket-iphone/?s=fx_save_hanger" target="_blank" ><div class="pkt_ext_apple_download"></div></a>
+ <a href="https://getpocket.com/apps/link/pocket-android/?s=fx_save_hanger" target="_blank" ><img class="pkt_ext_google_download" alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png'/></a>
+ </div>
+ </div>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/ho2/ho2_sharebutton.handlebars b/browser/components/pocket/content/panels/tmpl/ho2/ho2_sharebutton.handlebars
new file mode 100644
index 0000000000..9c7ee85e79
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/ho2/ho2_sharebutton.handlebars
@@ -0,0 +1,7 @@
+<div class="pkt_ext_detail pkt_ext_saved_sendtomobile">
+ <button id="pkt_ext_sendtomobile_button" class="pkt_ext_button">
+ <span class="pkt_ext_save_title_wrapper pkt_ext_mobile_icon">
+ <span class="pkt_ext_logo_action_copy">Send to your phone</span>
+ </span>
+ </button>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/item_recs.handlebars b/browser/components/pocket/content/panels/tmpl/item_recs.handlebars
new file mode 100644
index 0000000000..ce18b647d7
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/item_recs.handlebars
@@ -0,0 +1,24 @@
+<header>
+ {{#if recommendations.[1] }}
+ <h4>Similar Stories</h4>
+ {{else}}
+ <h4>Similar Story</h4>
+ {{/if}}
+ <a class="pkt_ext_learn_more" target="_blank" href="https://getpocket.com/story_recommendations_learn_more">Learn more</a>
+</header>
+
+<ol>
+ {{#each recommendations}}
+ <li>
+ <a href="{{this.item.resolved_url}}" class="pkt_ext_item_recs_link" target="_blank">
+
+ {{#if this.item.encodedThumbURL}}
+ <img class="rec-thumb" src="https://img-getpocket.cdn.mozilla.net/80x80/filters:format(jpeg):quality(60):no_upscale():strip_exif()/{{this.item.encodedThumbURL}}" />
+ {{/if}}
+
+ <p class="rec-title">{{this.item.title}}</p>
+ <p class="rec-source">{{this.item.domain_metadata.name}}</p>
+ </a>
+ </li>
+ {{/each}}
+</ol>
diff --git a/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_a.handlebars b/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_a.handlebars
new file mode 100644
index 0000000000..9d9344f05f
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_a.handlebars
@@ -0,0 +1,12 @@
+<div class="los_variant_wrapper">
+ <div class="los_variant_top">
+ <h1>Click the <img src="img/glyph.svg" alt="Pocket Button" height="14" /> button to save articles, videos, and links to Pocket.</h1>
+ <p>Enjoy everything you save, on any device.</p>
+ <a class="pkt_ext_learnmore" href="https://getpocket.com/pocket-and-firefox?utm_campaign=logged_out_save_test&utm_source=variant_a">Learn more ›</a>
+ </div>
+
+ <div class="los_variant_bottom">
+ <a class="los_variant_button signup-btn-email" href="https://getpocket.com/signup?utm_campaign=logged_out_save_test&utm_source=variant_a">Get Pocket for free</a>
+ <p class="los_variant_sub">Already a Pocket user? <a class="pkt_ext_login" href="https://getpocket.com/login?utm_campaign=logged_out_save_test&utm_source=variant_a">Log in.</a></p>
+ </div>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_b.handlebars b/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_b.handlebars
new file mode 100644
index 0000000000..68baef6fd9
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_b.handlebars
@@ -0,0 +1,11 @@
+<div class="los_variant_wrapper">
+ <div class="los_variant_top">
+ <h1>Here's your save button for the internet.</h1>
+ <a class="pkt_ext_learnmore" href="https://getpocket.com/pocket-and-firefox?utm_campaign=logged_out_save_test&utm_source=variant_b">Learn more ›</a>
+ </div>
+
+ <div class="los_variant_bottom">
+ <a class="los_variant_button signup-btn-email" href="https://getpocket.com/signup?utm_campaign=logged_out_save_test&utm_source=variant_b">Get Pocket for free</a>
+ <p class="los_variant_sub">Already a Pocket user? <a class="pkt_ext_login" href="https://getpocket.com/login?utm_campaign=logged_out_save_test&utm_source=variant_b">Log in.</a></p>
+ </div>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_c.handlebars b/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_c.handlebars
new file mode 100644
index 0000000000..1722524596
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/loggedoutvariants/variant_c.handlebars
@@ -0,0 +1,11 @@
+<div class="los_variant_wrapper">
+ <div class="los_variant_top">
+ <h1>Get Pocket to save anything to your personal corner of the internet.</h1>
+ <a class="pkt_ext_learnmore" href="https://getpocket.com/pocket-and-firefox?utm_campaign=logged_out_save_test&utm_source=variant_c">Learn more ›</a>
+ </div>
+
+ <div class="los_variant_bottom">
+ <a class="los_variant_button signup-btn-email" href="https://getpocket.com/signup?utm_campaign=logged_out_save_test&utm_source=variant_c">Sign up for free</a>
+ <p class="los_variant_sub">Already a Pocket user? <a class="pkt_ext_login" href="https://getpocket.com/login?utm_campaign=logged_out_save_test&utm_source=variant_c">Log in.</a></p>
+ </div>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/saved_premiumextras.handlebars b/browser/components/pocket/content/panels/tmpl/saved_premiumextras.handlebars
new file mode 100644
index 0000000000..b224450ec1
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/saved_premiumextras.handlebars
@@ -0,0 +1,2 @@
+<div class="pkt_ext_suggestedtag_detailshown">
+</div> \ No newline at end of file
diff --git a/browser/components/pocket/content/panels/tmpl/saved_premiumshell.handlebars b/browser/components/pocket/content/panels/tmpl/saved_premiumshell.handlebars
new file mode 100644
index 0000000000..892c947cc9
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/saved_premiumshell.handlebars
@@ -0,0 +1,8 @@
+<div class="pkt_ext_suggestedtag_detail pkt_ext_suggestedtag_detail_loading">
+ <h4>{{suggestedtags}}</h4>
+ <div class="pkt_ext_loadingspinner"><div></div></div>
+ <ul class="pkt_ext_cf">
+ </ul>
+</div>
+
+<hr/>
diff --git a/browser/components/pocket/content/panels/tmpl/saved_shell.handlebars b/browser/components/pocket/content/panels/tmpl/saved_shell.handlebars
new file mode 100644
index 0000000000..9efc974894
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/saved_shell.handlebars
@@ -0,0 +1,33 @@
+<div class="pkt_ext_initload">
+ <div class="pkt_ext_logo"></div>
+ <div class="pkt_ext_topdetail">
+ <h2>{{saving}}</h2>
+ </div>
+ <div class="pkt_ext_loadingspinner"><div></div></div>
+</div>
+<div class="pkt_ext_detail">
+ <div class="pkt_ext_logo"></div>
+ <div class="pkt_ext_topdetail">
+ <h2>{{pagesaved}}</h2>
+ <h3 class="pkt_ext_errordetail"></h3>
+ <nav class="pkt_ext_item_actions pkt_ext_cf">
+ <ul>
+ <li><a class="pkt_ext_removeitem" href="#">{{removepage}}</a></li>
+ <li class="pkt_ext_actions_separator"></li>
+ <li><a class="pkt_ext_openpocket" href="https://{{pockethost}}/a?src=ff_ext_saved" target="_blank">{{viewlist}}</a></li>
+ </ul>
+ </nav>
+ </div>
+ <div class="pkt_ext_tag_detail pkt_ext_cf">
+ <div class="pkt_ext_tag_input_wrapper">
+ <div class="pkt_ext_tag_input_blocker"></div>
+ <input class="pkt_ext_tag_input" type="text" placeholder="{{addtags}}">
+ </div>
+ <a href="#" class="pkt_ext_btn pkt_ext_btn_disabled">{{save}}</a>
+ </div>
+ <p class="pkt_ext_edit_msg"></p>
+</div>
+
+<div class="pkt_ext_subshell">
+ <div class="pkt_ext_item_recs"></div>
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/saved_tmplogin.handlebars b/browser/components/pocket/content/panels/tmpl/saved_tmplogin.handlebars
new file mode 100644
index 0000000000..b6a488d888
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/saved_tmplogin.handlebars
@@ -0,0 +1,20 @@
+<div class="pkt_ext_detail pkt_ext_saved_tmplogin pkt_shaded_background">
+ <div class="pkt_ext_indent_bordered">
+ <p>You are using Pocket without an account.<br />Sign up to back up your saved items.</p>
+ <p><a href="https://help.getpocket.com/article/1129-using-pocket-without-an-account-in-firefox?s=ghost_upsell" target="_blank">Learn more</a></p>
+ </div>
+
+ {{#if fxasignedin}}
+ <button id="pkt_ext_tmp_account_signup" class="pkt_ext_button pkt_ext_blue_button">
+ <span class="pkt_ext_save_title_wrapper pkt_ext_ffx_icon">
+ <span class="pkt_ext_logo_action_copy">Login with Firefox</span>
+ </span>
+ </button>
+ {{else}}
+ <button id="pkt_ext_tmp_account_signup" class="pkt_ext_button">
+ <span class="pkt_ext_save_title_wrapper">
+ <span class="pkt_ext_logo_action_copy">Sign up</span>
+ </span>
+ </button>
+ {{/if}}
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/signup_shell.handlebars b/browser/components/pocket/content/panels/tmpl/signup_shell.handlebars
new file mode 100644
index 0000000000..34aa9e9ca2
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/signup_shell.handlebars
@@ -0,0 +1,27 @@
+<div class="pkt_ext_introdetail pkt_ext_introdetailhero">
+ <h2 class="pkt_ext_logo">Pocket</h2>
+ <p class="pkt_ext_tagline">{{tagline}}</p>
+ {{#if showlearnmore}}
+ {{#if controlvariant}}
+ <p class="pkt_ext_learnmorecontainer"><a class="pkt_ext_learnmore" href="https://{{pockethost}}/firefox_learnmore?utm_campaign=logged_out_save_test&utm_source=control&s=ffi&t=learnmore&tv=panel_control&v={{variant}}" target="_blank">{{learnmore}}</a></p>
+ {{else}}
+ <p class="pkt_ext_learnmorecontainer"><a class="pkt_ext_learnmore" href="https://{{pockethost}}/firefox_learnmore?utm_campaign=logged_out_save_test&utm_source=control&s=ffi&t=learnmore&tv=panel_tryit&v={{variant}}" target="_blank">{{learnmore}}</a></p>
+ {{/if}}
+ {{else}}
+ <p class="pkt_ext_learnmorecontainer"><a class="pkt_ext_learnmore pkt_ext_learnmoreinactive" href="#">{{learnmore}}</a></p>
+ {{/if}}
+ <div class="pkt_ext_introimg"></div>
+</div>
+<div class="pkt_ext_signupdetail pkt_ext_signupdetail_hero">
+ {{#if controlvariant}}
+ <h4>{{signuptosave}}</h4>
+ <p class="btn-container"><a href="https://{{pockethost}}/ff_signup?utm_campaign=logged_out_save_test&utm_source=control&s=ffi&tv=panel_control&t=signupff&v={{variant}}" target="_blank" class="btn signup-btn-firefox"><span class="logo"></span><span class="text">{{signupfirefox}}</span></a></p>
+ <p class="btn-container"><a href="https://{{pockethost}}/signup?utm_campaign=logged_out_save_test&utm_source=control&force=email&tv=panel_control&src=extension&s=ffi&t=signupemail&v={{variant}}" target="_blank" class="btn btn-secondary signup-btn-email signup-btn-initstate">{{signupemail}}</a></p>
+ <p class="alreadyhave">{{alreadyhaveacct}} <a class="pkt_ext_login" href="https://{{pockethost}}/login?utm_campaign=logged_out_save_test&utm_source=control&ep=3&tv=panel_control&src=extension&s=ffi&t=login&v={{variant}}" target="_blank">{{loginnow}}</a>.</p>
+ {{else}}
+ <p class="btn-container"><a href="https://{{pockethost}}/firefox_tryitnow?utm_campaign=logged_out_save_test&utm_source=control&s=ffi&tv=panel_tryit&t=tryitnow" target="_blank" class="btn signup-btn-tryitnow"><span class="text">{{tryitnow}}</span></a></p>
+ <p class="alreadyhave tryitnowspace">{{alreadyhaveacct}} <a class="pkt_ext_login" href="https://{{pockethost}}/login?utm_campaign=logged_out_save_test&utm_source=control&ep=3&s=ffi&tv=panel_tryit&src=extension&t=login&v={{variant}}" target="_blank">{{loginnow}}</a>.</p>
+ <p class="pkt_ext_tos">{{{tos}}}</p>
+ {{/if}}
+
+</div>
diff --git a/browser/components/pocket/content/panels/tmpl/signupstoryboard_shell.handlebars b/browser/components/pocket/content/panels/tmpl/signupstoryboard_shell.handlebars
new file mode 100644
index 0000000000..7d3d16b7ba
--- /dev/null
+++ b/browser/components/pocket/content/panels/tmpl/signupstoryboard_shell.handlebars
@@ -0,0 +1,54 @@
+<div class="pkt_ext_introdetail pkt_ext_introdetailstoryboard">
+ <div class="pkt_ext_introstory pkt_ext_introstoryone">
+ <div class="pkt_ext_introstory_text">
+ <p class="pkt_ext_tagline">{{taglinestory_one}}</p>
+ </div>
+ <div class="pkt_ext_introstoryone_img"></div>
+ </div>
+ <div class="pkt_ext_introstorydivider"></div>
+ <div class="pkt_ext_introstory pkt_ext_introstorytwo">
+ <div class="pkt_ext_introstory_text">
+ <p class="pkt_ext_tagline">{{taglinestory_two}}</p>
+ {{#if showlearnmore}}
+ {{#if controlvariant}}
+ <p><a class="pkt_ext_learnmore" href="https://{{pockethost}}/firefox_learnmore?utm_campaign={{utmCampaign}}&utm_source={{utmSource}}&s=ffi&t=learnmore&tv=panel_control&v={{variant}}" target="_blank">{{learnmore}}</a></p>
+ {{else}}
+ <p><a class="pkt_ext_learnmore" href="https://{{pockethost}}/firefox_learnmore?utm_campaign={{utmCampaign}}&utm_source={{utmSource}}&s=ffi&t=learnmore&tv=panel_tryit&v={{variant}}" target="_blank">{{learnmore}}</a></p>
+ {{/if}}
+ {{else}}
+ <p><a class="pkt_ext_learnmore pkt_ext_learnmoreinactive" href="#">{{learnmore}}</a></p>
+ {{/if}}
+ </div>
+ <div class="pkt_ext_introstorytwo_img"></div>
+ </div>
+</div>
+<div class="pkt_ext_signupdetail">
+ {{#if controlvariant}}
+ <h4>{{signuptosave}}</h4>
+ {{#if buttonVariant}}
+ {{#if oneButton}}
+ <p class="btn-container">
+ <a href="https://{{pockethost}}/signup?utm_campaign={{utmCampaign}}&utm_source=button_variant&tv=panel_control&src=extension&s=ffi&t=signupemail&v={{variant}}" target="_blank" class="btn signup-btn-email signup-btn-initstate">Sign up</a>
+ </p>
+ {{else}}
+ <p class="btn-container">
+ <a href="https://{{pockethost}}/ff_signup?utm_campaign={{utmCampaign}}&utm_source=button_control&s=ffi&tv=panel_control&t=signupff&v={{variant}}" target="_blank" class="btn signup-btn-firefox">
+ <span class="logo"></span><span class="text">{{signupfirefox}}</span>
+ </a>
+ </p>
+ <p class="btn-container">
+ <a href="https://{{pockethost}}/signup?utm_campaign={{utmCampaign}}&utm_source=button_control&force=email&tv=panel_control&src=extension&s=ffi&t=signupemail&v={{variant}}" target="_blank" class="btn btn-secondary signup-btn-email signup-btn-initstate">{{signupemail}}</a>
+ </p>
+ {{/if}}
+ {{else}}
+ <p class="btn-container"><a href="https://{{pockethost}}/ff_signup?utm_campaign={{utmCampaign}}&utm_source={{utmSource}}&s=ffi&tv=panel_control&t=signupff&v={{variant}}" target="_blank" class="btn signup-btn-firefox"><span class="logo"></span><span class="text">{{signupfirefox}}</span></a></p>
+ <p class="btn-container"><a href="https://{{pockethost}}/signup?utm_campaign={{utmCampaign}}&utm_source={{utmSource}}&force=email&tv=panel_control&src=extension&s=ffi&t=signupemail&v={{variant}}" target="_blank" class="btn btn-secondary signup-btn-email signup-btn-initstate">{{signupemail}}</a></p>
+ {{/if}}
+ <p class="alreadyhave">{{alreadyhaveacct}} <a class="pkt_ext_login" href="https://{{pockethost}}/login?utm_campaign={{utmCampaign}}&utm_source={{utmSource}}&ep=3&tv=panel_control&src=extension&s=ffi&t=login&v={{variant}}" target="_blank">{{loginnow}}</a>.</p>
+ {{else}}
+ <p class="btn-container"><a href="https://{{pockethost}}/firefox_tryitnow?utm_campaign={{utmCampaign}}&utm_source={{utmSource}}&s=ffi&tv=panel_tryit&t=tryitnow" target="_blank" class="btn signup-btn-tryitnow"><span class="text">{{tryitnow}}</span></a></p>
+ <p class="alreadyhave tryitnowspace">{{alreadyhaveacct}} <a class="pkt_ext_login" href="https://{{pockethost}}/login?utm_campaign={{utmCampaign}}&utm_source={{utmSource}}&ep=3&s=ffi&tv=panel_tryit&src=extension&t=login&v={{variant}}" target="_blank">{{loginnow}}</a>.</p>
+ <p class="pkt_ext_tos">{{{tos}}}</p>
+ {{/if}}
+</div>
+