Skip to content

Instantly share code, notes, and snippets.

@heroheman
Created November 24, 2015 17:00
Show Gist options
  • Save heroheman/aed3832e94ae01db43ae to your computer and use it in GitHub Desktop.
Save heroheman/aed3832e94ae01db43ae to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<div class="teaser">
<div class=teaser__img>
<img src=http://placehold.it/350x100
</div>
<p class=teaser__text>
lorem ipsum
</p>
</div>
<div class="teaser--small no-js">
<div class=teaser__img>
<img src=http://placehold.it/350x100
</div>
<p class=teaser__text>
lorem ipsum
</p>
</div>
// ----
// libsass (v3.2.5)
// ----
.carousel{
max-width: 400px;
display: inline-block;
&--small{
@extend .teaser;
max-width: 200px;
}
&__img{
padding: 1rem;
.no-js &{
padding: 5rem;
}
}
&__text{
color: green;
}
}
.carousel {
max-width: 400px;
display: inline-block;
}
.carousel--small {
max-width: 200px;
}
.carousel__img {
padding: 1rem;
}
.no-js .carousel__img {
padding: 5rem;
}
.carousel__text {
color: green;
}
<div class="teaser">
<div class=teaser__img>
<img src=http://placehold.it/350x100
</div>
<p class=teaser__text>
lorem ipsum
</p>
</div>
<div class="teaser--small no-js">
<div class=teaser__img>
<img src=http://placehold.it/350x100
</div>
<p class=teaser__text>
lorem ipsum
</p>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment