mirror of
https://github.com/HabitRPG/habitica.git
synced 2025-12-19 15:48:04 +01:00
662 lines
54 KiB
Plaintext
662 lines
54 KiB
Plaintext
doctype html
|
|
html(ng-app='habitrpg', ng-controller='RootCtrl')
|
|
head
|
|
meta(charset='utf-8')
|
|
link(href='//fonts.googleapis.com/css?family=Lato:400,700', rel='stylesheet', type='text/css')
|
|
title Habitica | Your Life the Role Playing Game
|
|
meta(name='description', content='')
|
|
meta(name='keywords', content='')
|
|
meta(name='author', content='')
|
|
meta(name='geo.placename', content='')
|
|
meta(name='viewport', content='width=device-width, maximum-scale=1')
|
|
meta(property='og:url', content='https://habitica.com/static/front')
|
|
meta(property='og:type', content='website')
|
|
meta(property='og:title', content='Habitica: Your Life the Role Playing Game')
|
|
meta(property='og:description', content='Habitica is a free habit building and productivity app that treats your real life like a game. With in-game rewards and punishments to motivate you and a strong social network to inspire you, Habitica can help you achieve your goals to become healthy, hard-working, and happy.')
|
|
meta(property='og:site_name', content='Habitica')
|
|
meta(property='og:image', content='https://s3.amazonaws.com/habitica-assets/assets/gryphon_logo_300x300.png')
|
|
meta(property='fb:app_id', content='128307497299777')
|
|
meta(name='twitter:card' content='summary')
|
|
meta(name='twitter:site' content='@habitica')
|
|
meta(name='twitter:title' content='Habitica: Your Life the Role Playing Game')
|
|
meta(name='twitter:description' content='Habitica is a free habit-building and productivity app that treats your real life like a game! Motivate yourself with in-game rewards and social encouragement.')
|
|
meta(name='twitter:image' content='https://s3.amazonaws.com/habitica-assets/assets/gryphon_logo.png')
|
|
meta(name='apple-itunes-app' content='app-id=994882113')
|
|
meta(name='google-play-app' content='app-id=com.habitrpg.android.habitica')
|
|
link(rel='apple-touch-icon' href='/logo.png')
|
|
link(rel='android-touch-icon' href='/logo.png')
|
|
link(rel='canonical', href='', type='text/html')
|
|
link(rel='shortcut icon', sizes="32x32", href='/favicon.ico')
|
|
link(rel='shortcut icon', sizes="192x192", href='/favicon_192x192.png')
|
|
link(rel='mask-icon', href='/favicon.ico')
|
|
|
|
link(rel='stylesheet', type='text/css', href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.min.css')
|
|
|
|
script(type='text/javascript').
|
|
window.env = !{JSON.stringify(env._.pick(env, env.clientVars))};
|
|
|
|
script(type='text/javascript', src='https://habitica.com/common/dist/scripts/habitrpg-shared.js')
|
|
!= env.getManifestFiles("tmp_static_front")
|
|
|
|
script(type='text/javascript', src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js')
|
|
script(type='text/javascript', src='https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.1/ui-bootstrap.min.js')
|
|
script(type='text/javascript', src='https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.12.1/ui-bootstrap-tpls.min.js')
|
|
|
|
body(ng-controller='AuthCtrl')
|
|
include ./login-modal
|
|
include ../shared/avatar/index
|
|
include ../shared/mixins
|
|
include ../shared/modals/members
|
|
|
|
noscript.banner= env.t('jsDisabledHeadingFull')
|
|
br
|
|
a(href='http://www.enable-javascript.com/', target='_blank')= env.t('jsDisabledLink')
|
|
|
|
.mobile-container
|
|
div(ng-init='Analytics.track({"hitType":"pageview","eventCategory":"page","eventAction":"landing page","page":"/static/front"});')
|
|
header#header
|
|
nav.navbar.navbar-default.navbar-static-top
|
|
.container-fluid
|
|
// Brand and toggle get grouped for better mobile display
|
|
.navbar-header
|
|
button.navbar-toggle.collapsed(type='button', data-toggle='collapse', data-target='#bs-example-navbar-collapse-1')
|
|
span.sr-only Toggle navigation
|
|
span.icon-bar
|
|
span.icon-bar
|
|
span.icon-bar
|
|
a.navbar-brand(href='#')
|
|
img.img-rendering-auto(src='https://d2afqr2xdmyzvu.cloudfront.net/assets/habitica_lockup2_desat.png', alt=env.t('altAttrNavLogo'))
|
|
// Collect the nav links, forms, and other content for toggling
|
|
#bs-example-navbar-collapse-1.collapse.navbar-collapse
|
|
ul.nav.navbar-nav.navbar-right
|
|
li
|
|
a(href='/static/features')=env.t('companyAbout')
|
|
li
|
|
a(href='/static/plans')=env.t('groupPlans')
|
|
li
|
|
a(href='http://blog.habitrpg.com/')=env.t('companyBlog')
|
|
li
|
|
a(href='/static/press-kit')=env.t('presskit')
|
|
li
|
|
a(href='/static/contact')=env.t('contactUs')
|
|
li
|
|
button#header-play-button.btn.btn-primary.navbar-btn.navbar-right(ng-click='playButtonClick()')= env.t('playButtonFull')
|
|
#intro
|
|
h1=env.t('motivate1')
|
|
img.img-rendering-auto.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/intro.png', alt='')
|
|
//- The empty alt attribute isn't a mistake, it's part of the spec for purely decorative images that add no information
|
|
// insert intro images
|
|
.introcall.bg-success
|
|
h4= env.t('joinOthers', {userCount:userCount})
|
|
small
|
|
button#play-btn.btn.btn-primary.btn-lg.gamifybutton(ng-click='playButtonClick()')= env.t('free')
|
|
.presslogos.text-center.img-rendering-auto
|
|
= env.t('featuredIn')
|
|
br
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/lifehacker.png', alt=env.t('altAttrLifehacker'))
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/nyt-logo.png', alt=env.t('altAttrNewYorkTimes'))
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/makeuseof.png', alt=env.t('altAttrMakeUseOf'))
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/Forbes_logo.png', alt=env.t('altAttrForbes'))
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/Cnetlogo.png', alt=env.t('altAttrCnet'))
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/Fast-Company-logo.png', alt=env.t('altAttrFastCompany'))
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/kickstarter-logo.png', alt=env.t('altAttrKickstarter'))
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/discover-logo.png', alt=env.t('altAttrDiscover'))
|
|
#intro-text
|
|
.container-fluid
|
|
.row
|
|
.col-md-8.col-md-offset-2
|
|
p.lead.text-center
|
|
= env.t('leadText')
|
|
section#testimonial-carousel.bg-info
|
|
.container-fluid
|
|
.row
|
|
.col-md-3.col-md-offset-1
|
|
h2= env.t('testimonialHeading')
|
|
img.img-say.img-responsive.visible-lg-block(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/uses/publicSpaces.png', alt='')
|
|
// Testimonials
|
|
.col-md-8.col-sm-10.col-sx-10
|
|
#quote-carousel.carousel.slide(data-interval='10000', data-ride='carousel')
|
|
// Bottom Carousel Indicators
|
|
ol.carousel-indicators
|
|
li.active(data-target='#quote-carousel', data-slide-to='0')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Drag0nsilver.png', alt='')
|
|
li(data-target='#quote-carousel', data-slide-to='1')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/frabjabulous.png', alt='')
|
|
li(data-target='#quote-carousel', data-slide-to='2')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/AndeeLiao.png', alt='')
|
|
li(data-target='#quote-carousel', data-slide-to='3')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/AlexandraSo.png', alt='')
|
|
// Carousel Slides / Quotes
|
|
.carousel-inner.text-center
|
|
// Quote 1
|
|
.item.active
|
|
blockquote
|
|
.row
|
|
.col-sm-8.col-sm-offset-2
|
|
p
|
|
= env.t('dragonsilverQuote')
|
|
small Drag0nsilver
|
|
// Quote 2
|
|
.item
|
|
blockquote
|
|
.row
|
|
.col-sm-8.col-sm-offset-2
|
|
p
|
|
= env.t('frabjabulousQuote')
|
|
small frabjabulous
|
|
// Quote 3
|
|
.item
|
|
blockquote
|
|
.row
|
|
.col-sm-8.col-sm-offset-2
|
|
p
|
|
= env.t('andeeliaoQuote')
|
|
small AndeeLiao
|
|
.item
|
|
blockquote
|
|
.row
|
|
.col-sm-8.col-sm-offset-2
|
|
p
|
|
= env.t('alexandraQuote')
|
|
small _AlexandraSo_
|
|
// Carousel Buttons Next/Prev
|
|
a.left.carousel-control(data-slide='prev', href='#quote-carousel')
|
|
i.fa.fa-chevron-left
|
|
a.right.carousel-control(data-slide='next', href='#quote-carousel')
|
|
i.fa.fa-chevron-right
|
|
button.btn.btn-primary.btn-lg.gamifybutton.fixedcta(ng-click='playButtonClick()')= env.t('gamifyButton')
|
|
section#uses
|
|
h2= env.t('examplesHeading')
|
|
.container-fluid
|
|
#myCarousel.carousel.slide(data-interval='10000', data-ride='carousel')
|
|
ul.nav.nav-pills.nav-justified
|
|
li.active(data-target='#myCarousel', data-slide-to='0')
|
|
a(href='#')=env.t('work')
|
|
li(data-target='#myCarousel', data-slide-to='1')
|
|
a(href='#')=env.t('health')
|
|
li(data-target='#myCarousel', data-slide-to='2')
|
|
a(href='#')=env.t('teams')
|
|
li(data-target='#myCarousel', data-slide-to='3')
|
|
a(href='#')=env.t('school')
|
|
li(data-target='#myCarousel', data-slide-to='4')
|
|
a(href='#')=env.t('goals')
|
|
li(data-target='#myCarousel', data-slide-to='5')
|
|
a(href='#')=env.t('chores')
|
|
// Wrapper for slides
|
|
.carousel-inner(style='z-index:0;')
|
|
.item.active.work-use
|
|
h3
|
|
= env.t('work')
|
|
br
|
|
small
|
|
a(href='/static/plans')= env.t('businessText')
|
|
.carousel-content.row
|
|
.sampletasks.col-lg-4.col-md-6.col-sm-12.col-xs-12
|
|
h4= env.t('sampleHabits')
|
|
div(style='width:100%; background-color: rgb(252, 229, 205); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(219, 120, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('businessSample1')
|
|
br
|
|
div(style='width:100%; background-color: rgb(201, 218, 248); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(90, 98, 223); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('businessSample2')
|
|
br
|
|
div(style='width:100%; background-color: #d9ead3; color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(113, 176, 91); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('businessSample3')
|
|
br
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('businessSample4')
|
|
br
|
|
div(style='width:100%; background-color: rgb(244, 204, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(220, 93, 93); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; background-color: rgb(220, 93, 93); border-right: 0px none;') -
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('businessSample5')
|
|
img.sample-img.visible-lg-inline-block(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/uses/coding.png', alt='')
|
|
.usetweet-groups.col-lg-5.col-md-6.visible-lg-inline-block.visible-md-inline-block
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='frabjabulous', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/frabjabulous.png', alt=env.t('altAttrFrabjabulous'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('frabjabulousQuote')
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='_AlexandraSo_', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/AlexandraSo.png', alt=env.t('altAttrAlexandraSo'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('alexandraQuote')
|
|
// End item
|
|
.item.health-use
|
|
h3= env.t('health')
|
|
.carousel-content.row
|
|
.sampletasks.col-lg-4.col-md-6.col-sm-12.col-xs-12
|
|
h4= env.t('sampleHabits')
|
|
div(style='width:100%; background-color: #d9ead3; color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(113, 176, 91); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; background-color: rgb(113, 176, 91); border-right: 0px none;') -
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('healthSample1')
|
|
br
|
|
div(style='width:100%; background-color: rgb(244, 204, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(220, 93, 93); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; background-color: rgb(220, 93, 93); border-right: 0px none;') -
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('healthSample2')
|
|
br
|
|
div(style='width:100%; background-color: #d9ead3; color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(113, 176, 91); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; background-color: rgb(113, 176, 91); border-right: 0px none;') -
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('healthSample3')
|
|
br
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; background-color: rgb(255, 207, 66); border-right: 0px none;') -
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('healthSample4')
|
|
br
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('healthSample5')
|
|
img.sample-img.visible-lg-inline-block(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/uses/clipart-rosemonkeyct-meditation.png', alt='')
|
|
.usetweet-groups.col-lg-5.col-md-6.visible-lg-inline-block.visible-md-inline-block
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='EvaGantz', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/EvaGantz.png', alt=env.t('altAttrEvaGantz'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('evagantzQuote')
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='supermouse35', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/supermouse35.png', alt=env.t('altAttrSupermouse35'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('supermouse35Quote')
|
|
// End Item
|
|
.item.team-use
|
|
h3= env.t('teams')
|
|
.carousel-content.row
|
|
.sampletasks.col-lg-4.col-md-6.col-sm-12.col-xs-12
|
|
h4= env.t('sampleToDo')
|
|
div(style='width:100%; background-color: rgb(252, 229, 205); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(219, 120, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('teamSample1')
|
|
br
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('teamSample2')
|
|
br
|
|
div(style='width:100%; background-color: rgb(244, 204, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(220, 93, 93); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('teamSample3')
|
|
br
|
|
img.sample-img.visible-lg-inline-block(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/uses/publicSpaces.png', alt='')
|
|
.usetweet-groups.col-lg-5.col-md-6.visible-lg-inline-block.visible-md-inline-block
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='Althaire', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Althaire.png', alt=env.t('altAttrAlthaire'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('althaireQuote')
|
|
// End Item
|
|
.item.school-use
|
|
h3= env.t('school')
|
|
.carousel-content.row
|
|
.sampletasks.col-lg-4.col-md-6.col-sm-12.col-xs-12
|
|
h4= env.t('sampleHabits')
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('schoolSample1')
|
|
br
|
|
div(style='width:100%; background-color: #d9ead3; color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(113, 176, 91); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('schoolSample2')
|
|
br
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('schoolSample3')
|
|
br
|
|
div(style='width:100%; background-color: rgb(244, 204, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(220, 93, 93); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; background-color: rgb(220, 93, 93); border-right: 0px none;') -
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('schoolSample4')
|
|
br
|
|
div(style='width:100%; background-color: rgb(201, 218, 248); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(90, 98, 223); border-right: 1px solid rgba(0, 0, 0, 0.25);') +
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; background-color: rgb(90, 98, 223); border-right: 0px none;') -
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('schoolSample5')
|
|
img.sample-img.visible-lg-inline-block(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/uses/reading.png', alt='')
|
|
.usetweet-groups.col-lg-5.col-md-6.visible-lg-inline-block.visible-md-inline-block
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='InfH', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/InfH.png', alt=env.t('altAttrInfH'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content= env.t('infhQuote')
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='Drei-M', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Drei-M.png', alt=env.t('altAttrDreiM'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('dreimQuote')
|
|
// End Item
|
|
.item.improvement-use
|
|
h3= env.t('goals')
|
|
.carousel-content.row
|
|
.sampletasks.col-lg-4.col-md-6.col-sm-12.col-xs-12
|
|
h4= env.t('sampleDailies')
|
|
div(style='width:100%; background-color: rgb(252, 229, 205); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(219, 120, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('goalSample1')
|
|
br
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('goalSample2')
|
|
br
|
|
div(style='width:100%; background-color: rgb(244, 204, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(220, 93, 93); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('goalSample3')
|
|
br
|
|
img.sample-img.visible-lg-inline-block(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/uses/gaining_an_achievement_by_cosmic_caterpillar-d7uyv5z.png', alt='')
|
|
.usetweet-groups.col-lg-5.col-md-6.visible-lg-inline-block.visible-md-inline-block
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='Kazui', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Kazui.png', alt=env.t('altAttrKazui'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('kazuiQuote')
|
|
// End Item
|
|
.item.housework-use
|
|
h3= env.t('chores')
|
|
.carousel-content.row
|
|
.sampletasks.col-lg-4.col-md-6.col-sm-12.col-xs-12
|
|
h4= env.t('sampleDailies')
|
|
div(style='width:100%; background-color: rgb(252, 229, 205); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(219, 120, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('choreSample1')
|
|
br
|
|
div(style='width:100%; background-color: rgb(255, 242, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(255, 207, 66); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('choreSample2')
|
|
br
|
|
div(style='width:100%; background-color: rgb(244, 204, 204); color: rgb(51, 51, 51); text-align:center; padding: 0px; line-height: 1.62765; list-style: none outside none; padding: 0px; height: 2.3em; min-height: 1.62765em; margin-bottom:0.75em; margin:0px; box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5) inset;')
|
|
.task-btn(style='display: inline-block; width: 1.62765em; height: 1.62765em; padding: 0px; margin:0px; line-height: 1.62765; text-align: center; color: rgb(34, 34, 34); float:left; cursor: pointer; vertical-align: top; left:0px; position:relative; background-color: rgb(220, 93, 93); border-right: 1px solid rgba(0, 0, 0, 0.25);')
|
|
span(style='padding: 0.5em 0px 0em 0em; color: #666;') ☐
|
|
|
|
|
.task-desc(style='display: inline-block; font-family: Lato,sans-serif; padding: 0.6em 0px 0em 1em; letter-spacing: normal; float:left; word-wrap: break-word;')= env.t('choreSample3')
|
|
br
|
|
img.sample-img.visible-lg-inline-block(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/uses/dusting_by_leephon.png', alt='')
|
|
.usetweet-groups.col-lg-5.col-md-6.visible-lg-inline-block.visible-md-inline-block
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='autumnesquirrel', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/autumnesquirrel.png', alt=env.t('altAttrAutumnesquirrel'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content= env.t('autumnesquirrelQuote')
|
|
.usetweet-group
|
|
img(data-toggle='tooltip', data-placement='top', title='irishfeet123', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/irishfeet123.png', alt=env.t('altAttrIrishfeet123'))
|
|
.usetweet.tweet.popover.right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('irishfeet123Quote')
|
|
// End Item
|
|
// End Carousel
|
|
button.btn.btn-primary.btn-lg.gamifybutton.fixedcta(ng-click='playButtonClick()')= env.t('gamifyButton')
|
|
section#rewards.bg-warning.container-fluid
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12
|
|
h2.headline= env.t('rewardHeading')
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12.col-xs-12
|
|
p.sectioninfo
|
|
= env.t('rewardByline1')
|
|
br
|
|
br
|
|
= env.t('rewardByline2')
|
|
.scrolltweet.hidden-xs.hidden-sm
|
|
img.img-rendering-auto.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='Elmi', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Elmi.png', alt=env.t('altAttrElmi'))
|
|
.tweet.popover.right.pull-right
|
|
.arrow
|
|
.popover-content= env.t('elmiQuote')
|
|
.col-lg-4.col-md-4.col-lg-offset-1.col-sm-8.well.col-xs-8.col-xs-offset-2.col-sm-offset-2.well-lg
|
|
.avatarscroll
|
|
h2
|
|
span.glyphicon.glyphicon-check
|
|
h2
|
|
span.glyphicon.glyphicon-arrow-down
|
|
img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/misc/shop_gold.png', alt='')
|
|
img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/misc/shop_gold.png', alt='')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/misc/shop_gold.png', alt='')
|
|
h2
|
|
span.glyphicon.glyphicon-arrow-down
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/TVreward.png', alt='')
|
|
button.btn.btn-primary.btn-lg.fixedcta.gamifybutton(ng-click='playButtonClick()')= env.t('gamifyButton')
|
|
section#levels.container-fluid
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12
|
|
h2.headline= env.t('unlockHeadline')
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12
|
|
p.sectioninfo
|
|
= env.t('unlockByline1')
|
|
br
|
|
br
|
|
= env.t('unlockByline2')
|
|
.scrolltweet.hidden-xs.hidden-sm
|
|
img.img-rendering-auto.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='16bitFil', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/16bitFil.png', alt=env.t('altAttr16bitFil'))
|
|
.tweet.popover.right.pull-right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('sixteenBitFilQuote')
|
|
.col-lg-4.col-md-4.col-lg-offset-1.col-sm-8.well.col-xs-8.col-xs-offset-2.col-sm-offset-2
|
|
.avatarscroll
|
|
img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/avatar/avatarstatic.png', alt='')
|
|
h2
|
|
span.glyphicon.glyphicon-arrow-down
|
|
img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/SAMPLEadventurers.png', alt='')
|
|
button.btn.btn-primary.btn-lg.fixedcta.gamifybutton(ng-click='playButtonClick()')= env.t('gamifyButton')
|
|
section#health.bg-danger.container-fluid
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12
|
|
h2.headline= env.t('punishHeading1')
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12
|
|
h2= env.t('punishHeading2')
|
|
p.sectioninfo= env.t('punishByline')
|
|
.scrolltweet.hidden-xs.hidden-sm
|
|
img.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='Zelah Meyer', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Zelah_Meyer.png', alt=env.t('altAttrZelahMeyer'))
|
|
.tweet.popover.right.pull-right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('zelahQuote')
|
|
.col-lg-4.col-md-4.col-lg-offset-1.col-sm-8.well.col-xs-8.col-xs-offset-2.col-sm-offset-2.well-lg
|
|
h2
|
|
span.glyphicon.glyphicon-unchecked
|
|
.health-progress
|
|
.meter-label(tooltip='Health')
|
|
span.glyphicon.glyphicon-heart
|
|
.meter.health
|
|
.bar
|
|
div(style='width:100%;')
|
|
h2
|
|
span.glyphicon.glyphicon-arrow-down
|
|
.health-progress
|
|
.meter-label(tooltip='Health')
|
|
span.glyphicon.glyphicon-heart
|
|
.meter.health
|
|
.bar
|
|
div(style='width:50%;')
|
|
button.btn.btn-primary.btn-lg.fixedcta.gamifybutton(ng-click='playButtonClick()')= env.t('gamifyButton')
|
|
section#quest.container-fluid
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12
|
|
h2.headline= env.t('questHeading1')
|
|
.row
|
|
.col-lg-5.col-lg-offset-1.col-md-5.col-sm-12
|
|
h2= env.t('questHeading2')
|
|
p.sectioninfo
|
|
= env.t('questByline1')
|
|
br
|
|
= env.t('questByline2')
|
|
.scrolltweet.hidden-xs.hidden-sm
|
|
img.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='skysailor', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/skysailor.png', alt=env.t('altAttrSkysailor'))
|
|
.tweet.popover.right.pull-right
|
|
.arrow
|
|
.popover-content
|
|
= env.t('skysailorQuote')
|
|
.col-lg-4.col-md-6.col-md-offset-1.col-lg-offset-1.col-sm-10.well.col-xs-10.col-xs-offset-1.col-sm-offset-1.well-lg
|
|
img.clearfix.img-responsive.center-block(style='padding-bottom:30px;', src="https://d2afqr2xdmyzvu.cloudfront.net/front/images/Quest_dilatory_dragonSmall.png", alt='')
|
|
.row
|
|
.col-lg-5.col-md-5.col-sm-5.col-sm-offset-0.col-xs-5.col-xs-offset-0
|
|
.health-progress
|
|
.meter-label(tooltip='Health')
|
|
span.glyphicon.glyphicon-heart
|
|
.meter.health
|
|
.bar
|
|
div(style='width:20%;')
|
|
.quest-friend-img
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/party/AnnaCosplay.png', alt='')
|
|
.col-md-1.col-sm-1.col-xs-1
|
|
h2
|
|
span.glyphicon.glyphicon-arrow-right
|
|
.col-lg-5.col-md-offset-1.col-md-5.col-sm-5.col-sm-offset-0.col-xs-5.col-xs-offset-0
|
|
.health-progress
|
|
.meter-label(tooltip='Health')
|
|
span.glyphicon.glyphicon-heart
|
|
.meter.health
|
|
.bar
|
|
div(style='width:0%;')
|
|
.quest-friend-img
|
|
img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/party/GrimReaper.png', alt='')
|
|
button.btn.btn-primary.btn-lg.fixedcta.gamifybutton(ng-click='playButtonClick()')= env.t('gamifyButton')
|
|
section#features.bg-info.container-fluid
|
|
.row
|
|
h2= env.t('featuresHeading')
|
|
.row
|
|
.col-md-4.col-md-offset-2.col-sm-6
|
|
.feature-img
|
|
img.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/Mount.png', alt='')
|
|
.featuretext
|
|
h4= env.t('featurePetHeading')
|
|
p
|
|
= env.t('featurePetByline')
|
|
.col-md-4.col-sm-6
|
|
.feature-img.center-block
|
|
img.img-rendering-auto(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/achievement-triadbingo.png', alt='')
|
|
img.img-rendering-auto(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/achievement-perfect.png', alt='')
|
|
.featuretext
|
|
h4= env.t('featureAchievementHeading')
|
|
p= env.t('featureAchievementByline')
|
|
.row
|
|
.col-md-4.col-md-offset-2.col-sm-6
|
|
.feature-img
|
|
img.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/Promo_springclasses2015.png', alt='')
|
|
.featuretext
|
|
h4= env.t('featureEquipHeading')
|
|
p
|
|
= env.t('featureEquipByline')
|
|
.col-md-4.col-sm-6
|
|
.feature-img
|
|
img.img-rendering-auto.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/Party-Header.png', alt='')
|
|
.featuretext
|
|
h4= env.t('featureSocialHeading')
|
|
p
|
|
= env.t('featureSocialByline')
|
|
button.btn.btn-primary.btn-lg.fixedcta.gamifybutton(ng-click='playButtonClick()')= env.t('gamifyButton')
|
|
#footercall
|
|
.container-fluid
|
|
.row
|
|
h3= env.t('joinOthers', {userCount:userCount})
|
|
.row
|
|
.col-md-4.col-md-offset-4
|
|
button.btn.btn-primary.btn-lg.btn-block(ng-click='playButtonClick()')= env.t('free')
|
|
footer.footer
|
|
.container-fluid.shoutout
|
|
h4= env.t('contribUse')
|
|
.row
|
|
.col-lg-2.col-md-2.col-md-offset-1.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1
|
|
a(href='http://ionicframework.com/')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/ionic-logo-horizontal-transparent.png', alt=env.t('altAttrIonic'))
|
|
.col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1
|
|
a(href='https://www.jetbrains.com/webstorm/')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/logo_webstorm.png', alt=env.t('altAttrWebstorm'))
|
|
.col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1
|
|
a(href='http://github.com/')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/GitHub_Logo.png', alt=env.t('altAttrGithub'))
|
|
.col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1
|
|
a(href='https://trello.com/')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/trello-logo-blue.png', alt=env.t('altAttrTrello'))
|
|
.col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1
|
|
a(href='https://slack.com/')
|
|
img.img-rendering-auto.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/landing_slack_hash_wordmark_logo.png', alt=env.t('altAttrSlack'))
|
|
|
|
.row.footer-content
|
|
include ../shared/footer
|
|
|
|
// Footer scripts
|
|
// Use carousel initialize
|
|
script(type='text/javascript').
|
|
$(document).ready( function() {
|
|
var clickEvent = false;
|
|
$('#myCarousel').on('click', '.nav a', function() {
|
|
clickEvent = true;
|
|
$('#myCarousel .nav li').removeClass('active');
|
|
$(this).parent().addClass('active');
|
|
}).on('slid.bs.carousel', function(e) {
|
|
if(!clickEvent) {
|
|
var count = $('#myCarousel .nav').children().length -1;
|
|
var current = $('#myCarousel .nav li.active');
|
|
current.removeClass('active').next().addClass('active');
|
|
var id = parseInt(current.data('slide-to'));
|
|
if(count == id) {
|
|
$('#myCarousel .nav li').first().addClass('active');
|
|
}
|
|
}
|
|
clickEvent = false;
|
|
});
|
|
});
|
|
// Tooltips
|
|
script(type='text/javascript').
|
|
$(function () {
|
|
$('[data-toggle="tooltip"]').tooltip()
|
|
$('[data-toggle="popover"]').popover()
|
|
})
|
|
// Smart App Banner
|
|
script(type='text/javascript').
|
|
new SmartBanner({
|
|
title: 'Habitica: Gamify Your Tasks',
|
|
author: 'HabitRPG, Inc.',
|
|
button: 'GET',
|
|
store: {
|
|
ios: 'On the App Store',
|
|
android: 'In Google Play'
|
|
}
|
|
});
|
|
// Hack fix for carousel (http://stackoverflow.com/a/22182184/362790)
|
|
script.
|
|
angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition'])
|
|
.controller('CarouselController', ['$scope', '$timeout', '$transition', '$q', function ($scope, $timeout, $transition, $q) {
|
|
}]).directive('carousel', [function () {
|
|
return {}
|
|
}]);
|