Sass , compass , @include and @extend
I have problem with Sass and this is connected with creating sprites and
then reusing compiled class later. This my styles.scss:
@import 'buttons/*.png';
@include all-buttons-sprites;
@import 'partial/buttons';
And this is buttons.scss:
.buttons {
@extend .buttons-blue-button;
background-repeat: no-repeat;
background-size: cover;
color: #ffffff;
cursor: pointer;
border: none;
font-size: 18px;
width: 242px;
height: 45px;
font: sky-text-med;
padding-bottom: 5px;
margin: 24px 4px 14px;
opacity: 0;
}
Compass not saying any errors but compile css is showing:
.buttons-sprite, .buttons-blue-button, .buttons,
.buttons-blue-hover-button, .buttons-yellow-button, .buttons .yellow,
.buttons-yellow-hover-button {
background: url('/welcome/assets/img/buttons-s5afcdf1a60.png') no-repeat; }
.buttons-blue-button, .buttons {
background-position: 0 0; }
.buttons {
background-repeat: no-repeat;
background-size: cover;
color: #ffffff;
cursor: pointer;
border: none;
font-size: 18px;
width: 242px;
height: 45px;
font: sky-text-med;
padding-bottom: 5px;
margin: 24px 4px 14px;
opacity: 0; }
But there is missing background with should be set by @extend
.buttons-blue-button;
Why this isn't happening ?
No comments:
Post a Comment