How to guide

Definition how to structure elements and basic layout usage.

Table of content

- {{ item.label }}

Page structure

Every page is build by blocks like wall. Typical block that contains every page are: Header, Navigation (menu), Aside and Footer

Naming convention

Every element of page is child of it's block and every block contains his elements together. According to B.E.M. naming conventions class attribute of every element have to start with the perant block name double underscore then name of element double dash modifier: BLOCK__ELEMENT--MODIFIER

Example:

If our block is HEADER, element is picture and modifier logo, our class names have to look like this: header__image--logo

    					<header class="header__wrapper">
    						<div class="header__container">
    							<a class="header__link--logo" href="home">
    								<img class="header__image--logo" src="/" alt="Company logo">
    							</a>
    						</div>
    					</header>
    					&#60;A HREF="http://www.idocs.com"&#62;Cool Dude&#60;/A&#62;

Style guide

Lorem ipsum dolor sit amet ...

Styling elements

Lorem ipsum dolor sit amet ...

Code structure

Lorem ipsum dolor sit amet ...