fix: update docs

LICENSE.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2019 Smakosh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -2,15 +2,92 @@
 
 [![Travis][build-badge]][build]
 [![npm package][npm-badge]][npm]
-[![Coveralls][coveralls-badge]][coveralls]
 
-Describe react-flex-ready here.
-
-[build-badge]: https://img.shields.io/travis/user/repo/master.png?style=flat-square
-[build]: https://travis-ci.org/user/repo
+[build-badge]: https://img.shields.io/travis/smakosh/react-flex-ready/master.png?style=flat-square
+[build]: https://travis-ci.org/smakosh/react-flex-ready
 
 [npm-badge]: https://img.shields.io/npm/v/npm-package.png?style=flat-square
-[npm]: https://www.npmjs.org/package/npm-package
+[npm]: https://www.npmjs.org/package/react-flex-ready
+
+## Getting started
+
+```bash
+npm i react-flex-ready
+```
+
+Or
+
+```bash
+yarn add react-flex-ready
+```
+
+```jsx
+import React from "react";
+import { render } from "react-dom";
+import { Flex, Item } from "react-flex-ready";
+
+const myList = [{ title: "first" }, { title: "second" }, { title: "third" }];
+
+const Demo = () => (
+ <div>
+ <h1>Example</h1>
+ <Flex>
+ {myList.map(({ title }, i) => (
+ <Item key={i} col="3" colTablet="3" colMobile="1" stretch>
+ <div
+ style={{
+ textAlign: "center",
+ width: "100%",
+ border: "1px solid #eee"
+ }}
+ >
+ <h1>{title}</h1>
+ </div>
+ </Item>
+ ))}
+ </Flex>
+ </div>
+);
+
+render(<Demo />, document.querySelector("#root"));
+```
+
+## Props
+
+### Flex
+
+These docs are inspired by reactjs-popup docs
+
+| Option | Default | Type | Description |
+| -------------------- | ----------------- | -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| align | center | {string} | The way you want to align your items (`align-items`) |
+| col | 1 | {string} | How many columns you have within your grid
+
+### Item
+
+| Option | Default | Type | Description |
+| -------------------- | ----------------- | -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| col | 1 | {string} | How many columns of 12 your item will take on desktop |
+| col | 1 | {string} | How many columns you have within your grid
+| colTablet | 1 | {string} | How many columns of 12 your item will take on tablet
+| colMobile | 1 | {string} | How many columns of 12 your item will take on mobile
+| marginBottom | `3rem` | {string} | Margin bottom of your item, last item always has 0 on mobile
+| stretch | false | {bool} | Whether you want the items to have the same height or not
+
+## Built with
+
+- React & Styled-components
+
+## License
+
+This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details
+
+## Contributors
+
+- [Myself](https://smakosh.com)
+
+## Support
+
+If you love this React component and want to support me, you can do so through my Patreon
 
-[coveralls-badge]: https://img.shields.io/coveralls/user/repo/master.png?style=flat-square
-[coveralls]: https://coveralls.io/github/user/repo
+[![Support me on Patreon](https://c5.patreon.com/external/logo/become_a_patron_button.png)](https://www.patreon.com/smakosh)