Skip to content

Instantly share code, notes, and snippets.

@lucianobarauna
Last active May 8, 2018 17:22
Show Gist options
  • Select an option

  • Save lucianobarauna/0324dd35ba83078552c0ffa7b3890020 to your computer and use it in GitHub Desktop.

Select an option

Save lucianobarauna/0324dd35ba83078552c0ffa7b3890020 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// libsass (v3.5.4)
// ----
%icon-accordion
background-repeat: no-repeat
background-position: center
=iconAccordion($caminho)
background-repeat: no-repeat
background-position: center
background-image: url('./assets/images/#{$caminho}')
.icon
width: 16px
height: 16px
// Com placeholder
.ativo
.accordion-title-icon
@extend %icon-accordion
background-image: url("./assets/images/plus.png")
.inativo
.accordion-title-icon
@extend %icon-accordion
background-image: url("./assets/images/minus.png")
// Com mixing
.ativo
.accordion-title-icon
+iconAccordion("plus.png")
.inativo
.accordion-title-icon
+iconAccordion("minus.svg")
.icon .ativo .accordion-title-icon, .icon .inativo .accordion-title-icon {
background-repeat: no-repeat;
background-position: center;
}
.icon {
width: 16px;
height: 16px;
}
.icon .ativo .accordion-title-icon {
background-image: url("./assets/images/plus.png");
}
.icon .inativo .accordion-title-icon {
background-image: url("./assets/images/minus.png");
}
.icon .ativo .accordion-title-icon {
background-repeat: no-repeat;
background-position: center;
background-image: url("./assets/images/plus.png");
}
.icon .inativo .accordion-title-icon {
background-repeat: no-repeat;
background-position: center;
background-image: url("./assets/images/minus.svg");
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment