https://github.com/gottwik/slab
Creates horizontal whitespace slabs
https://github.com/gottwik/slab
Last synced: 7 months ago
JSON representation
Creates horizontal whitespace slabs
- Host: GitHub
- URL: https://github.com/gottwik/slab
- Owner: Gottwik
- Created: 2017-06-09T07:49:09.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2017-06-09T07:49:42.000Z (about 9 years ago)
- Last Synced: 2025-02-07T21:35:20.951Z (over 1 year ago)
- Language: CSS
- Size: 1.95 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# slab
slab is a set of simple css stylesheet classes designed to add vertical whitespace to projects.
See compiled version [here](http://www.sassmeister.com/gist/eb20b9ae092b8f4aefe12ee4c54a3584).
## Dependencies
slab uses media queries from bootstrap 4 but these are included for your convenience. Only a sass compiler is needed to make this work.
## Basic slabs
`.slab` - Will create 10px high horizontal stripe of whitespace
`.subslab` - Will create 10px negative space
## Multiple slabs
Multiple slabs go up to 8x
`slab-5x` - will create 50px high horizontal space
`.subslab-5x` - Will create 50px negative space
## Responsive slabs
responsive slabs share bootstrap media breakpoints list, but you can override it before importing slab with this code:
```scss
$grid-breakpoints: (
xs: 0,
sm: 544px,
md: 768px,
lg: 992px,
xl: 1280px
);
```
`slab-sm-down` - will create slab only visible on sm screens and down
`subslab-md-up-4x` - will create slab only visible on sm screens and down
## Half-slab
`half-slab` - will create a 5px high whitespace
## Size
Gzipped 1,46kb