search

Diwanee-FE / Diwanee-Boilerplate

3 stars 0 forks source link

File naming (blocks / elements / components / pages / etc.) #15

Open IvanBuljovcic opened 8 years ago

IvanBuljovcic commented 8 years ago

Since there was questions about this:

blocks = header / footer / sidebar / slider

element = small article (flag) / navigation / teaser

components = buttons / pagination / section headings

pages = article / cgu / mentions / tags

config = baseConfig / helpers / variables / reset / typography

Again, just my suggestion.

LollaManolla commented 8 years ago

For me : BLOCKS anything that can be moved around on page + from one page to another but it looks different every time is block. And these blocks are basically just an DIV named by its function, purpose, like : block-most-read; .block-articles, .block-latest-feed ....

ELEMENTS would use, most probably, only for HTML elements - if it needs global settings for some reason

OBJECTS Holds global style that can have modification: horizontal, vertical ... Since it can be re-used and used multiple times, it has bigger impact on layout. Usually combine with .blocks give the final look and feel.

.list {
margin:0;
padding:0;
}

.list .list-horizontal {
display: inline-block;
}

COMPONENTS Anything that looks the same on any page and anywhere in the page + JS is component. Concrete code, implementation-specific piece of UI. Basically, anything that requires some action from user or/plus do not change the look, could be component. E.G: Slider, Pager, Pagination , Breadcrumbs, Navigation, Sticky Social...

WIDGETS Small application. Like weather, horoscope etc.

LAYOUTS Wrapping and constraining objects and components. Common for most projects. Like: header, footer, container, wrapper, inner.wrapper, outside.wrapper, sidebar.