//// /// BEM. /// /// BEM is a methodology for structuring websites and is mostly known for it's CSS naming convention. /// BEMIT is in extension of this methodology and allows you to give blocks a more fine-grained purpose /// than BEM alone would let you do. /// /// Sass does support BEM quite well thanks to the ampersand (&) and the @at-root directive. However, /// there is no way to make sure users adhere to the BEM or BEMIT methodology. /// That's where the mixins in this file come into play: They automatically generate the right selectors /// and perform checks regarding the nesting order, nesting depth, and so on. /// /// There are comments in the mixins explaining what selector is generated. The EBNF grammar is as follows: /// /// (* Shorthands for block, element, modifier, suffix *) /// entity_shorthand = "b" "e" "m" "s" "t" ; /// /// (* One or multiple BEMIT entities that were generated with an earlier mixin invocation *) /// existing_entities = "{" entity_shorthand { "," entity_shorthand } "}" ; /// /// (* A BEM entity that doesn't depend on a parent entity *) /// generated_independent_entity = "block" ; /// /// (* A BEM entity that is attached to a parent entity *) /// generated_attached_entity = existing_entities ( "__element" | "--modifier" | "@suffix" ) ; /// /// (* A selector created by the user, such as "&:hover", "> a", and so on *) /// manual_selector_part = "[manual selector]" ; /// /// (* A part of the selector that may or may not be in the generated result *) /// optional_selector_part = "(" ( existing_entities | manual_selector_part ) ")" ; /// /// (* One part of the selector *) /// selector_part = existing_entities | manual_selector_part | optional_selector_part | generated_independent_entity | generated_attached_entity ; /// /// (* How the left and right selector are related, i.e. space means right is a descendant of left, and dot means right specializes left *) /// selector_link = " " | "." ; /// /// (* The whole selector *) /// selector = selector_part { ( selector_link ) selector_part } ; /// /// @link https://en.bem.info/ Information about BEM /// @link https://csswizardry.com/2015/08/bemit-taking-the-bem-naming-convention-a-step-further/ Information about BEMIT /// /// @group BEM /// /// @access public //// @forward 'bem/vars'; @forward 'bem/functions'; @forward 'bem/validators'; @forward 'bem/block'; @forward 'bem/element'; @forward 'bem/modifier'; @forward 'bem/suffix'; @forward 'bem/state'; @forward 'bem/theme'; @forward 'bem/multi'; @forward 'bem/debug'; @use 'bem/vars'; @use './contexts'; @include contexts.create(vars.$context-id);