Add README files for each directory

This commit is contained in:
Brad Dielman + Joe Fiorini 2012-08-29 18:15:58 -04:00
parent f1038eb566
commit 04f29139cb
7 changed files with 41 additions and 0 deletions

View file

@ -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 doesnt 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.

View file

@ -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`.

View file

@ -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.

View file

@ -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`.