Merge branch 'master' into dev
Conflicts: templates/mobile/page.html
This commit is contained in:
Коммит
c4e943d799
|
@ -1,6 +1,10 @@
|
|||
<ol id="challenges-list">
|
||||
{% for level in levels %}
|
||||
{% if profile.level == loop.index %}
|
||||
<li class="open">
|
||||
{% else %}
|
||||
<li>
|
||||
{% endif %}
|
||||
<div class="level {% if level.locked %}locked{% endif %}">
|
||||
{{ level.legend }}
|
||||
<span class="challenges-count {% if level.completed %}complete{% endif %}">
|
||||
|
|
|
@ -11,6 +11,8 @@
|
|||
<script>
|
||||
$(document).ready(function() {
|
||||
initMenu();
|
||||
|
||||
$('li.open').children('ul').show();
|
||||
|
||||
// Displays the level details
|
||||
$('div.level:not(.locked)').click(function() {
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
initMenu();
|
||||
hintMenu();
|
||||
});
|
||||
|
||||
{% set level=5 %}
|
||||
|
|
|
@ -43,4 +43,6 @@
|
|||
{{ _('So do you have what it takes to light up the world? Then get to it!') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<a href="{{ url('users.mobile_register') }}" class="button">{{ _('Start a spark') }}</a>
|
||||
{% endblock %}
|
|
@ -15,6 +15,9 @@
|
|||
you can still get Firefox Home for iPhone and share the Firefox Spark. Yay!
|
||||
{% endtrans %}
|
||||
</p>
|
||||
<hr>
|
||||
<div class="cta"><a href="{{ url('mobile.instructions') }}">{{ _('What is Firefox Spark?') }}</a></div>
|
||||
<hr>
|
||||
<div class="buttons-wrapper">
|
||||
<a href="{{ url('users.mobile_register') }}"><button class="left-button">{{ _('Start a spark') }}</button></a>
|
||||
<a href="{{ url('users.mobile_login') }}"><button class="right-button">{{ _('Sign in') }}</button></a>
|
||||
|
|
|
@ -19,6 +19,9 @@
|
|||
share the Firefox Spark. Yay!
|
||||
{% endtrans %}
|
||||
</p>
|
||||
<hr>
|
||||
<div class="cta"><a href="{{ url('mobile.instructions') }}">{{ _('What is Firefox Spark?') }}</a></div>
|
||||
<hr>
|
||||
<div class="buttons-wrapper">
|
||||
<a href="{{ url('users.mobile_register') }}"><button class="left-button">{{ _('Start a spark') }}</button></a>
|
||||
<a href="{{ url('users.mobile_login') }}"><button class="right-button">{{ _('Sign in') }}</button></a>
|
||||
|
@ -31,7 +34,10 @@
|
|||
start a spark.
|
||||
{% endtrans %}
|
||||
</p>
|
||||
<a href="http://www.mozilla.com/m/" class="button">{{ _('Get Firefox for mobile') }}</a>
|
||||
<hr>
|
||||
<div class="cta"><a href="{{ url('mobile.instructions') }}">{{ _('What is Firefox Spark?') }}</a></div>
|
||||
<hr>
|
||||
<a href="http://www.mozilla.com/m/" class="button getfirefox">{{ _('Get Firefox for mobile') }}</a>
|
||||
{% endif %}
|
||||
|
||||
<hr>
|
||||
|
|
|
@ -10,6 +10,12 @@
|
|||
{% else %}
|
||||
{% set body_class = 'ff logged-in' %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% if iphone or supported_non_ff %}
|
||||
{% set body_class = 'non-ff' %}
|
||||
{% else %}
|
||||
{% set body_class = 'ff' %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% block flame %}{% endblock %}
|
||||
|
@ -42,6 +48,9 @@
|
|||
<a href="{{ url('mobile.home') }}" class="button">{{ _('Go to My Spark') }}</a>
|
||||
{% else %}
|
||||
{% if supported_non_ff %}
|
||||
<hr>
|
||||
<div class="cta"><a href="{{ url('mobile.instructions') }}">{{ _('What is Firefox Spark?') }}</a></div>
|
||||
<hr>
|
||||
{# Compatible phone, non-firefox, logged-out #}
|
||||
<p class="section sans">
|
||||
{{ _("Don't have a spark yet? Get Firefox 4 for Android then start a spark.") }}
|
||||
|
@ -54,6 +63,9 @@
|
|||
<h2 class="cta"><a href="{{ url('mobile.instructions') }}">{{ _('What is Firefox Spark?') }}</a></h2>
|
||||
<hr>
|
||||
{% else %}
|
||||
<hr>
|
||||
<div class="cta"><a href="{{ url('mobile.instructions') }}">{{ _('What is Firefox Spark?') }}</a></div>
|
||||
<hr>
|
||||
{# Incompatible phone (iPhone, other browsers), logged-out #}
|
||||
<p class="section sans">
|
||||
{{ _("Aww, too bad your phone isn't compatible. Want to help light up the world anyway?") }}
|
||||
|
|
|
@ -2,229 +2,321 @@
|
|||
li.badge.badge1-1 {
|
||||
background:url('../img/mobile/badges/1-1.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge1-2 {
|
||||
background:url('../img/mobile/badges/1-2.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge1-3 {
|
||||
background:url('../img/mobile/badges/1-3.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge2-1 {
|
||||
background:url('../img/mobile/badges/2-1.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge2-2 {
|
||||
background:url('../img/mobile/badges/2-2.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge2-3 {
|
||||
background:url('../img/mobile/badges/2-3.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge2-4 {
|
||||
background:url('../img/mobile/badges/2-4.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge2-5 {
|
||||
background:url('../img/mobile/badges/2-5.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge2-6 {
|
||||
background:url('../img/mobile/badges/2-6.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge2-7 {
|
||||
background:url('../img/mobile/badges/2-7.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge3-1 {
|
||||
background:url('../img/mobile/badges/3-1.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge3-2 {
|
||||
background:url('../img/mobile/badges/3-2.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge3-3 {
|
||||
background:url('../img/mobile/badges/3-3.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge3-4 {
|
||||
background:url('../img/mobile/badges/3-4.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge3-5 {
|
||||
background:url('../img/mobile/badges/3-5.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge3-6 {
|
||||
background:url('../img/mobile/badges/3-6.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge4-1 {
|
||||
background:url('../img/mobile/badges/4-1.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge4-2 {
|
||||
background:url('../img/mobile/badges/4-2.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge4-3 {
|
||||
background:url('../img/mobile/badges/4-3.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge4-4 {
|
||||
background:url('../img/mobile/badges/4-4.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge4-5 {
|
||||
background:url('../img/mobile/badges/4-5.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge4-6 {
|
||||
background:url('../img/mobile/badges/4-6.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge5-1 {
|
||||
background:url('../img/mobile/badges/5-1.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge5-2 {
|
||||
background:url('../img/mobile/badges/5-2.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge5-3 {
|
||||
background:url('../img/mobile/badges/5-3.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge5-4 {
|
||||
background:url('../img/mobile/badges/5-4.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badge5-5 {
|
||||
background:url('../img/mobile/badges/5-5.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-1 {
|
||||
background:url('../img/mobile/badges/E-1.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-2 {
|
||||
background:url('../img/mobile/badges/E-2.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-3 {
|
||||
background:url('../img/mobile/badges/E-3.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-4 {
|
||||
background:url('../img/mobile/badges/E-4.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-5 {
|
||||
background:url('../img/mobile/badges/E-5.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-6 {
|
||||
background:url('../img/mobile/badges/E-6.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-7 {
|
||||
background:url('../img/mobile/badges/E-7.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-8 {
|
||||
background:url('../img/mobile/badges/E-8.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-9 {
|
||||
background:url('../img/mobile/badges/E-9.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-10 {
|
||||
background:url('../img/mobile/badges/E-10.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-11 {
|
||||
background:url('../img/mobile/badges/E-11.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-12 {
|
||||
background:url('../img/mobile/badges/E-12.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-13 {
|
||||
background:url('../img/mobile/badges/E-13.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-14 {
|
||||
background:url('../img/mobile/badges/E-14.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-15 {
|
||||
background:url('../img/mobile/badges/E-15.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-16 {
|
||||
background:url('../img/mobile/badges/E-16.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-17 {
|
||||
background:url('../img/mobile/badges/E-17.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-18 {
|
||||
background:url('../img/mobile/badges/E-18.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
||||
|
||||
li.badge.badgeE-19 {
|
||||
background:url('../img/mobile/badges/E-19.png') -0.192em -0.192em;
|
||||
background-size:80px auto;
|
||||
-webkit-background-size:80px auto;
|
||||
-o-background-size:80px auto;
|
||||
}
|
|
@ -27,43 +27,6 @@ body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-s
|
|||
|
||||
}
|
||||
|
||||
/*Sticky footer*/
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
#content {
|
||||
overflow:auto;
|
||||
margin-bottom:10px;
|
||||
padding-bottom:50px;
|
||||
} /* must be same height as the footer */
|
||||
|
||||
#menu-wrapper {
|
||||
position: relative;
|
||||
margin-top: -50px; /* negative value of footer height */
|
||||
height: 50px;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
#menu-wrapper.closed {
|
||||
/* top:-50px;*/
|
||||
}
|
||||
|
||||
/*Opera Fix*/
|
||||
body:before {
|
||||
content:"";
|
||||
height:100%;
|
||||
float:left;
|
||||
width:0;
|
||||
margin-top:-32767px;/
|
||||
}
|
||||
|
||||
|
||||
/*Common rules*/
|
||||
|
||||
html {
|
||||
|
@ -72,6 +35,7 @@ html {
|
|||
|
||||
html.openmenu, html.openmenu body {
|
||||
height:500px;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
|
@ -80,6 +44,11 @@ body {
|
|||
background:url('../img/mobile/bg.png') repeat top right;
|
||||
}
|
||||
|
||||
#content {
|
||||
overflow:auto;
|
||||
padding-bottom:50px;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
max-width:50em;
|
||||
padding:0 16px 0 16px;
|
||||
|
@ -91,13 +60,17 @@ body {
|
|||
|
||||
#flame-bg {
|
||||
position:absolute;
|
||||
top:0;
|
||||
top:50px;
|
||||
right:0;
|
||||
width:258px;
|
||||
height:181.33px;
|
||||
z-index:1;
|
||||
}
|
||||
|
||||
#login #flame-bg, #getstarted #flame-bg, #whatisspark #flame-bg {
|
||||
top:0px;
|
||||
}
|
||||
|
||||
#header {
|
||||
padding-top:12px;
|
||||
border-bottom:3px solid #ffd40d;
|
||||
|
@ -165,6 +138,8 @@ div.back {
|
|||
margin-left:6px;
|
||||
background:url('../img/mobile/back480.png') no-repeat 0 0;
|
||||
background-size:100%;
|
||||
-webkit-background-size:100%;
|
||||
-o-background-size:100%;
|
||||
}
|
||||
|
||||
div.back:active {
|
||||
|
@ -278,9 +253,20 @@ p.license {
|
|||
}
|
||||
|
||||
#menu-wrapper {
|
||||
height: 53px;
|
||||
clear:both;
|
||||
box-shadow:0px 1px 3px rgba(0,0,0,0.4);
|
||||
-webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.4);
|
||||
-o-box-shadow:0px 1px 3px rgba(0,0,0,0.4);
|
||||
position:relative;
|
||||
overflow:visible;
|
||||
pointer-events:none;
|
||||
z-index:4;
|
||||
margin-bottom:30px;
|
||||
}
|
||||
|
||||
#myspark #menu-wrapper {
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
#menu-wrapper.closed {
|
||||
|
@ -294,12 +280,11 @@ p.license {
|
|||
width:100%;
|
||||
z-index:10;
|
||||
position:absolute;
|
||||
bottom:0px;
|
||||
background:url('../img/mobile/badge-label-bg.png') repeat;
|
||||
}
|
||||
|
||||
#menu.closed {
|
||||
bottom:-450px;
|
||||
top:0;
|
||||
}
|
||||
|
||||
#menu-header {
|
||||
|
@ -308,6 +293,8 @@ p.license {
|
|||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px -99px, -moz-linear-gradient(90deg, #ffd825, #e5bf0c);
|
||||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px -99px, -webkit-gradient(linear, center top, center bottom, from(#ffd825), to(#e5bf0c));
|
||||
background-size:28px auto, auto;
|
||||
-webkit-background-size:28px auto, auto;
|
||||
-o-background-size:28px auto, auto;
|
||||
color:#000;
|
||||
font-weight:bold;
|
||||
line-height:49px;
|
||||
|
@ -321,6 +308,8 @@ p.license {
|
|||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px -155px, -moz-linear-gradient(90deg, #ffec92, #f2df86);
|
||||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px -155px, -webkit-gradient(linear, center top, center bottom, from(#ffec92), to(#f2df86));
|
||||
background-size:28px auto, auto;
|
||||
-webkit-background-size:28px auto, auto;
|
||||
-o-background-size:28px auto, auto;
|
||||
border-top:1px solid #fff4be;
|
||||
}
|
||||
|
||||
|
@ -328,20 +317,24 @@ p.license {
|
|||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px 9px, -moz-linear-gradient(90deg, #ffd825, #e5bf0c);
|
||||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px 9px, -webkit-gradient(linear, center top, center bottom, from(#ffd825), to(#e5bf0c));
|
||||
background-size:28px auto, auto;
|
||||
-webkit-background-size:28px auto, auto;
|
||||
-o-background-size:28px auto, auto;
|
||||
}
|
||||
|
||||
#menu.closed #menu-header:active {
|
||||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px -50px, -moz-linear-gradient(90deg, #ffec92, #f2df86);
|
||||
background:url('../img/mobile/menu-button-hd.png') no-repeat 14px -50px, -webkit-gradient(linear, center top, center bottom, from(#ffec92), to(#f2df86));
|
||||
background-size:28px auto, auto;
|
||||
-webkit-background-size:28px auto, auto;
|
||||
-o-background-size:28px auto, auto;
|
||||
border-top:1px solid #fff4be;
|
||||
}
|
||||
|
||||
#menu-hr {
|
||||
height:3px;
|
||||
background:#dfdfdf;
|
||||
box-shadow:inset 0 -1px 1px #888888;
|
||||
-webkit-box-shadow:inset 0 -1px 1px #888888;
|
||||
box-shadow:inset 0 1px 1px #888888;
|
||||
-webkit-box-shadow:inset 0 1px 1px #888888;
|
||||
}
|
||||
|
||||
#menu ul {
|
||||
|
@ -349,10 +342,13 @@ p.license {
|
|||
}
|
||||
|
||||
#menu ul li {
|
||||
border-top:1px solid #4d4d4d;
|
||||
border-bottom:1px solid #4d4d4d;
|
||||
}
|
||||
|
||||
#menu ul li:first-child {
|
||||
border-top:1px solid #4d4d4d;
|
||||
}
|
||||
|
||||
#menu ul li a {
|
||||
display:block;
|
||||
padding:0 8px;
|
||||
|
@ -362,6 +358,8 @@ p.license {
|
|||
font-weight:bold;
|
||||
background:url('../img/mobile/big-arrow.png') no-repeat right center;
|
||||
background-size:auto 30px;
|
||||
-webkit-background-size:auto 30px;
|
||||
-o-background-size:auto 30px;
|
||||
}
|
||||
|
||||
#menu ul li a:active {
|
||||
|
@ -394,6 +392,8 @@ p.license {
|
|||
position:relative;
|
||||
background:url('../img/mobile/notifications-bg.png') no-repeat 39px center;
|
||||
background-size:auto 16px;
|
||||
-webkit-background-size:auto 16px;
|
||||
-o-background-size:auto 16px;
|
||||
}
|
||||
|
||||
#notifications:before {
|
||||
|
@ -479,6 +479,8 @@ form.section {
|
|||
clear: left;
|
||||
float: left;
|
||||
background-size:24px auto;
|
||||
-webkit-background-size:24px auto;
|
||||
-o-background-size:24px auto;
|
||||
position:relative;
|
||||
top:0px;
|
||||
}
|
||||
|
@ -508,6 +510,8 @@ button:active, button:focus {
|
|||
padding:0 0 0 8px;
|
||||
background:url('../img/mobile/big-arrow.png') no-repeat center right;
|
||||
background-size:auto 30px;
|
||||
-webkit-background-size:auto 30px;
|
||||
-o-background-size:auto 30px;
|
||||
}
|
||||
|
||||
.cta a:active {
|
||||
|
@ -546,6 +550,8 @@ button:active, button:focus {
|
|||
background:url('../img/mobile/checkmark.png') no-repeat 15px center rgba(119,225,24,0.5);
|
||||
margin-bottom:20px;
|
||||
background-size:22px auto;
|
||||
-webkit-background-size:22px auto;
|
||||
-o-background-size:22px auto;
|
||||
}
|
||||
|
||||
#your-location {
|
||||
|
@ -676,10 +682,8 @@ li.badge:active, li.badge.current {
|
|||
width:21px;
|
||||
background:url('../img/mobile/down-arrow.png') no-repeat center center;
|
||||
background-size:20px auto;
|
||||
}
|
||||
|
||||
#about #content {
|
||||
margin-bottom:30px;
|
||||
-webkit-background-size:20px auto;
|
||||
-o-background-size:20px auto;
|
||||
}
|
||||
|
||||
/* Log in */
|
||||
|
@ -721,6 +725,8 @@ li.badge:active, li.badge.current {
|
|||
body#home {
|
||||
background:url('../img/mobile/spark.jpg') no-repeat center 0;
|
||||
background-size:320px auto;
|
||||
-webkit-background-size:320px auto;
|
||||
-o-background-size:320px auto;
|
||||
min-height:400px;
|
||||
}
|
||||
|
||||
|
@ -769,16 +775,22 @@ body#home {
|
|||
#sharing .cta:nth-child(1) {
|
||||
background:url('../img/mobile/share-icons.png') no-repeat 0 24px;
|
||||
background-size:48px auto;
|
||||
-webkit-background-size:48px auto;
|
||||
-o-background-size:48px auto;
|
||||
}
|
||||
|
||||
#sharing .cta:nth-child(2) {
|
||||
background:url('../img/mobile/share-icons.png') no-repeat 0 -83px;
|
||||
background-size:48px auto;
|
||||
-webkit-background-size:48px auto;
|
||||
-o-background-size:48px auto;
|
||||
}
|
||||
|
||||
#sharing .cta:nth-child(3) {
|
||||
background:url('../img/mobile/share-icons.png') no-repeat 0 -183px;
|
||||
background-size:48px auto;
|
||||
-webkit-background-size:48px auto;
|
||||
-o-background-size:48px auto;
|
||||
}
|
||||
|
||||
/*Challenges*/
|
||||
|
@ -835,6 +847,8 @@ div.lock {
|
|||
float:right;
|
||||
background:url('../img/mobile/lock.png') no-repeat 0 0;
|
||||
background-size:100%;
|
||||
-webkit-background-size:100%;
|
||||
-o-background-size:100%;
|
||||
margin-top:13px;
|
||||
}
|
||||
|
||||
|
@ -887,11 +901,15 @@ div.challenge .check {
|
|||
background:url('../img/mobile/checkbox.png') no-repeat 0px 0px;
|
||||
margin:12px 10px 0 0;
|
||||
background-size:24px auto;
|
||||
-webkit-background-size:24px auto;
|
||||
-o-background-size:24px auto;
|
||||
}
|
||||
|
||||
div.challenge.complete .check {
|
||||
background:url('../img/mobile/checkbox.png') no-repeat 0px -27px;
|
||||
background-size:26px auto;
|
||||
-webkit-background-size:26px auto;
|
||||
-o-background-size:26px auto;
|
||||
}
|
||||
|
||||
/*User-share*/
|
||||
|
@ -899,6 +917,8 @@ div.challenge.complete .check {
|
|||
#user-share {
|
||||
background:url('../img/mobile/spark.png') no-repeat center 45px;
|
||||
background-size:320px auto;
|
||||
-webkit-background-size:320px auto;
|
||||
-o-background-size:320px auto;
|
||||
}
|
||||
|
||||
#user-share #header h2 {
|
||||
|
@ -926,6 +946,8 @@ div.challenge.complete .check {
|
|||
body#user-share {
|
||||
background:url('../img/mobile/spark.jpg') no-repeat center 40px;
|
||||
background-size:320px auto;
|
||||
-webkit-background-size:320px auto;
|
||||
-o-background-size:320px auto;
|
||||
min-height:400px;
|
||||
}
|
||||
|
||||
|
@ -993,6 +1015,10 @@ body#user-share {
|
|||
border-bottom:1px solid #404040;
|
||||
}
|
||||
|
||||
.getfirefox {
|
||||
margin-top:20px;
|
||||
}
|
||||
|
||||
/*Choose your city*/
|
||||
|
||||
#city-list li {
|
||||
|
|
Двоичные данные
media/img/mobile/menu-button-hd.png
Двоичные данные
media/img/mobile/menu-button-hd.png
Двоичный файл не отображается.
До Ширина: | Высота: | Размер: 11 KiB После Ширина: | Высота: | Размер: 11 KiB |
|
@ -10,10 +10,62 @@
|
|||
{% endif %}
|
||||
|
||||
{% block content %}
|
||||
{% if user.is_authenticated() and not hide_menu %}
|
||||
<div id="menu-wrapper" class="closed">
|
||||
<div id="menu" class="closed">
|
||||
<div id="menu-header" class="closed">
|
||||
{% if num_notifications %}
|
||||
<div id="notifications">{{ num_notifications }}</div>
|
||||
{% endif %}
|
||||
{# L10n: Name of the mobile navigation menu #}
|
||||
{{ _('Menu') }}
|
||||
</div>
|
||||
<div id="menu-hr"></div>
|
||||
<div id="menu-content">
|
||||
<ul>
|
||||
{% if not profile.boost1_completed or not profile.boost2_completed %}
|
||||
<li><a href="{{ url('mobile.boost') }}">{{ _('Boost your Spark') }}</a></li>
|
||||
{% else %}
|
||||
<li><a href="{{ url('mobile.home') }}">{{ _('My Firefox Spark') }}</a></li>
|
||||
{% endif %}
|
||||
<li><a href="{{ url('mobile.stats') }}">{{ _('Stats') }}</a></li>
|
||||
<li><a href="{{ url('mobile.challenges') }}">{{ _('Challenges') }}
|
||||
{% if num_new_challenges %}
|
||||
{# L10n: {n} is the number of recently completed challenges. #}
|
||||
<span>{{ ungettext('+{n} new','+{n} new', num_new_challenges, "new_challenges")|f(n=num_new_challenges) }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
<li><a href="{{ url('mobile.badges') }}">{{ _('Badges') }}
|
||||
{% if num_new_badges %}
|
||||
{# L10n: {n} is the number of recently obtained badges. #}
|
||||
<span>{{ ungettext('+{n} new','+{n} new', num_new_badges, "new_badges")|f(n=num_new_badges) }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
<li><a href="{{ url('mobile.about') }}">{{ _('About Mozilla') }}</a></li>
|
||||
|
||||
</ul>
|
||||
<a href="{{ url('users.mobile_logout') }}" id="logout">{{ _('Do you wanna sign out?') }}</a>
|
||||
</div>
|
||||
<div id="logout-confirmation">
|
||||
<p class="section sans confirmation">
|
||||
{{ _('Are you sure you want to sign out?') }}
|
||||
</p>
|
||||
<div class="buttons-wrapper">
|
||||
<div class="button left-button"><a>{{ _('Cancel') }}</a></div>
|
||||
<div class="button right-button"><a href="{{ url('users.mobile_logout') }}">{{ _('Yes') }}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- end menu wrapper -->
|
||||
<img src="{{ MEDIA_URL }}img/mobile/badge-label-bg.png" alt="" class="preload">
|
||||
{% endif %}
|
||||
|
||||
|
||||
<div id="wrapper">
|
||||
<div id="header">
|
||||
{% if body_id not in ['home', 'myspark', 'user-share'] %}
|
||||
{% if body_id not in ['home', 'myspark', 'user-share'] and hide_menu %}
|
||||
<div class="back" onclick="history.back()">
|
||||
</div>
|
||||
{% endif %}
|
||||
|
@ -28,59 +80,6 @@
|
|||
</div> <!-- end content -->
|
||||
|
||||
</div> <!-- end wrapper -->
|
||||
|
||||
{% if user.is_authenticated() and not hide_menu %}
|
||||
<div id="menu-wrapper" class="closed">
|
||||
<div id="menu" class="closed">
|
||||
<div id="menu-hr"></div>
|
||||
<div id="menu-header" class="closed">
|
||||
{% if num_notifications %}
|
||||
<div id="notifications">{{ num_notifications }}</div>
|
||||
{% endif %}
|
||||
{# L10n: Name of the mobile navigation menu #}
|
||||
{{ _('Menu') }}
|
||||
</div>
|
||||
<div id="menu-content">
|
||||
<ul>
|
||||
{% if not profile.boost1_completed or not profile.boost2_completed %}
|
||||
<li><a href="{{ url('mobile.boost') }}">{{ _('Boost your Spark') }}</a></li>
|
||||
{% else %}
|
||||
<li><a href="{{ url('mobile.home') }}">{{ _('My Firefox Spark') }}</a></li>
|
||||
{% endif %}
|
||||
<li><a href="{{ url('mobile.stats') }}">{{ _('Stats') }}</a></li>
|
||||
<li><a href="{{ url('mobile.challenges') }}">{{ _('Challenges') }}
|
||||
{% if num_new_challenges %}
|
||||
{# L10n: {n} is the number of recently completed challenges. #}
|
||||
<span>{{ ungettext('+{n} new','+{n} new', num_new_challenges, "new_challenges")|f(n=num_new_challenges) }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
<li><a href="{{ url('mobile.badges') }}">{{ _('Badges') }}
|
||||
{% if num_new_badges %}
|
||||
{# L10n: {n} is the number of recently obtained badges. #}
|
||||
<span>{{ ungettext('+{n} new','+{n} new', num_new_badges, "new_badges")|f(n=num_new_badges) }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
<li><a href="{{ url('mobile.about') }}">{{ _('About Mozilla') }}</a></li>
|
||||
|
||||
</ul>
|
||||
<a href="{{ url('users.mobile_logout') }}" id="logout">{{ _('Do you wanna sign out?') }}</a>
|
||||
</div>
|
||||
<div id="logout-confirmation">
|
||||
<p class="section sans confirmation">
|
||||
{{ _('Are you sure you want to sign out?') }}
|
||||
</p>
|
||||
<div class="buttons-wrapper">
|
||||
<div class="button left-button"><a>{{ _('Cancel') }}</a></div>
|
||||
<div class="button right-button"><a href="{{ url('users.mobile_logout') }}">{{ _('Yes') }}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- end menu wrapper -->
|
||||
<img src="{{ MEDIA_URL }}img/mobile/badge-label-bg.png" alt="" class="preload">
|
||||
{% endif %}
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
|
|
Загрузка…
Ссылка в новой задаче