pure/README.md

175 lines
4.9 KiB
Markdown
Raw Normal View History

2013-05-16 17:01:32 +00:00
Pure
====
2013-05-20 17:23:59 +00:00
2013-05-22 18:17:43 +00:00
[![Pure](http://f.cl.ly/items/2y0M0E2Q3a2H0z1N1Y19/pure-banner.png)][Pure]
2013-05-20 17:23:59 +00:00
A set of small, responsive CSS modules that you can use in every web project.
2013-05-22 12:06:01 +00:00
[http://purecss.io/][Pure]
2013-05-20 17:23:59 +00:00
[![Build Status](https://travis-ci.org/yui/pure.png?branch=master)][Build Status]
2013-05-22 12:06:01 +00:00
**Use From the CDN:**
2013-05-20 17:25:26 +00:00
```html
2013-05-24 18:54:42 +00:00
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.1.0/pure-min.css">
2013-05-20 17:25:26 +00:00
```
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
[Pure]: http://purecss.io/
[Build Status]: https://travis-ci.org/yui/pure
2013-05-22 12:06:01 +00:00
Features
--------
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
Pure is meant to be a starting point for every website or web app. We take care
of all the CSS work that every site needs, without making it look cookie-cutter:
2013-05-20 17:23:59 +00:00
* A responsive grid that can be customized to your needs.
2013-05-22 12:06:01 +00:00
* A solid base built on [Normalize.css][] to fix cross-browser compatibility
issues.
* Consistently styled buttons that work with `<a>` and `<button>` elements.
2013-05-22 12:06:01 +00:00
* Styles for vertical and horizontal menus, including support for dropdown
menus.
* Useful form alignments that look great on all screen sizes.
* Various common table styles.
* An extremely minimalist look that is super-easy to customize.
* Responsive by default, with a non-responsive option.
* Easy one-click customization with the [Skin Builder][].
2013-05-22 12:06:01 +00:00
* Extremely small file size: **4.8KB minified + gzip**.
2013-05-22 12:06:01 +00:00
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
[Normalize.css]: http://necolas.github.io/normalize.css/
[Skin Builder]: http://yui.github.io/skinbuilder/?mode=pure
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
Get Started
-----------
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
To get started using Pure, go to the [Pure CSS website][Pure]. The website has
extensive documentation and examples necessary to get you started using Pure.
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
You can include the Pure CSS file in your project by fetching it from Yahoo's
CDN:
2013-05-20 17:23:59 +00:00
2013-05-20 17:25:26 +00:00
```html
2013-05-24 18:54:42 +00:00
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.1.0/pure-min.css">
2013-05-20 17:25:26 +00:00
```
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
Build From Source
-----------------
Optionally, you can build Pure from its source on Github. To do this, you'll
need to have NodeJS and npm installed. We use [Grunt][] to build Pure.
2013-05-20 17:23:59 +00:00
```shell
$ git clone git@github.com:yui/pure.git
$ cd pure
$ npm install
$ grunt
2013-05-20 17:23:59 +00:00
```
2013-05-22 12:06:01 +00:00
Now, all Pure CSS files should be built into the `pure/build/` directory. All
files that are in this build directory are also available on the CDN. The naming
conventions of the files in the `build/` directory follow these rules:
2013-05-22 12:06:01 +00:00
* `[module]-nr.css`: Rollup of `[module]-core.css` + `[module].css` +
`[module]-[feature].css` from the `src/[module]/` dir. This is the
non-responsive version of a module.
2013-05-22 12:06:01 +00:00
* `[module].css`: Rollup of `[module]-nr.css` + `[module]-r.css` from the
`build/` dir. This is the responsive version of a module.
2013-05-22 12:06:01 +00:00
* `*-min.css`: A minified file version of the files of the same name.
2013-05-20 17:23:59 +00:00
2013-05-22 12:06:01 +00:00
* `pure-min.css`: A rollup of all `[module]-min.css` files in the `build/` dir.
This is a responsive roll-up of everything.
2013-05-22 12:06:01 +00:00
* `pure-nr-min.css`: A Rollup of all modules without @media queries. This is a
non-responsive roll-up of everything.
2013-05-20 17:23:59 +00:00
**Note:** To save your fingers from The Developer Konami Code: ⌘⇥ ⌃C ↑ ⏎ use
the `grunt watch` task:
```shell
$ grunt watch
```
2013-05-20 17:23:59 +00:00
[Grunt]: http://gruntjs.com/
2013-05-22 12:06:01 +00:00
Contributions and Code Standards
--------------------------------
Feel free to file bugs and submit pull requests on Github! When submitting a
pull request, please checkout a new feature branch, and submit your pull request
from it. Please do not submit pull requests from your `master` branch.
2013-05-20 17:23:59 +00:00
### Testing
We use [CSSLint][] for basic testing to make sure we're shipping valid CSS which
compiles with standard best practices and rules. To run Pure's test use
[Grunt][]:
```shell
$ grunt test
```
### Docs and Website
Pure's website is also open source, so please file any issues or pull requests
for the docs or website over at the [`pure-site`][pure-site] repo.
### CLA
Please [sign the CLA][] before submitting pull requests. We can't merge your
pull requests unless you have a signed CLA. It's super easy and can be done
online. For more information regarding the CLA, please visit the
[Contribute][] page.
2013-05-20 17:23:59 +00:00
### Versioning
Pure adheres to [Semantic Versioning 2.0](http://semver.org/).
2013-05-22 12:06:01 +00:00
[CSSLint]: https://github.com/stubbornella/csslint
[pure-site]: https://github.com/yui/pure-site
[sign the CLA]: https://secure.echosign.com/public/hostedForm?formid=A9PFU5T58653A
[Contribute]: http://yuilibrary.com/contribute/cla/
Browser Support and Testing
---------------------------
Pure is tested and works in:
* IE 7+
* Latest Stable Firefox/Chrome/Safari
* iOS 6.x
* Android 4.x
Before submitting pull requests, please ensure that you open the test HTML files
in these environments. If you don't have access to all these environments, list
the ones that you have tested in on the pull request description. That way, we
know what's missing, and can help you out.
2013-05-22 12:06:01 +00:00
License
-------
This software is free to use under the Yahoo! Inc. BSD license.
2013-05-22 12:06:01 +00:00
See the [LICENSE file][] for license text and copyright information.
[LICENSE file]: https://github.com/yui/pure/blob/master/LICENSE.md