You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

55 lines
4.2 KiB
Markdown

# An overview of barebones drop-in minimal CSS boilerplate frameworks
8 years ago
This is a quick CSS switcher to allow for previewing some of the many minimal CSS-only frameworks out there. See the demo [here](https://dohliam.github.io/dropin-minimal-css) or [drop the switcher](#Usage) into your own page to see how [different frameworks](#list-of-frameworks) would look with your content.
## Usage
The switcher is fully modular, so you can easily drop it into your own pages to quickly preview the effect of using different CSS frameworks. You can even add your own frameworks to the list and use the dropdown menu to switch between them.
To use the CSS switcher, just clone or download the project and then copy your html file into the main project folder (you can replace `index.html` if you want, since it's just the demo).
If you don't already have a stylesheet defined, you'll need to add the following default stylesheet to the header of your page:
<link rel="stylesheet" type="text/css" href="vendor/bullframe.min.css"/>
Include the js for the switcher in the header of the page:
<script src="switcher.js" type="text/javascript"></script>
Then, add the following code wherever you want the dropdown to appear:
<div id="switcher">&nbsp;</div>
<script type="text/javascript">inline_switcher();</script>
That's it! You should now be able to cycle through the different frameworks by choosing them from the dropdown.
## List of frameworks
* [bullframe](https://github.com/marcopontili/bullframe.css) by @marcopontili ([MIT](http://opensource.org/licenses/MIT))
* [caiuss](https://github.com/IonicaBizau/CaiuSS) by @IonicaBizau ([MIT](http://showalicense.com/?fullname=Ionic%C4%83%20Biz%C4%83u%20%3Cbizauionica%40gmail.com%3E%20(http%3A%2F%2Fionicabizau.net)&year=2015#license-mit))
* [kathamo](https://github.com/kathamo/Kathamo) by debashisbarman ([MIT](https://github.com/kathamo/Kathamo/blob/master/LICENSE))
* [kube](https://github.com/imperavi/kube) by @imperavi ([MIT](https://github.com/imperavi/kube/blob/master/LICENSE))
* [lotus](https://github.com/goatslacker/lotus.css) by goatslacker (MIT)
* [milligram](https://github.com/milligram/milligram) by @cjpatoilo ([MIT](http://cjpatoilo.mit-license.org/))
* [min](https://github.com/owenversteeg/min) by @owenversteeg (MIT)
* [monalisa](https://github.com/jusbrasil/monalisa) by jusbrasil (MIT)
* [motherplate](https://github.com/leemunroe/motherplate) by @leemunroe ([MIT](https://github.com/leemunroe/motherplate/blob/master/LICENSE))
* [normalize](https://github.com/necolas/normalize.css) by @necolas ([MIT](https://github.com/necolas/normalize.css/blob/master/LICENSE.md))
* [oh-my-css](https://github.com/egoist/oh-my-css) by @egoist ([MIT](https://github.com/egoist/oh-my-css/blob/gh-pages/LICENSE))
* [pure](https://github.com/yahoo/pure/) by yahoo ([BSD](https://github.com/yahoo/pure/blob/master/LICENSE.md))
* [siimple](https://github.com/siimple/siimple) by @jmjuanes ([MIT](https://github.com/siimple/siimple/blob/master/LICENSE.md))
* [simplecss](https://github.com/neculaesei/simplecss) by @neculaesei ([MIT](http://opensource.org/licenses/mit-license.php))
* [tacit](https://github.com/yegor256/tacit) by @yegor256 ([MIT](https://github.com/yegor256/tacit/blob/master/LICENSE))
* [sanitize](https://github.com/10up/sanitize.css) by @10up ([PD](https://github.com/10up/sanitize.css/blob/master/LICENSE.md))
* [sanitize](https://github.com/ZDroid/sanitize.css) by @ZDroid ([MIT](https://github.com/ZDroid/sanitize.css/blob/master/LICENSE.md))
* [skeleton](https://github.com/dhg/Skeleton) by @dhg ([MIT](https://github.com/dhg/Skeleton/blob/master/LICENSE.md))
* [skeleton-framework](https://github.com/skeleton-framework/skeleton-framework) by skeleton-framework ([MIT](https://github.com/skeleton-framework/skeleton-framework/blob/master/LICENSE))
* [skeleton-plus](https://github.com/oltmannsdaniel/skeleton-plus) by @oltmannsdaniel ([MIT](https://github.com/oltmannsdaniel/skeleton-plus/blob/master/LICENSE))
* [thao](https://github.com/ThaoFramework/Thao/) by Giuseppe Sanfrancesco ([Apache](http://www.apache.org/licenses/LICENSE-2.0))
Sample HTML5 markup based on [html5-kitchen-sink](https://github.com/dbox/html5-kitchen-sink) by @dbox (MIT)
## LICENSE
MIT.