scss-library/components/00_Global/_bemGenerator.styl

58 lines
1.3 KiB
Stylus
Raw Normal View History

2021-01-06 19:01:29 +01:00
/*
* This is set of mixins to help generating
* CSS classes according to the Block__Element--Modifier pattern.
* It also helps nesting those classes in any fashion imaganible
* and still produces clean BEM CSS
*/
_css-prefix = 'RV'
2021-01-09 16:28:36 +01:00
// Cache for Blocks
_last_block_name = null
2021-01-08 17:55:56 +01:00
2021-01-09 16:28:36 +01:00
_element_building_lane = {}
_element_block_stack = ()
2021-01-08 17:55:56 +01:00
2021-01-09 16:28:36 +01:00
_block_modifier_building_lane = {}
_block_modifier_block_stack = ()
2021-01-07 00:15:19 +01:00
2021-01-06 19:01:29 +01:00
/*
* Generates a CSS class for an
* Block according to BEM
*/
RV-Block(name)
2021-01-09 16:28:36 +01:00
tow(name, block)
2021-01-06 19:01:29 +01:00
/*
* Generates a CSS class for an block modifier
* according to BEM.
*/
RV-Block__Modifier(name)
2021-01-09 21:14:21 +01:00
attach('RV-Block', unquote('--' + name), block)
2021-01-09 16:28:36 +01:00
2021-01-07 00:15:19 +01:00
2021-01-06 19:01:29 +01:00
/*
* Generates an CSS class for an element
* according to BEM. Also minds the element modifiers
* For more see RV-Element___Modifier
*/
RV-Element(name)
2021-01-09 16:28:36 +01:00
attach('RV-Block', unquote('__' + name), block)
2021-01-09 21:14:21 +01:00
tow(name, block)
2021-01-09 16:28:36 +01:00
/* p(_block_building_lane)
2021-01-06 19:01:29 +01:00
* Generates a CSS class for an element modifier
* according to BEM. These are ment to be part of the
* content block of an element and since child-mixins
* are called first there is no way of knowing what the
* current element is named. To solve this, we store
* a callback for the modifier and add the element name
* from RV-Element
*/
RV-Element__Modifier(name)
2021-01-09 21:14:21 +01:00
attach('RV-Element', '--' + name, block)