Changing sequence nav buttons from images to icon fonts

This commit is contained in:
Chris Rodriguez
2015-04-21 12:24:38 -04:00
parent b81c6d9169
commit 74ce5cbb87
2 changed files with 6 additions and 31 deletions

View File

@@ -239,47 +239,22 @@ $sequence--border-color: #C8C8C8;
.sequence-nav-button {
@extend %ui-depth3;
@include transition(all .2s $ease-in-out-quad 0s);
position: absolute;
display: block;
top: 0;
width: ($baseline*2);
height: 46px;
background-position: center;
background-repeat: no-repeat;
text-indent: -9999px;
overflow: hidden;
@include transition(all .2s $ease-in-out-quad 0s);
padding: 0;
&.button-previous {
@include border-radius(35px, 0, 0, 35px);
@include left(0);
background-position: center 15px;
// CASE: left to right layout
@include ltr {
background-image: url('../images/sequence-nav/previous-icon.png');
}
// CASE: right to left layout
@include rtl {
background-image: url('../images/sequence-nav/next-icon.png');
}
}
&.button-next {
@include border-radius(0, 35px, 35px, 0);
@include right(0);
background-position: center 15px;
// CASE: left to right layout
@include ltr {
background-image: url('../images/sequence-nav/next-icon.png');
}
// CASE: right to left layout
@include rtl {
background-image: url('../images/sequence-nav/previous-icon.png');
}
}
&:hover,