1.0.0 • Published 3 years ago
devs-react-button v1.0.0
Button
button
| Props | Values | Default |
|---|---|---|
| <!-- justifyContent | string | center |
| alignItems | "flex-start" , "flex-end" , "center" , "baseline" , "stretch" | center |
| alignContent | "flex-start" , "flex-end" , "center" , "space-between" , "space-around" , "stretch" | null |
| width | string eg: 20px | 100% |
| height | string eg: 20px | 100% |
| textAlign | "left" , "right" , "center" , "justify" , "inherit" | center |
| wrap(fle-wrap) | "nowrap" , "wrap" , "wrap-reverse" | wrap |
| direction(flex-direction) | row, row-reverse, column, column-reverse | row |
| margin | string. Eg: 20px | 0 |
| pad(padding) | string | 0 |
| bgColor(background-color) | string | transparent --> |
Usage
import Button from "devs-react-button"
const theme: ThemeTypes = {
palette: {
Blue: {
dark: {
5: '#F2F6FA'
},
},
};
// shadows,
// typography,
// zIndex,
// shape,
// fontSizes,
};
const { Flex } = Components(theme)
const App = () => (
<Flex
justifyContent="center"
bgColor='Blue.dark.5'
// ...other propps if needed
>
This is a div
</Flex>
)1.0.0
3 years ago