Permalink
Browse files

[fix bug 1121914] Next pager arrow wrong direction on /firefox/deskto…

…p/tips
  • Loading branch information...
alexgibson committed Jan 15, 2015
1 parent ed05921 commit 75eab2efb563e99c81f173568e2ac03d56a88783
Showing with 81 additions and 60 deletions.
  1. +6 −5 bedrock/firefox/templates/firefox/desktop/tips.html
  2. +75 −55 media/css/firefox/desktop/tips.less
@@ -34,9 +34,10 @@
<div class="container">
<div id="heading-logo-wrapper">
<img src="{{ media('/img/firefox/desktop/tips/firefox-logo.png') }}" alt="Firefox" id="page-header-logo">
<h1>{{ _('The best of the latest Firefox') }}</h1>
<h2>{{ _('5 top tips, tricks and time-saving tools') }}</h2>
<div class="heading-group">
<h1>{{ _('The best of the latest Firefox') }}</h1>
<h2>{{ _('5 top tips, tricks and time-saving tools') }}</h2>
</div>
</div>
<div id="share-nav-wrapper" class="share-wrapper">
@@ -67,7 +68,7 @@ <h2>{{ _('5 top tips, tricks and time-saving tools') }}</h2>
<div id="page-content">
<div class="container pager pager-no-history pager-auto-init">
<div id="tips-nav-prev-next">
<button class="link-button" id="tip-prev" aria-controls="tips-wrapper">{{ _('back') }}</button>
<button class="link-button tip-prev" id="tip-prev" aria-controls="tips-wrapper">{{ _('back') }}</button>
<div id="tips-nav-dots">
<span data-tip="bookmarks">{{ _('1') }}</span>
@@ -77,7 +78,7 @@ <h2>{{ _('5 top tips, tricks and time-saving tools') }}</h2>
<span data-tip="addons">{{ _('5') }}</span>
</div>
<button class="link-button" type="button" id="tip-next" aria-controls="tips-wrapper">{{ _('next') }}</button>
<button class="link-button tip-next" type="button" id="tip-next" aria-controls="tips-wrapper">{{ _('next') }}</button>
</div>
<div id="tips-wrapper" class="pager-content">
@@ -363,37 +363,32 @@ html[lang^='en'] #tips-nav-direct li a span:after {
button {
.transition(color .2s ease);
.link-button();
}
button:disabled {
color: #ccc;
cursor: default;
&:hover {
text-decoration: none;
&.tip-prev {
float: left;
.leading-arrow();
}
}
}
#tips-nav-dots {
display: none;
}
&.tip-next {
float: right;
text-align: right;
.trailing-arrow();
}
#tip-prev {
float: left;
&:disabled {
opacity: 0.5;
color: #ccc;
cursor: default;
&:before {
content: '« ';
&:hover {
text-decoration: none;
}
}
}
}
#tip-next {
float: right;
text-align: right;
&:after {
content: ' »';
}
#tips-nav-dots {
display: none;
}
#tips-wrapper {
@@ -450,14 +445,16 @@ html[dir='rtl'] {
#tips-nav-prev-next {
right: auto;
left: 20px;
}
#tip-prev {
float: right;
}
button {
&.tip-prev {
float: right;
}
#tip-next {
float: left;
&.tip-next {
float: left;
}
}
}
}
}
@@ -564,15 +561,15 @@ html[dir='rtl'] {
&.inactive {
opacity: .4;
}
}
}
#tip-prev {
background-position: left top;
}
&.tip-prev {
background-position: left top;
}
#tip-next {
background-position: -60px top;
&.tip-next {
background-position: -60px top;
}
}
}
#tips-wrapper {
@@ -581,12 +578,12 @@ html[dir='rtl'] {
}
html[dir='rtl'] {
&.js {
#tip-prev {
&.js #tips-nav-prev-next button {
&.tip-prev {
background-position: -60px top;
}
#tip-next {
&.tip-next {
background-position: left top;
}
}
@@ -747,6 +744,14 @@ html[dir='rtl'] {
&.inactive {
opacity: .4;
}
&.tip-prev {
background-position: left top;
}
&.tip-next {
background-position: -60px top;
}
}
}
@@ -784,14 +789,6 @@ html[dir='rtl'] {
}
}
#tip-prev {
background-position: left top;
}
#tip-next {
background-position: -60px top;
}
#tips-wrapper {
min-height: 500px;
}
@@ -810,22 +807,37 @@ html[dir='rtl'] {
float: none;
}
.tip-copy {
float: none;
margin: 0;
}
#heading-logo-wrapper {
padding-top: 45px;
.heading-group {
margin-right: 155px;
}
}
&.js {
#tips-nav-prev-next {
left: 10px;
right: auto;
}
#tips-nav-dots span {
float: right;
}
button {
&.tip-prev {
background-position: -60px top;
}
#tip-prev {
background-position: -60px top;
&.tip-next {
background-position: left top;
}
}
}
#tip-next {
background-position: left top;
#tips-nav-dots span {
float: right;
}
}
}
@@ -929,6 +941,14 @@ html[dir='rtl'] {
float: none;
margin: 0 0 0 -150px;
}
#masthead {
overflow: hidden;
}
#heading-logo-wrapper .heading-group {
margin-right: 0;
}
}
}

0 comments on commit 75eab2e

Please sign in to comment.