Fixes Bug 1112894 - Build A/B pages for splash

This commit is contained in:
Aki Rose Braun 2014-12-18 20:35:38 -08:00
Родитель dc63db91a7
Коммит 1268242f43
10 изменённых файлов: 632 добавлений и 12 удалений

1
app.js
Просмотреть файл

@ -363,6 +363,7 @@ app.get("/about", routes.angular);
app.get("/make-your-own", routes.angular); app.get("/make-your-own", routes.angular);
app.get('/madewithcode-*', routes.angular); app.get('/madewithcode-*', routes.angular);
app.get('/home-:variant', routes.angular);
app.get('/explore', routes.gallery({ app.get('/explore', routes.gallery({
layout: "index", layout: "index",

Просмотреть файл

@ -24,6 +24,16 @@
footer { footer {
text-align: center; text-align: center;
} }
&.variant-2, &.variant-4 {
.home-blue {
@media @standard-def {
background-image: url('/img/home/background-variant.jpg');
}
@media @retina {
background-image: url('/img/home/background-variant@2x.jpg');
}
}
}
} }
.home-blue, .home-values, .home-jump-in, .home-footer { .home-blue, .home-values, .home-jump-in, .home-footer {

Просмотреть файл

@ -559,24 +559,20 @@
"message": "Our values", "message": "Our values",
"description": "Headline on second section of home" "description": "Headline on second section of home"
}, },
"Our goal is for everyone in the world": {
"message": "Our goal is for everyone in the world to be an informed creator of the free and open web.",
"description": ""
},
"Free": { "Free": {
"message": "Free", "message": "Free",
"description": "first value on home page" "description": "first value on home page"
}, },
"Mozilla is a nonprofit organization": { "Mozilla is a nonprofit organization": {
"message": "Mozilla is a non-profit organization. Our open-source tools are created by a global community. They will always be free—now and forever!", "message": "Mozilla is a non-profit organization and these open-source tools are created by a global community. They will always be 100% free—now and forever!",
"description": "Value description for free on home page" "description": "Value description for free on home page"
}, },
"Local": { "Local": {
"message": "Local", "message": "Local",
"description": "second value on home page" "description": "second value on home page"
}, },
"Wherever you live in the world": { "We all use the web in different ways.": {
"message": "Wherever you live in the world, Mozilla is dedicated to helping you build a web that is relevant to your friends, family, business, and community.", "message": "We all use the web in different ways. Mozilla is dedicated to helping you build a web thats relevant to your friends, family, business or community—no matter where you live.",
"description": "Value description for local on home page" "description": "Value description for local on home page"
}, },
"More than code": { "More than code": {
@ -587,6 +583,10 @@
"message": "Our tools, learning resources, and community networks empower everyone to become citizens of the web.", "message": "Our tools, learning resources, and community networks empower everyone to become citizens of the web.",
"description": "" "description": ""
}, },
"We believe that digital literacy is more than just learning to code.": {
"message": "We believe that digital literacy is more than just learning to code. Our tools, learning resources and community networks empower everyone to become citizens of the web.",
"description": "Value description for more than code on home page"
},
"Jump right in": { "Jump right in": {
"message": "Jump right in", "message": "Jump right in",
"description": "headline for third section on home page" "description": "headline for third section on home page"
@ -642,5 +642,25 @@
"Search gallery": { "Search gallery": {
"message": "Search gallery", "message": "Search gallery",
"description": "Text for search field on gallery page" "description": "Text for search field on gallery page"
},
"The web is yours": {
"message": "The web is yours",
"description": "headline on home"
},
"Learn to build it with Mozilla.": {
"message": "Learn to build it with Mozilla.",
"description": "subhead on home"
},
"Webmaker helps people across the world": {
"message": "Webmaker helps people across the world become informed creators of a free and open web.",
"description": "Subehad on our values"
},
"Help us build the future of the web": {
"message": "Help us build the future of the web",
"description": "headline on home"
},
"The global Mozilla community wants everyone to be a citizen of the web": {
"message": "The global Mozilla community wants everyone to be a citizen of the web—including you!",
"description": "subhead on home"
} }
} }

Различия файлов скрыты, потому что одна или несколько строк слишком длинны

После

Ширина:  |  Высота:  |  Размер: 19 KiB

7
public/js/angular/app.js поставляемый
Просмотреть файл

@ -102,6 +102,13 @@ angular.module('webmakerApp', ['ngRoute', 'ui.bootstrap', 'webmakerApp.services'
controller: 'homeController', controller: 'homeController',
title: 'Webmaker' title: 'Webmaker'
}) })
.when('/:locale/home-:variant', {
templateUrl: function (params) {
return '/views/home-' + params.variant + '.html';
},
controller: 'homeController',
title: 'Webmaker'
})
.otherwise({ .otherwise({
redirectTo: '/:locale' redirectTo: '/:locale'
}); });

137
public/views/home-2.html Normal file
Просмотреть файл

@ -0,0 +1,137 @@
<div ng-show="userDel" class="alert alert-info">{{ 'user_deleted' | i18n }}
</div>
<div id="page-home" class="variant-2">
<div class="home-blue">
<div class="container">
<div class="row">
<div class="col-sm-4 col-md-5">
<figure class="devices">
<img src="/img/home/desktop.svg" alt="Desktop computer" class="desktop"/>
<img src="/img/home/mobile.svg" alt="Mobile phone" class="mobile"/>
<img src="/img/home/tablet.svg" alt="Tablet computer" class="tablet"/>
</figure>
</div>
<section class="col-sm-8 col-md-6">
<h2>{{ 'The web is yours' | i18n }}</h2>
<p class="lead">
{{ 'Learn to build it with Mozilla.' | i18n }}
</p>
<form id="home-start-form">
<input type="email" class="home-email-field" placeholder="{{ 'Email address' | i18n }}"/>
<button class="btn btn-default">
{{ 'Start creating' | i18n }}
</button>
</form>
</section>
</div>
</div>
</div>
<section class="home-values">
<div class="container">
<h3>
{{ 'Our values' | i18n }}
</h3>
<p class="lead">
{{ 'Webmaker helps people across the world' | i18n }}
</p>
<div class="row">
<div class="col-sm-7 col-md-5 col-lg-5 col-lg-offset-1">
<ul class="values-list">
<li class="value-free">
<h4>{{ 'Free' | i18n }}</h4>
<p>{{ 'Mozilla is a nonprofit organization' | i18n }}</p>
</li>
<li class="value-local">
<h4>{{ 'Local' | i18n }}</h4>
<p>{{ 'We all use the web in different ways.' | i18n }}</p>
</li>
<li class="value-more-than-code">
<h4>{{ 'More than code' | i18n }}</h4>
<p>
{{ 'We believe that digital literacy is more than just learning to code.' | i18n}}
</p>
</li>
</ul>
</div>
<div class="col-sm-4 col-sm-offset-1 col-md-7 col-md-offset-0 col-lg-6">
<figure class="home-globe">
<img src="/img/home/yellow-earth.svg" alt="Globe" height="300" width="300"/>
</figure>
</div>
</div>
</div>
</section>
<section class="home-jump-in">
<div class="container">
<h3>{{ 'Jump right in' | i18n }}</h3>
<p class="lead">
{{ 'Discover how you can build and share the web.' | i18n}}
</p>
<ul class="row">
<li class="col-sm-4">
<figure>
<a href="https://webmaker.org/{{ lang }}/explore/">
<img src="/img/home/gallery-md-icon.svg" alt="" width="154" height="120"/>
</a>
</figure>
<h4>{{ 'Explore Webmaker' | i18n }}</h4>
<p>
{{ 'Investigate the tools, learning resources' | i18n }}
<a href="https://webmaker.org/{{ lang }}/explore/">
{{ 'Explore now' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
<img src="/img/home/learntoteach-md-icon.svg" alt="" width="152" height="120"/>
</a>
</figure>
<h4>{{ 'Learn to Teach' | i18n }}</h4>
<p>
{{ 'Study at your own pace' | i18n }}
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
{{ 'Get training' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://events.webmaker.org/">
<img src="/img/home/get-together-md-icon.svg" alt="" width="155" height="120"/>
</a>
</figure>
<h4>{{ 'Get Together' | i18n }}</h4>
<p>
{{ 'Build the web with others' | i18n }}
<a href="https://events.webmaker.org/{{ lang }}/">
{{ 'View events' | i18n }}
</a>
</p>
</li>
</ul>
</div>
</section>
<footer class="home-footer">
<p>
{{ 'Build and share the web with Mozilla.' | i18n }}
<button class="btn btn-default" wm-join-webmaker>
{{ 'Start Creating' | i18n }}
</button>
</p>
</footer>
</div>
<!-- Footer -->
<div ng-include="'/views/partials/footer.html'"></div>

137
public/views/home-3.html Normal file
Просмотреть файл

@ -0,0 +1,137 @@
<div ng-show="userDel" class="alert alert-info">{{ 'user_deleted' | i18n }}
</div>
<div id="page-home">
<div class="home-blue">
<div class="container">
<div class="row">
<div class="col-sm-4 col-md-5">
<figure class="devices">
<img src="/img/home/desktop.svg" alt="Desktop computer" class="desktop"/>
<img src="/img/home/mobile.svg" alt="Mobile phone" class="mobile"/>
<img src="/img/home/tablet.svg" alt="Tablet computer" class="tablet"/>
</figure>
</div>
<section class="col-sm-8 col-md-6">
<h2>{{ 'Make your own apps and websites' | i18n }}</h2>
<p class="lead">
{{ 'Mozillas free tools' | i18n }}
</p>
<form id="home-start-form">
<input type="email" class="home-email-field" placeholder="{{ 'Email address' | i18n }}"/>
<button class="btn btn-default">
{{ 'Start creating' | i18n }}
</button>
</form>
</section>
</div>
</div>
</div>
<section class="home-values">
<div class="container">
<h3>
{{ 'Our values' | i18n }}
</h3>
<p class="lead">
{{ 'Webmaker helps people across the world' | i18n }}
</p>
<div class="row">
<div class="col-sm-7 col-md-5 col-lg-5 col-lg-offset-1">
<ul class="values-list">
<li class="value-free">
<h4>{{ 'Free' | i18n }}</h4>
<p>{{ 'Mozilla is a nonprofit organization' | i18n }}</p>
</li>
<li class="value-local">
<h4>{{ 'Local' | i18n }}</h4>
<p>{{ 'We all use the web in different ways.' | i18n }}</p>
</li>
<li class="value-more-than-code">
<h4>{{ 'More than code' | i18n }}</h4>
<p>
{{ 'We believe that digital literacy is more than just learning to code.' | i18n}}
</p>
</li>
</ul>
</div>
<div class="col-sm-4 col-sm-offset-1 col-md-7 col-md-offset-0 col-lg-6">
<figure class="home-globe">
<img src="/img/home/yellow-earth.svg" alt="Globe" height="300" width="300"/>
</figure>
</div>
</div>
</div>
</section>
<section class="home-jump-in">
<div class="container">
<h3>{{ 'Jump right in' | i18n }}</h3>
<p class="lead">
{{ 'Discover how you can build and share the web.' | i18n}}
</p>
<ul class="row">
<li class="col-sm-4">
<figure>
<a href="https://webmaker.org/{{ lang }}/explore/">
<img src="/img/home/gallery-md-icon.svg" alt="" width="154" height="120"/>
</a>
</figure>
<h4>{{ 'Explore Webmaker' | i18n }}</h4>
<p>
{{ 'Investigate the tools, learning resources' | i18n }}
<a href="https://webmaker.org/{{ lang }}/explore/">
{{ 'Explore now' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
<img src="/img/home/learntoteach-md-icon.svg" alt="" width="152" height="120"/>
</a>
</figure>
<h4>{{ 'Learn to Teach' | i18n }}</h4>
<p>
{{ 'Study at your own pace' | i18n }}
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
{{ 'Get training' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://events.webmaker.org/">
<img src="/img/home/get-together-md-icon.svg" alt="" width="155" height="120"/>
</a>
</figure>
<h4>{{ 'Get Together' | i18n }}</h4>
<p>
{{ 'Build the web with others' | i18n }}
<a href="https://events.webmaker.org/{{ lang }}/">
{{ 'View events' | i18n }}
</a>
</p>
</li>
</ul>
</div>
</section>
<footer class="home-footer">
<p>
{{ 'Build and share the web with Mozilla.' | i18n }}
<button class="btn btn-default" wm-join-webmaker>
{{ 'Start Creating' | i18n }}
</button>
</p>
</footer>
</div>
<!-- Footer -->
<div ng-include="'/views/partials/footer.html'"></div>

137
public/views/home-4.html Normal file
Просмотреть файл

@ -0,0 +1,137 @@
<div ng-show="userDel" class="alert alert-info">{{ 'user_deleted' | i18n }}
</div>
<div id="page-home" class="variant-4">
<div class="home-blue">
<div class="container">
<div class="row">
<div class="col-sm-4 col-md-5">
<figure class="devices">
<img src="/img/home/desktop.svg" alt="Desktop computer" class="desktop"/>
<img src="/img/home/mobile.svg" alt="Mobile phone" class="mobile"/>
<img src="/img/home/tablet.svg" alt="Tablet computer" class="tablet"/>
</figure>
</div>
<section class="col-sm-8 col-md-6">
<h2>{{ 'Help us build the future of the web' | i18n }}</h2>
<p class="lead">
{{ 'The global Mozilla community wants everyone to be a citizen of the web' | i18n }}
</p>
<form id="home-start-form">
<input type="email" class="home-email-field" placeholder="{{ 'Email address' | i18n }}"/>
<button class="btn btn-default">
{{ 'Start creating' | i18n }}
</button>
</form>
</section>
</div>
</div>
</div>
<section class="home-values">
<div class="container">
<h3>
{{ 'Our values' | i18n }}
</h3>
<p class="lead">
{{ 'Webmaker helps people across the world' | i18n }}
</p>
<div class="row">
<div class="col-sm-7 col-md-5 col-lg-5 col-lg-offset-1">
<ul class="values-list">
<li class="value-free">
<h4>{{ 'Free' | i18n }}</h4>
<p>{{ 'Mozilla is a nonprofit organization' | i18n }}</p>
</li>
<li class="value-local">
<h4>{{ 'Local' | i18n }}</h4>
<p>{{ 'We all use the web in different ways.' | i18n }}</p>
</li>
<li class="value-more-than-code">
<h4>{{ 'More than code' | i18n }}</h4>
<p>
{{ 'We believe that digital literacy is more than just learning to code.' | i18n}}
</p>
</li>
</ul>
</div>
<div class="col-sm-4 col-sm-offset-1 col-md-7 col-md-offset-0 col-lg-6">
<figure class="home-globe">
<img src="/img/home/yellow-earth.svg" alt="Globe" height="300" width="300"/>
</figure>
</div>
</div>
</div>
</section>
<section class="home-jump-in">
<div class="container">
<h3>{{ 'Jump right in' | i18n }}</h3>
<p class="lead">
{{ 'Discover how you can build and share the web.' | i18n}}
</p>
<ul class="row">
<li class="col-sm-4">
<figure>
<a href="https://webmaker.org/{{ lang }}/explore/">
<img src="/img/home/gallery-md-icon.svg" alt="" width="154" height="120"/>
</a>
</figure>
<h4>{{ 'Explore Webmaker' | i18n }}</h4>
<p>
{{ 'Investigate the tools, learning resources' | i18n }}
<a href="https://webmaker.org/{{ lang }}/explore/">
{{ 'Explore now' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
<img src="/img/home/learntoteach-md-icon.svg" alt="" width="152" height="120"/>
</a>
</figure>
<h4>{{ 'Learn to Teach' | i18n }}</h4>
<p>
{{ 'Study at your own pace' | i18n }}
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
{{ 'Get training' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://events.webmaker.org/">
<img src="/img/home/get-together-md-icon.svg" alt="" width="155" height="120"/>
</a>
</figure>
<h4>{{ 'Get Together' | i18n }}</h4>
<p>
{{ 'Build the web with others' | i18n }}
<a href="https://events.webmaker.org/{{ lang }}/">
{{ 'View events' | i18n }}
</a>
</p>
</li>
</ul>
</div>
</section>
<footer class="home-footer">
<p>
{{ 'Build and share the web with Mozilla.' | i18n }}
<button class="btn btn-default" wm-join-webmaker>
{{ 'Start Creating' | i18n }}
</button>
</p>
</footer>
</div>
<!-- Footer -->
<div ng-include="'/views/partials/footer.html'"></div>

137
public/views/home-5.html Normal file
Просмотреть файл

@ -0,0 +1,137 @@
<div ng-show="userDel" class="alert alert-info">{{ 'user_deleted' | i18n }}
</div>
<div id="page-home">
<div class="home-blue">
<div class="container">
<div class="row">
<div class="col-sm-4 col-md-5">
<figure class="devices">
<img src="/img/home/desktop.svg" alt="Desktop computer" class="desktop"/>
<img src="/img/home/mobile.svg" alt="Mobile phone" class="mobile"/>
<img src="/img/home/tablet.svg" alt="Tablet computer" class="tablet"/>
</figure>
</div>
<section class="col-sm-8 col-md-6">
<h2>{{ 'The web is yours' | i18n }}</h2>
<p class="lead">
{{ 'Learn to build it with Mozilla.' | i18n }}
</p>
<form id="home-start-form">
<input type="email" class="home-email-field" placeholder="{{ 'Email address' | i18n }}"/>
<button class="btn btn-default">
{{ 'Start creating' | i18n }}
</button>
</form>
</section>
</div>
</div>
</div>
<section class="home-values">
<div class="container">
<h3>
{{ 'Our values' | i18n }}
</h3>
<p class="lead">
{{ 'Webmaker helps people across the world' | i18n }}
</p>
<div class="row">
<div class="col-sm-7 col-md-5 col-lg-5 col-lg-offset-1">
<ul class="values-list">
<li class="value-free">
<h4>{{ 'Free' | i18n }}</h4>
<p>{{ 'Mozilla is a nonprofit organization' | i18n }}</p>
</li>
<li class="value-local">
<h4>{{ 'Local' | i18n }}</h4>
<p>{{ 'We all use the web in different ways.' | i18n }}</p>
</li>
<li class="value-more-than-code">
<h4>{{ 'More than code' | i18n }}</h4>
<p>
{{ 'We believe that digital literacy is more than just learning to code.' | i18n}}
</p>
</li>
</ul>
</div>
<div class="col-sm-4 col-sm-offset-1 col-md-7 col-md-offset-0 col-lg-6">
<figure class="home-globe">
<img src="/img/home/lightgrey-earth.svg" alt="Globe" height="300" width="300"/>
</figure>
</div>
</div>
</div>
</section>
<section class="home-jump-in">
<div class="container">
<h3>{{ 'Jump right in' | i18n }}</h3>
<p class="lead">
{{ 'Discover how you can build and share the web.' | i18n}}
</p>
<ul class="row">
<li class="col-sm-4">
<figure>
<a href="https://webmaker.org/{{ lang }}/explore/">
<img src="/img/home/gallery-md-icon.svg" alt="" width="154" height="120"/>
</a>
</figure>
<h4>{{ 'Explore Webmaker' | i18n }}</h4>
<p>
{{ 'Investigate the tools, learning resources' | i18n }}
<a href="https://webmaker.org/{{ lang }}/explore/">
{{ 'Explore now' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
<img src="/img/home/learntoteach-md-icon.svg" alt="" width="152" height="120"/>
</a>
</figure>
<h4>{{ 'Learn to Teach' | i18n }}</h4>
<p>
{{ 'Study at your own pace' | i18n }}
<a href="https://training.webmakerprototypes.org/{{ lang }}/">
{{ 'Get training' | i18n }}
</a>
</p>
</li>
<li class="col-sm-4">
<figure>
<a href="https://events.webmaker.org/">
<img src="/img/home/get-together-md-icon.svg" alt="" width="155" height="120"/>
</a>
</figure>
<h4>{{ 'Get Together' | i18n }}</h4>
<p>
{{ 'Build the web with others' | i18n }}
<a href="https://events.webmaker.org/{{ lang }}/">
{{ 'View events' | i18n }}
</a>
</p>
</li>
</ul>
</div>
</section>
<footer class="home-footer">
<p>
{{ 'Build and share the web with Mozilla.' | i18n }}
<button class="btn btn-default" wm-join-webmaker>
{{ 'Start Creating' | i18n }}
</button>
</p>
</footer>
</div>
<!-- Footer -->
<div ng-include="'/views/partials/footer.html'"></div>

Просмотреть файл

@ -12,10 +12,10 @@
</figure> </figure>
</div> </div>
<section class="col-sm-8 col-md-6"> <section class="col-sm-8 col-md-6">
<h2>{{ 'Make your own apps and websites' | i18n }}</h2> <h2>{{ 'The web is yours' | i18n }}</h2>
<p class="lead"> <p class="lead">
{{ 'Mozillas free tools' | i18n }} {{ 'Learn to build it with Mozilla.' | i18n }}
</p> </p>
<form id="home-start-form"> <form id="home-start-form">
@ -35,7 +35,7 @@
</h3> </h3>
<p class="lead"> <p class="lead">
{{ 'Our goal is for everyone in the world' | i18n }} {{ 'Webmaker helps people across the world' | i18n }}
</p> </p>
<div class="row"> <div class="row">
@ -49,12 +49,14 @@
<li class="value-local"> <li class="value-local">
<h4>{{ 'Local' | i18n }}</h4> <h4>{{ 'Local' | i18n }}</h4>
<p>{{ 'Wherever you live in the world' | i18n }}</p> <p>{{ 'We all use the web in different ways.' | i18n }}</p>
</li> </li>
<li class="value-more-than-code"> <li class="value-more-than-code">
<h4>{{ 'More than code' | i18n }}</h4> <h4>{{ 'More than code' | i18n }}</h4>
<p>{{ 'Our tools, learning resources, and' | i18n}}</p> <p>
{{ 'We believe that digital literacy is more than just learning to code.' | i18n}}
</p>
</li> </li>
</ul> </ul>
</div> </div>