pure

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

OTHER License

Downloads
134.9K
Stars
23.4K
Committers
74

Bot releases are hidden (Show)

pure - Pure 0.3.0 — A Flexbox-based Grid

Published by tilomitra about 11 years ago

Say hello to Pure 0.3.0, the latest and greatest version of Pure!

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.3.0/pure-min.css">

Improved Grids Support

The focus of this release was to improve support for Grids across OS/browser combinations, and its ability to withstand the use of non-default fonts when set by either the person in their browser settings or by the developer using custom fonts. We've been working with the developers in Pure's community to address issues with Grids — notably:

  • In old IE, grid units sometimes flowed to a new line. (#154)
  • For people who have customized their browser fonts, or developers using custom fonts with Pure Grids, grid units sometimes flowed to a new line (#41)

Grids now uses CSS3 Flexbox when possible to avoid the side-effects of setting a negative letter-spacing — the fallback for older browsers. Grids also now uses a specific font stack on .pure-g and .pure-g-r classes to ensure the greatest OS/browser compatibility when non-default fonts are being used. By default grid units will now have font-family: sans-serif; applied — this is the default font stack Pure's Base module (Normalize.css) applies to the <body>.

This is a breaking change if you are using any non-default fonts in your web project. Fortunately, it's quite easy to make sure your custom font stacks apply to content within Pure Girds. Instead of applying your custom font to only the <body> element, apply it to the grid units as well. More on this below.

Using Grids with Non-Default Fonts

A lot of folks have run into an issue with grids and custom fonts not working well together. We gave this issue a lot of thought, and while it was important to fix it, we didn't want a fix that makes Pure Grids harder to use for people who aren't using custom fonts.

Pure 0.3.0 contains a breaking API change to the way that grids work. If you are using any non-default font in your project (anything apart from sans-serif), you will need to modify your project's CSS and add the following in:

body,
.pure-g [class *= "pure-u"],
.pure-g-r [class *= "pure-u"] {
    /* Set you're content font stack here, for example: */
    font-family: Georgia, Times, "Times New Roman", serif;
}

We recommend you add the .pure-g [class *= "pure-u"] and .pure-g-r [class *= "pure-u"] selectors to wherever you've defined your custom content or body font stack.

The benefit of making this change is that Pure grids should now work everywhere. Apart from our usual supported environments, the community helped us by literally testing this on multiple browsers on Ubuntu, Arch Linux, and Chrome OS. We want to make sure that Grids doesn't break your web project's UI, regardless of what OS/browser people are using.

We have more information regarding using fonts with Pure Grids directly on the Pure website, so head on over and give it a quick read.

Other Changes

  • Pure now requires the Base module (which is Normalize.css) to be on the page. Pure has essentially always required the styles provided by Normalize.css via the Base module, and this now makes it a firm requirement. The pure-min.css and pure-nr-min.css rollup files already include the Base module.
  • Removed forms-core.css. This was a copy of Normalize.css' form related styles. Now that Pure requires the Base module (which is Normalize.css) to be on the page, the Forms Core submodule is no longer needed.
  • We added back :focus styles to [readonly] input elements.
  • Added a height: auto rule to images within a .pure-g-r so that their aspect ratios are maintained when the page is resized.

View 0.3.0 Changelog

As always, if you have questions about this release, ask us on the Pure Blog. Keep submitting bugs and pull requests so we can build and improve Pure together!

pure - Pure 0.3.0 — Release Candidate 3

Published by ericf about 11 years ago

This is a pre-release for Pure 0.3.0.

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.3.0-rc-3/pure-min.css">

View 0.3.0 Changelog | Latest Docs

pure - Pure 0.3.0 — Release Candidate 2

Published by ericf about 11 years ago

This is a pre-release for Pure 0.3.0.

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.3.0-rc-2/pure-min.css">

View 0.3.0 Changelog | Latest Docs

pure - Pure 0.3.0 — Release Candidate 1

Published by ericf about 11 years ago

This is a pre-release for Pure 0.3.0.

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.3.0-rc-1/pure-min.css">

View 0.3.0 Changelog | Latest Docs

pure - Pure 0.2.1 — Bug Fixes

Published by ericf over 11 years ago

Over the last few weeks, we have been working with folks in the community to iron out bugs, and improve code quality. Today, we're thrilled to announce that these fixes have resulted in a new release, Pure 0.2.1!

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.2.1/pure-min.css">

What's New

This release is focused exclusively on fixing bugs. In all, we fixed 16 issues between Pure 0.2.0 and 0.2.1. Some of the notable fixes include:

  • Updating pure-u-1 to be display: inline-block, instead of display: block [#94]
  • Fix the pure-input-rounded class so that it actually rounds input elements [#109]
  • Fixing an issue in grids that caused elements to overlap [#95]

You can find a full changelog in Pure's HISTORY.md.

View 0.2.1 Changelog

Thanks for contributing!

You guys have been awesome at filing bugs, sending pull requests, and offering your opinions on discussions. Please continue to do that, as your use-cases really help us figure out what to focus on next. Notably, we'd like to give a shout-out to @aurelioderosa who has tirelessly commented and fixed numerous issues for this release. Thanks Aurelio!

Coming Down the Pipeline

We have some exciting things coming down the pipeline for Pure 0.3.0 and beyond. We are thinking of revamping our grid system with a simpler mobile-first implementation. We also have a new version of Pure Menu in the works that lets you code responsive menus and makes it trivial to style menus. Stay tuned for these pull requests!


As always, if you have questions, feel free to submit issues or reach out to us on Twitter at @tilomitra and @ericf.

pure - Pure 0.2.0

Published by ericf over 11 years ago

Two short weeks after initially launching Pure, we're excited to release Pure 0.2.0, the next version of Pure! You can start using it today by pasting this <link> element into your <head>, or pulling it from GitHub.

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.2.0/pure-min.css">

What's new?

We fixed our :focus issues, improving the accessibility that Pure gives your web project out of the box. We added :focus rules to our existing :hover rules, and removed outline where applicable. The Pure website has also been updated to be more accessible to keyboard users and screen-readers.

In addition, we applied improvements to most of the components within Pure based on people's feedback and by tackling low-hanging bugs and enhancements. A full list of the changes in this release can be found in Pure's HISTORY.md.

View 0.2.0 Changelog

Improved Developer Workflow

We also put a lot of work into improving the workflow for people working on Pure. The goal was to make it easier for people to contribute to the project (and the make our lives easier) by improving our tooling and integration with Pure's website code base.

Testing and CI

We wanted to add some basic tests to at least sanity check our code, and did this by integrating CSSLint into our Gruntfile. The cool thing is that we hooked up Travis CI so anytime someone issues a pull request it will be linted to make sure there's no typos or crazy code.

Auto Building with Grunt

To save your fingers from The Developer Konami Code: ⌘⇥ ↑ ⏎ use can now use the grunt watch task to build Pure anytime a CSS file changes!

Testing Pure's Site with Pure Served Locally

Pure's website dogfoods Pure making it a natural place to test the latest changes, especially during development. We added a feature to support running the website with Pure served locally. When you combine this with auto building Pure via grunt watch your day becomes bright, filled with sunshine!

Formalized Contributing Guidelines

We created a CONTRIBUTING.md for Pure, which explains how you can contribute to the project. Give it a quick read before sending your pull requests!

Thanks to the Community

We've been overwhelmed by the feedback and the support that we've received since launching Pure. Although Pure is very young, it already has a vibrant community building up around it. Thanks to everyone who has been opening issues and sending pull requests. And a special shout-out to @dannytatom, @rcbdev, @codepb, and @mseri whose contributions were merged into the 0.2.0 release. Keep 'em coming!


If you have questions regarding Pure, get in touch with @ericf and @tilomitra.

pure - Initial Public Release

Published by ericf over 11 years ago

This is the initial public release of Pure.

Package Rankings
Top 0.5% on Npmjs.org
Top 13.59% on Packagist.org
Top 16.91% on Repo1.maven.org
Top 4.13% on Proxy.golang.org
Badges
Extracted from project README's
Pure