1.4.0 • Published 2 years ago
layout-greed v1.4.0
layout-greed
Layout guidlines to make sure you are on the right track when developing. Inspired by Figma 💄
Installing
For npm users - npm install layout-greed
For yarn users - yarn install layout-greed
Demo
Grids
Rows
Columns
Usability Notice
use (shift+l) to hide/show the layout grid control
How to use
- For normal use
import { Layout } from 'layout-greed';
const App = () => {
return (
<div className="App">
<Layout />
</div>
);
};
- To pick custom bindings / keyboard shortcuts
import { Layout } from 'layout-greed';
const App = () => {
return (
<div className="App">
<Layout customKeyBinding="ctrl+e" />
</div>
);
};
- To conditionally hide the layout grids
import { Layout } from 'layout-greed';
const App = () => {
const disabled = () => {
if (process.env.NODE_ENV !== 'production') return true;
return false;
};
return (
<div className="App">
<Layout hide={disabled} />
</div>
);
};
props
Props | Types | Default |
---|---|---|
hide | boolean | N/A |
color | string | rgba(250, 15, 15, 0.1) |
customKeyBinding | string | shift+l |
How to contribute
git clone https://github.com/chocoscoding/layout-greed layoutgreed
cd layoutgreed
yarn install
- Create a branch with the name of the feature you're want to contribute about. (Not too long naming)
- Run
yarn test
to make sure everything is alright and good. - Run
yarn storybook
to see and manage ui changes . - Make your contributions 😻
- Run the following commands
git add . yarn commit
- Run yor tests
- Push the changes
- Create a pull request
- After test and requirements are passed, your changes would be merged ✨✨✨✨
1.3.7
2 years ago
1.3.6
2 years ago
1.3.5
2 years ago
1.4.0
2 years ago
1.3.9
2 years ago
1.3.8
2 years ago
1.2.8
2 years ago
1.2.7
2 years ago
1.2.6
2 years ago
1.3.4
2 years ago
1.2.5
2 years ago
1.3.3
2 years ago
1.2.4
2 years ago
1.3.2
2 years ago
1.2.3
2 years ago
1.3.1
2 years ago
1.2.2
2 years ago
1.3.0
2 years ago
1.2.1
2 years ago
1.2.9
2 years ago
1.2.0
2 years ago
1.1.4
2 years ago
1.1.3
2 years ago
1.1.2
2 years ago
1.1.1
2 years ago
1.1.0
2 years ago
1.0.9
2 years ago
1.0.8
2 years ago
1.0.7
2 years ago
1.0.6
2 years ago
1.0.5
2 years ago
1.0.4
2 years ago
1.0.3
2 years ago
1.0.2
2 years ago
1.0.1
2 years ago
1.0.0
2 years ago