Add README files for each directory
This commit is contained in:
parent
f1038eb566
commit
04f29139cb
|
@ -0,0 +1,11 @@
|
|||
# SMACSS
|
||||
|
||||
### Base
|
||||
|
||||
> A Base rule is applied to an element using an element selector, a descendent selector, or a child selector, along with any pseudo-classes. It doesn’t include any class or ID selectors. It is defining the default styling for how that element should look in all occurrences on the page.
|
||||
|
||||
> - SMACSS, Jonathan Snook
|
||||
|
||||
Place files here that impact top-level elements to apply global styles.
|
||||
|
||||
This template includes [`normalize.css`](http://necolas.github.com/normalize.css/) to give consistent base styles for all browsers.
|
|
@ -0,0 +1,9 @@
|
|||
# SMACSS
|
||||
|
||||
### Layout
|
||||
|
||||
> CSS, by its very nature, is used to lay elements out on the page. However, there is a distinction between layouts dictating the major and minor components of a page. The minor components—such as a callout, or login form, or a navigation item—sit within the scope of major components such as a header or footer. I refer to the minor components as Modules [...] The major components are referred to as Layout styles.
|
||||
|
||||
> - SMACSS, Jonathan Snook
|
||||
|
||||
Use this directory for files that contain the CSS to layout major elements on the page. We typically use one file per major component and `@import` them in `style.css.scss`.
|
|
@ -0,0 +1,9 @@
|
|||
# SMACSS
|
||||
|
||||
### Modules
|
||||
|
||||
> A Module is a more discrete component of the page. It is your navigation bars and your carousels and your dialogs and your widgets and so on. This is the meat of the page. Modules sit inside Layout components. Modules can sometimes sit within other Modules, too. Each Module should be designed to exist as a standalone component. In doing so, the page will be more flexible. If done right, Modules can easily be moved to different parts of the layout without breaking.
|
||||
|
||||
> - SMACSS, Jonathan Snook
|
||||
|
||||
In this directory we typically use one file per module.
|
|
@ -0,0 +1,12 @@
|
|||
# SMACSS
|
||||
|
||||
### States
|
||||
|
||||
> A state is something that augments and overrides all other styles. For example, an accordion section may be in a collapsed or expanded state. A message may be in a success or error state. [Modules and states] differ in two key ways:
|
||||
|
||||
> 1. State styles can apply to layout and/or module styles; and
|
||||
> 2. State styles indicate a JavaScript dependency.
|
||||
|
||||
> - SMACSS, Jonathan Snook
|
||||
|
||||
State styles typically refer to styles that only exist on an element for a short period time, for example: styles for invalid form fields would go in `validations.scss`.
|
Loading…
Reference in a new issue