https://github.com/pimbrouwers/purecss-utils
Extesnion Library for YUI Pure CSS (www.purecss.io)
https://github.com/pimbrouwers/purecss-utils
css purecss yui
Last synced: 15 days ago
JSON representation
Extesnion Library for YUI Pure CSS (www.purecss.io)
- Host: GitHub
- URL: https://github.com/pimbrouwers/purecss-utils
- Owner: pimbrouwers
- License: bsd-2-clause
- Created: 2015-09-14T18:50:55.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2018-08-27T19:02:30.000Z (over 6 years ago)
- Last Synced: 2025-03-29T02:41:38.288Z (about 1 month ago)
- Topics: css, purecss, yui
- Language: CSS
- Homepage:
- Size: 47.9 KB
- Stars: 27
- Watchers: 5
- Forks: 3
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# YUI Pure CSS Extensions
[](https://www.npmjs.com/package/purecss-utils)
Extension Library for YUI Pure CSS (www.purecss.io) designed to work purposefully with the default grid.
## Getting Started
### CDN
```html
```
### NPM
```javascript
npm install purecss-utils
```
## Responsive Utilities
Allows for hiding/showing content based on media breakpoints
```css
@media screen and (max-width:35.5em) {
.pure-hidden-xs {
display: none !important
}
}
@media screen and (min-width:35.5em) and (max-width:47.999em) {
.pure-hidden-sm {
display: none !important
}
}
@media screen and (min-width:48em) and (max-width:63.999em) {
.pure-hidden-md {
display: none !important
}
}
@media screen and (min-width:64em) and (max-width:79.999em) {
.pure-hidden-lg {
display: none !important
}
}
@media screen and (min-width:80em) {
.pure-hidden-xl {
display: none !important
}
}
```
## Push & Pull
Boostrap-esque pushing and pulling, to offset columns.
```css
.pure-push-{breakpoint}-{1-24}-{1-24} { }
```
```html
```
## Flexbox Grid
Flexbox powered grid.
```html
```