water.css/README.md

54 lines
2.3 KiB
Markdown
Raw Normal View History

2019-04-04 16:45:56 -04:00
# Water.css
2019-04-04 17:40:47 -04:00
[![Water.css](logo.svg)](https://kognise.github.io/water.css/)
2019-04-04 16:45:56 -04:00
*A just-add-css collection of styles to make simple websites just a little nicer*
2019-04-04 23:25:27 -04:00
[![On reddit](https://img.shields.io/badge/on-reddit-orange.svg)](https://www.reddit.com/r/webdev/comments/b9m6mv/watercss_a_collection_of_neat_styles_for_simple/) [![MIT license](https://img.shields.io/github/license/kognise/water.css.svg)](https://github.com/kognise/water.css/blob/master/LICENSE.md)
2019-04-04 18:00:37 -04:00
2019-04-04 16:45:56 -04:00
## Why?
I commonly make quick demo pages or websites with simple content. For these, I don't want to spend time styling them but don't like the uglyness of the default styles.
Water.css is a css framework that doesn't require any classes. You just include it in your `<head>` and forget about it, while it silently makes everything nicer.
## Who?
You might want to use Water.css if you're making a simple static or demo website that you don't want to spend time styling.
You probably don't want to use it for a production app or something that has more than a simple document. Rule of thumb: if your site has a navbar, don't use Water.css. It's just not meant for that kind of content.
## How?
Just stick this in your head:
```html
2019-04-04 17:25:31 -04:00
<link rel='stylesheet' href='https://cdn.jsdelivr.net/gh/kognise/water.css@latest/water.min.css'>
2019-04-04 16:45:56 -04:00
```
No other classes or code is required to make Water.css work.
2019-04-04 19:30:11 -04:00
Well, I may have lied a *little* bit when I said Water.css makes use of no classes: if you're a light theme guy (shame on you!) just add the class `.light` to your `<body>` and everything will burn your eyes.
2019-04-04 17:40:14 -04:00
Oh, you want a demo you say? Cheeky fellah!
2019-04-05 01:21:53 -04:00
[Well, here's your demo.](https://kognise.github.io/water.css/) And here's a screenshot of the dark theme to top it off:
2019-04-04 18:53:51 -04:00
![Screenshot](screenshot.jpg)
2019-04-04 18:54:01 -04:00
Don't like how it looks? Feel free to submit an issue or PR with suggestions.
2019-04-04 17:40:14 -04:00
2019-04-04 16:45:56 -04:00
## Contributing
Water.css can be greatly improved if people in the community help make it better!
2019-04-04 16:54:05 -04:00
Have any questions or concerns? Did I forget an element or selector? Does something look ugly? Feel free to submit an issue.
2019-04-04 18:53:51 -04:00
If people are interested I'll make a Jekyll theme with Water.css and possibly an NPM package, I'd love any help with that.
2019-04-05 04:22:45 -04:00
## Todos
- Check image styles
- Improve inputs in light theme
2019-04-05 04:25:21 -04:00
- Support `placeholder`
- Table styles