Skip to content

Instantly share code, notes, and snippets.

@MFFunmaker

MFFunmaker/scopeless-sass-placeholder

Created February 9, 2017 21:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save MFFunmaker/b44ac56b2e1c7d3795e58159c573c3cf to your computer and use it in GitHub Desktop.
Save MFFunmaker/b44ac56b2e1c7d3795e58159c573c3cf to your computer and use it in GitHub Desktop.
Download ZIP
Raw
scopeless-sass-placeholder
$breakpoints: (sm:576px, md:768px, lg:992px, xl:1200px);
%button-reset {
$media: sm; // declare which screen size this is for
appearance: none;
border: none;
outline: none;
@each $screen-size, $breakpoint-value in $breakpoints {
@if ( index($media,$screen-size) ) {
@media (min-width: $breakpoint-value) {
font-size: 0.8em;
border: 1px solid #333;
}
}
}
}
.basic-button {
@extend %button-reset;
}
@MFFunmaker
Copy link
Author

An example of how to get around the scope issue created when using Sass placeholders

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment