Coffeekraken.io 0.0.1

BEM mixins

Some useful mixins to work with BEM methodology

Mixins

s-Bem

BEM block selector

Name Type Description Status Default
$name { String } The block name required
$extend { String , List } The list of item to extends optional false

Example

    @include s-Bem('card') {
     background: white;
}

Author : Olivier Bossel olivier.bossel@gmail.com

s-bEm

BEM element selector

Name Type Description Status Default
$name { String } The block name required
$extend { String , List } The list of item to extends optional false

Example

    @include s-Bem(card) {
    background:white;

    @include s-bEm(title) {
        font-size:20px;
    }
}

Author : Olivier Bossel olivier.bossel@gmail.com

s-beM

BEM modifier selector

Name Type Description Status Default
$name { String } The block name required
$extend { String , List } The list of item to extends optional false
$standelone { Boolean } If true, will automatically extends the base element optional s-setting('BEM.standelone')

Example

    @include s-Bem(card) {
    background:white;

    @include s-beM(blue) {
        background: blue;
    }
}

Author : Olivier Bossel olivier.bossel@gmail.com