README
:ferris_wheel: skeleton-plus
skeleton-plus
is a fresh looking but still simple css framework. (only ~7kb, gzip => 2.1kb)
About
skeleton-plus
is a fresh looking but still simple css framework that should be taken as basis for your next website. We designed it to be flexible but still small, thanks to scss
you need to change some variables and you have your own version of skeleton-plus
:sunglasses:
How to use it
Thanks to the opportunities the open-source development offers us, there are thousand ways to use this libary or change it. Below here I list only a few of them.
Just use it
Add <link rel="stylesheet" href="css/skeleton-plus.min.css">
to your <head>
. If you want to use it in production, use the following links from awesome CDN's (which I really thank):
https://cdn.rawgit.com/oldaniel/skeleton-plus/master/dist/skeleton-plus.min.css
https://unpkg.com/skeleton-plus/dist/skeleton-plus.min.css
Download it
skeleton-plus
can be downloaded over NPM or Github with the following commands:
GitHub: $ git clone https://github.com/oldaniel/skeleton-plus
Npm: $ npm install skeleton-plus
Don't like the new design?
Jump back to version two by using:
Npm: $ npm install skeleton-plus@2.0.1
https://cdn.rawgit.com/oldaniel/skeleton-plus/v2.0.0/css/skeleton.plus.min.css
https://cdn.rawgit.com/oldaniel/skeleton-plus/v2.0.0/css/normalize.min.css
https://unpkg.com/skeleton-plus@2.0.1/css/skeleton-plus.min.css
https://unpkg.com/skeleton-plus@2.0.1/css/normalize.min.css
Change it
Clone and mix up things. If you think your edits are interesting for the public, just open a new pull request on that.
Here a brief overview of our folder structure:
skeleton-plus
├── dist # Our destination folder
│ ├── skeleton-plus.css
│ ├── skeleton-plus.min.css
│ └── index.html
├── src # Our source folder
│ ├── _base.scss
│ ├── _button.scss
│ ├── _extra.scss
│ ├── _grid.scss
│ ├── _input.scss
│ ├── _navigation.scss
│ ├── _table.scss
│ ├── _typography.scss
│ └── style.scss
├── LICENSE
├── README.md
├── gulpfile.js
└── package.json
Some gulp
task you should know about:
scss
compiles the scss to cssscss:min
compress the compiled css fileswatch
executesscss
andscss:min
on any file change
Required tools for development:
- Node.js
- NPM
- Gulp installed globally (
npm install gulp -g
)
Credits & License
A project by Daniel Oltmanns. Other amazing contributors here.