Add enrollment page for Firefox Pioneer. (#6529)
This commit is contained in:
Michael Kelly
Kumar McMillan
Родитель
774c3b927e
Коммит
e6a101d217
|
|
@ -0,0 +1,85 @@
|
|||
<!DOCTYPE html>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Firefox Pioneer</title>
|
||||
<link rel="stylesheet" href="{{ STATIC_URL }}css/pioneer/main.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="page-container">
|
||||
<header class="header">
|
||||
<div class="layout-wrapper">
|
||||
<img class="wordmark" src="{{ STATIC_URL }}img/pioneer/wordmark.svg" alt="Firefox">
|
||||
</div>
|
||||
</header>
|
||||
<div class="banner">
|
||||
<div class="layout-wrapper">
|
||||
<h1 class="banner-text">Introducing Firefox Pioneer</h1>
|
||||
<div class="icon-container">
|
||||
<img class="icon" src="{{ STATIC_URL }}img/pioneer/flag.svg">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-wrapper">
|
||||
<section class="program-description">
|
||||
<p class="callout">Mozilla wants to better understand the health of the web, how users interact with it, and how people use their browsers.</p>
|
||||
<p><a href="https://medium.com/firefox-context-graph/context-graph-its-time-to-bring-context-back-to-the-web-a7542fe45cf3">We think that browsers could do so much more</a> through a better understanding of user behavior. By using the experience of people at human-scale, we can give you content that enriches your life. Pioneer will help us understand and build those experiences, but we can’t do it alone!</p>
|
||||
<p>In order to achieve this, we need to collect and analyze data about web browsing habits. We would like to identify a group of users willing to share this information with us. Data collection will happen in the background while you use Firefox, and your browser may occasionally change behavior slightly.</p>
|
||||
<p><strong>Participation in Firefox Pioneer is strictly voluntary.</strong></p>
|
||||
<a href="https://addons.mozilla.org/firefox/downloads/latest/firefox-pioneer/?src=shield-study-16" class="enroll-button">Enroll in Firefox Pioneer</a>
|
||||
</section>
|
||||
<section class="program-instructions">
|
||||
<h2 class="program-header">What Will Happen Next</h2>
|
||||
<p><strong>If you agree</strong> to participate:</p>
|
||||
<ol>
|
||||
<li>A preference will change to note that you are willing to participate in Pioneer studies. Continue using Firefox as you normally would.</li>
|
||||
<li>Periodically, we will enroll you in studies looking at some aspect of Firefox or the web in general. These studies will collect varying information about your browsing behavior, possibly including what web pages you visit and how you interact with them.</li>
|
||||
<li>Periodically, we may ask participants a yes/no question about what they are currently doing with the browser. As with all of Firefox Pioneer, choosing to answer these questions will be entirely optional.</li>
|
||||
</ol>
|
||||
</section>
|
||||
<section class="program-leaving">
|
||||
<h2 class="program-header">Leaving Pioneer</h2>
|
||||
<p>Users are welcome to opt out of any individual study or to leave the Firefox Pioneer group entirely.</p>
|
||||
<p>To leave the Firefox Pioneer group entirely:</p>
|
||||
<ol>
|
||||
<li>Type <code>about:addons</code> into the location bar and press <code>Enter</code>.</li>
|
||||
<li>If you see an addon called <code>Firefox Pioneer</code>, click <strong>Remove</strong>.</li>
|
||||
<li>Opting out of Firefox Pioneer will immediately stop all Pioneer studies currently being run, and you will not be added to any new ones.</li>
|
||||
</ol>
|
||||
|
||||
<p>To leave an individual study:</p>
|
||||
<ol>
|
||||
<li>Type <code>about:studies</code> into the location bar, and press <code>Enter</code>.</li>
|
||||
<li>All the studies that are currently running will be listed. To opt out of a specific study, click on the <code>Disable</code> button next to the study.</li>
|
||||
<li>Opting out of a study will immediately stop collection of data associated with that study and remove any changes made to the browser as part of the study.</li>
|
||||
</ol>
|
||||
<p>Opting out of an individual study will not cause you to be removed from future studies.</p>
|
||||
</section>
|
||||
<section class="program-privacy">
|
||||
<h2 class="program-header">Your Privacy</h2>
|
||||
<p>Mozilla understands the sensitivity of the data it may collect in some Pioneer studies and works hard to keep your data private and secure:</p>
|
||||
<ul>
|
||||
<li>We will not attempt to collect cookies, account names, passwords, email addresses, or POST form values.</li>
|
||||
<li>The <strong>data you submit is encrypted in Firefox</strong> and not decrypted until it is on a server that is not connected to the wider internet.</li>
|
||||
<li>This data will be linked to a randomly generated ID we only use for Firefox Pioneer. It is used to keep a specific user's data together on the server and helps us improve our analysis.</li>
|
||||
<li>No data will be collected from inside Private Browsing windows.</li>
|
||||
<li>Proposed studies will be reviewed by a panel consisting of privacy experts, internet researchers and web security engineers to ensure that the data being collected is appropriate and respects the user’s privacy.</li>
|
||||
<li>Individual data will never be shared publicly or sold. Only a small number of researchers will have access to raw data. If we share aggregate information from an studies, we will disclose it in a way that minimizes the risk of participants being identified.</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="program-thanks">
|
||||
<h2 class="program-header">You Help Make Firefox Better</h1>
|
||||
<p>At Mozilla, we pride ourselves on building products for you, the user! That’s why we need your help.</p>
|
||||
<p>By participating in this group, you will help us to make better decisions on your behalf and shape the future of Firefox!</p>
|
||||
<a href="https://addons.mozilla.org/firefox/downloads/latest/firefox-pioneer/?src=shield-study-16" class="enroll-button">Enroll in Firefox Pioneer</a>
|
||||
</section>
|
||||
</div>
|
||||
<footer class="footer">
|
||||
<img class="mozilla-logo" src="{{ STATIC_URL }}img/pioneer/mozilla.svg">
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -20,7 +20,8 @@ class TestPages(TestCase):
|
|||
'pages.shield_study_9', 'pages.shield_study_10',
|
||||
'pages.shield_study_11', 'pages.shield_study_12',
|
||||
'pages.shield_study_13', 'pages.shield_study_14',
|
||||
'pages.shield_study_15', 'pages.shield_study_16']
|
||||
'pages.shield_study_15', 'pages.shield_study_16',
|
||||
'pages.pioneer']
|
||||
for page in pages:
|
||||
self._check(page, 200)
|
||||
|
||||
|
|
|
|||
|
|
@ -94,4 +94,7 @@ urlpatterns = [
|
|||
TemplateView.as_view(template_name='pages/sunbird.html'),
|
||||
name='pages.sunbird'),
|
||||
url('^sunbird/', lambda r: perma_redirect(reverse('pages.sunbird'))),
|
||||
url('^pioneer$',
|
||||
TemplateView.as_view(template_name='pages/pioneer.html'),
|
||||
name='pages.pioneer'),
|
||||
]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,161 @@
|
|||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Sans';
|
||||
src:
|
||||
local("Fira Sans"),
|
||||
local("Fira Sans Regular"),
|
||||
url("../../fonts/fira/woff2/FiraSans-Regular.woff2") format("woff2"),
|
||||
url("../../fonts/fira/woff/FiraSans-Regular.woff") format("woff"),
|
||||
url("../../fonts/fira/otf/FiraSans-Regular.otf") format("opentype");
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Sans';
|
||||
src:
|
||||
local("Fira Sans Bold"),
|
||||
url("../../fonts/fira/woff2/FiraSans-Bold.woff2") format("woff2"),
|
||||
url("../../fonts/fira/woff/FiraSans-Bold.woff") format("woff"),
|
||||
url("../../fonts/fira/otf/FiraSans-Bold.otf") format("opentype");
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
min-height: 100%;
|
||||
min-width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 62.5%;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Fira Sans, sans-serif;
|
||||
font-size: 1.6rem;
|
||||
line-height: 2.2rem;
|
||||
|
||||
background-color: #1e4488;
|
||||
background-image: radial-gradient(ellipse 250% 100% at center 140%,#737ffd 0,#0065b8 50%,#1e4488 100%);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.page-container {
|
||||
background-attachment: fixed;
|
||||
background-image: url("../../img/pioneer/stars.png");
|
||||
background-size: 1180px 346px;
|
||||
background-position: top;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
@media
|
||||
(min-device-pixel-ratio: 2),
|
||||
(min-resolution: 192dpi) {
|
||||
.page-container {
|
||||
background-image: url("../../img/pioneer/stars@2x.png");
|
||||
}
|
||||
}
|
||||
|
||||
.wordmark {
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.header {
|
||||
margin: 20px 0 10px;
|
||||
}
|
||||
|
||||
.layout-wrapper {
|
||||
max-width: 960px;
|
||||
padding: 0 20px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.banner {
|
||||
background: hsla(0,0%,100%,.05);
|
||||
box-shadow: inset 0 -4px 0 hsla(0,0%,100%,.05),0 1px 0 rgba(0,0,0,.1);
|
||||
}
|
||||
|
||||
.banner .layout-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 15px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.banner .icon-container {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.banner .icon {
|
||||
height: 66px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.banner .banner-text {
|
||||
margin: 0;
|
||||
flex: 1;
|
||||
line-height: 45px;
|
||||
}
|
||||
|
||||
.program-header {
|
||||
margin: 40px 0 15px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
text-align: center;
|
||||
margin: 100px 0;
|
||||
}
|
||||
|
||||
.mozilla-logo {
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.enroll-button {
|
||||
background: #57bd35;
|
||||
color: #fff;
|
||||
border: 1px solid #40a624;
|
||||
padding: 24px 12px;
|
||||
width: 320px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
margin: 40px auto 0;
|
||||
display: block;
|
||||
font-size: 23px;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.enroll-button:hover {
|
||||
background: #40a624;
|
||||
border: 1px solid #399320;
|
||||
}
|
||||
|
||||
.enroll-button:active {
|
||||
background: #399320;
|
||||
border: 1px solid #2e761a;
|
||||
}
|
||||
|
||||
.enroll-button.enrolled {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: #f9f9f9;
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="19px" height="25px" viewBox="0 0 19 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Group 9</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="Group-9" fill="#FFFFFF">
|
||||
<path d="M17.6622318,3.49012876 C17.9197425,3.69613734 18.0742489,3.97939914 18.0742489,4.31416309 L18.0742489,13.4300429 C18.0742489,13.9193133 17.739485,14.3313305 17.2759657,14.4343348 L15.4218884,14.8978541 C14.5206009,15.1296137 13.5678112,15.232618 12.5635193,15.232618 C11.2244635,15.232618 9.85965665,14.9751073 8.49484979,14.4858369 L8.41759657,14.4600858 C6.69227468,13.8420601 4.83819742,13.7133047 3.11287554,14.0480687 L2.16008584,14.2283262 L2.16008584,23.3699571 C2.16008584,23.9364807 1.69656652,24.4 1.13004292,24.4 C0.563519313,24.4 0.1,23.9364807 0.1,23.3699571 L0.1,1.43004292 C0.1,0.863519313 0.563519313,0.4 1.13004292,0.4 C1.69656652,0.4 2.16008584,0.863519313 2.16008584,1.43004292 L2.16008584,3.07811159 L2.70085837,2.9751073 C4.81244635,2.53733906 7.02703863,2.71759657 9.08712446,3.46437768 L9.19012876,3.46437768 C11.044206,4.15965665 13.0270386,4.26266094 14.932618,3.77339056 L16.7866953,3.30987124 C17.0699571,3.23261803 17.37897,3.28412017 17.6622318,3.49012876 Z M6.40329905,11.4694842 C6.35973716,11.7453761 6.5920672,11.9777062 6.86795913,11.9341443 C7.49234612,11.8470205 8.04412996,11.556608 8.46522817,11.1355098 L7.20193356,9.87221518 C6.78083536,10.2933134 6.49042281,10.8450972 6.40329905,11.4694842 Z M12.879499,5.87904258 C12.8940196,5.64671254 12.6907308,5.44342375 12.4584008,5.45794438 C10.8320905,5.53054752 9.3800277,6.16945514 8.30550126,7.21494032 C7.52138737,6.99713091 6.34521653,7.05521342 5.90959771,8.15878112 C6.2726134,8.26042551 6.70823222,8.44919367 7.14385105,8.73960622 C7.12933043,8.76864748 7.1148098,8.79768873 7.10028917,8.82672999 C7.0131654,8.98645689 7.05672729,9.17522505 7.17289231,9.29139007 L9.04605327,11.164551 C9.17673892,11.2952367 9.36550708,11.3242779 9.51071335,11.2371542 C9.53975461,11.2226335 9.56879586,11.2081129 9.59783712,11.1935923 C9.88824967,11.6292111 10.0770178,12.0648299 10.1786622,12.4278456 C11.2967505,11.9486649 11.3403124,10.816056 11.122503,10.0319421 C12.1679882,8.95741564 12.8068958,7.50535288 12.879499,5.87904258 Z" id="Combined-Shape" fill-rule="nonzero"></path>
|
||||
<path d="M10.4109923,6.73575961 C10.7449667,6.40178518 11.2677093,6.40178518 11.6016837,6.73575961 C11.9356582,7.06973405 11.9356582,7.59247664 11.6016837,7.92645108 C11.2677093,8.26042551 10.7449667,8.26042551 10.4109923,7.92645108 C10.0770178,7.59247664 10.0915385,7.05521342 10.4109923,6.73575961 Z" id="Path"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
После Ширина: | Высота: | Размер: 2.8 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 416.11 119.35"><defs></defs><title>mozilla</title><path d="M354.6 80.45c0 3.38 1.63 6.05 6.18 6.05 5.35 0 11.06-3.84 11.4-12.57a55.5 55.5 0 0 0-7.55-.69c-5.38 0-10.03 1.51-10.03 7.21z" fill="#FFF" fill-rule="evenodd"/><path d="M0 0v119.35h416.11V0zm121.42 96h-22V66.49c0-9.07-3-12.57-9-12.57-7.21 0-10.12 5.12-10.12 12.45v18.29h6.95v11.4h-22V66.49c0-9.07-3-12.57-9-12.57-7.21 0-10.12 5.12-10.12 12.45v18.29h10v11.4h-32v-11.4h7V55h-7.45V43.57h22.56v7.91c3.14-5.58 8.61-9 15.94-9 7.55 0 14.54 3.61 17.1 11.29 2.91-7 8.84-11.29 17.1-11.29 9.42 0 18 5.7 18 18.16v24h7zm33.39 1.16c-16.17 0-27.35-9.89-27.35-26.65 0-15.36 9.31-28 28.14-28s28 12.68 28 27.35c0 16.76-12.09 27.35-28.84 27.35zM238.36 96h-45.85L191 88.13 219.83 55h-16.4l-2.33 8.15L190.27 62l1.86-18.39h46.13l1.16 7.91-29.1 33.18h17l2.44-8.15 11.87 1.16zm28.39 0H251V77.2h15.71zm0-33.63H251v-18.8h15.71zM275 96l22.7-80h14.78l-22.7 80zm30.49 0l22.7-80H343l-22.73 80zm78.19 1.16c-7 0-10.82-4.08-11.52-10.47-3 5.35-8.38 10.47-16.87 10.47-7.55 0-16.17-4.08-16.17-15 0-12.92 12.45-15.94 24.44-15.94a68.8 68.8 0 0 1 8.61.47V65c0-5.35-.12-11.75-8.61-11.75-3.14 0-5.59.23-8 1.51l-1.94 7.45-12-1.28 2.33-13.61c9.19-3.73 13.84-4.8 22.46-4.8 11.29 0 20.83 5.82 20.83 17.81V83.1c0 3 1.16 4.08 3.61 4.08a7.89 7.89 0 0 0 2.21-.35l.12 7.91a20.3 20.3 0 0 1-9.45 2.47z" fill="#FFF" fill-rule="evenodd"/><path d="M155.39 54c-7.68 0-12.45 5.7-12.45 15.59 0 9.07 4.19 16.05 12.36 16.05 7.8 0 12.92-6.28 12.92-16.29-.03-10.54-5.73-15.35-12.83-15.35z" fill="#FFF" fill-rule="evenodd"/></svg>
|
||||
|
После Ширина: | Высота: | Размер: 1.6 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 6.1 KiB |
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 15 KiB |
Различия файлов скрыты, потому что одна или несколько строк слишком длинны
|
После Ширина: | Высота: | Размер: 138 KiB |
Загрузка…
Ссылка в новой задаче