1.0.30 • Published 4 years ago
@samuelbeard/react-components v1.0.30
React Components
A React Component Library
A simple component library for my projects.
Setup
Install the package
npm install @samuelbeard/react-components
Import the package
import { Container, Row, Col } from '@samuelbeard/react-components'
Import the scss into your own scss
@import '~@samuelbeard/react-components/dist/scss/base.scss';
Styling
Colours are organised by their color names. (red
, blue
, etc)
Components
✅ - Done ❎ - Not Needed ❌ - Not Done
Component | className | background | color | size | ...props | PropTypes | defaultProps | stories | ...style |
---|---|---|---|---|---|---|---|---|---|
Button | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
Card | ✅ | ✅ | ✅ | ❎ | ✅ | ✅ | ✅ | ✅ | ❌ |
CardBody | ✅ | ✅ | ✅ | ❎ | ✅ | ✅ | ✅ | ✅ | ❌ |
CardFooter | ✅ | ✅ | ✅ | ❎ | ✅ | ✅ | ✅ | ✅ | ❌ |
CardHeader | ✅ | ✅ | ✅ | ❎ | ✅ | ✅ | ✅ | ✅ | ❌ |
Countdown | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ |
Form | ✅ | ❎ | ✅ | ❎ | ✅ | ❌ | ❌ | ❌ | ✅ |
Field | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ |
Col | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ |
Container | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ |
Row | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ |
Nav | ✅ | ✅ | ✅ | ❎ | ✅ | ✅ | ✅ | ✅ | ✅ |
NavMenu | ✅ | ❎ | ✅ | ❎ | ✅ | ✅ | ❎ | ✅ | ✅ |
NavTitle | ✅ | ❎ | ✅ | ❎ | ✅ | ✅ | ❎ | ✅ | ✅ |
Section | ✅ | ✅ | ✅ | ❎ | ✅ | ✅ | ✅ | ✅ | ✅ |
FadeIn | ✅ | ❎ | ❎ | ❎ | ✅ | ✅ | ✅ | ✅ | ✅ |
Improvements
- Add documentation for css utility classes.
## Utility Classes
Super Center
Center items inside a container vertically and horizontally.
className="super-center"
Test Align
Align text to left, center or right.
className="text-left"
className="text-center"
className="text-right"
1.0.30
4 years ago
1.0.29
5 years ago
1.0.28
5 years ago
1.0.27
5 years ago
1.0.26
5 years ago
1.0.25
5 years ago
1.0.24
5 years ago
1.0.23
5 years ago
1.0.22
5 years ago
1.0.21
5 years ago
1.0.20
5 years ago
1.0.19
5 years ago
1.0.18
5 years ago
1.0.17
5 years ago
1.0.16
5 years ago
1.0.15
5 years ago
1.0.14
5 years ago
1.0.13
5 years ago
1.0.12
5 years ago
1.0.11
5 years ago
1.0.10
5 years ago
1.0.9
5 years ago
1.0.8
5 years ago
1.0.7
5 years ago
1.0.6
5 years ago
1.0.5
5 years ago
1.0.4
5 years ago
1.0.3
5 years ago
1.0.2
5 years ago
1.0.1
5 years ago
1.0.0
5 years ago
0.1.0
5 years ago
0.0.1
5 years ago