Created
June 16, 2014 14:27
-
-
Save JulienCabanes/44cb7ce9b0cee474f1fe to your computer and use it in GitHub Desktop.
Utilisation de mixins pour conditionner de manière plus parlante
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// les mixins commençant par with-*** concernent les conditions via sélecteur (parent) | |
@mixin with-two-sidebars { | |
.l-main-wrapper--with-two-sidebars { | |
@content; | |
} | |
} | |
// les mixins commençant par when-*** concernent les conditions via media-query | |
@mixin when-sidebar-left-is-visible { | |
@include for-min-width(40em) { | |
@content; | |
} | |
} | |
@mixin when-sidebar-right-is-aside { | |
@include for-min-width(64em) { | |
@content; | |
} | |
} | |
// Utilisation | |
@include with-two-sidebars { | |
// Code... | |
@include when-sidebar-left-is-visible { | |
// Code... | |
} | |
@include when-sidebar-right-is-aside { | |
// Code | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment