Pure Bliss

Introduction to Pure - A set of small, responsive, CSS modules
that you can use in every web project.

Transcript

1. purecss.io github.com/yui/pure/ A set of small, responsive, CSS modules that you can use in every web project. purecss.io github.com/yui/pure/
2. purecss.io github.com/yui/pure/ So, CSS frameworks are really useful purecss.io github.com/yui/pure/
3. purecss.io github.com/yui/pure/ purecss.io github.com/yui/pure/ Some of my favorite web UIs are made using CSS frameworks
4. purecss.io github.com/yui/pure/ purecss.io github.com/yui/pure/
5. purecss.io github.com/yui/pure/ purecss.io github.com/yui/pure/ But let’s think about this a bit more...
6. purecss.io github.com/yui/pure/ All sites share some common elements. Base Grids Forms Menus Tables Buttons
7. purecss.io github.com/yui/pure/ How are we writing the CSS? CSS Framework Custom Styles + Potentially *lots* of unused CSS rules Heavy (do we need 8k lines of CSS?) Overwriting existing rules is annoying
8. purecss.io github.com/yui/pure/ The other extreme Custom Styles + Have to handle browser inconsistencies Can’t focus on your application’s design Base
9. purecss.io github.com/yui/pure/ Instead, consider this. Custom Styles + Pure A minimal set of CSS styles for common components
10. purecss.io github.com/yui/pure/ Custom Styles + Pure A minimal set of CSS styles for common components CSS Framework + Modals, Popovers, Tooltip, etc.
11. purecss.io github.com/yui/pure/ Say hello to Pure Foundational CSS modules for every web project Under 4KB minified + gzipped Minimal and flat design, that you can build on Namespaced .pure-* On Yahoo! CDN
12. purecss.io github.com/yui/pure/ We open-sourced everything. Even the website. github.com/yui/pure/ github.com/yui/pure-site/
13. purecss.io github.com/yui/pure/ We made some layouts to help you get started. purecss.io/layouts/
14. purecss.io github.com/yui/pure/ purecss.io @tilomitra @ericf