1.1.0 • Published 3 years ago
aktoriukas-react-components v1.1.0
Element_sald
Collection of React components. Elements are build using 'styled-components' . It comes with styling and functionality can be passed very easily. To Have complete access and modification possibilities, download this repo and use each element separately.
all elements are in:
src/Elements
To view components visit : Kratinys
To install using NPM
npm i aktoriukas-react-components
Here's an example of basic usage:
import styled, { ThemeProvider } from 'styled-components';
import { button, list } from 'aktoriukas-react-components'
export default function MyApp() {
const theme = {
mainColor: '#535353',
secondColor: '#A0A0A0',
activeColor: '#ffffff57',
txtColor: '#ffffff',
fontSize: '1.4rem',
fontFamily: 'monospace',
fontFamily2: 'sans-serif',
backgroundColor: '#8787ab'
}
const exaplList =
[
'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
'Aenean tincidunt elit at ipsum cursus, vitae interdum nulla suscipit.',
'Curabitur in orci vel risus facilisis accumsan.',
'Morbi eleifend tortor lacinia sapien sagittis, quis pellentesque felis egestas.',
'Aenean viverra dui quis leo lacinia fringilla.',
'Sed varius lectus ac condimentum egestas.'
]
const { Zoom } = button;
const { Cards } = list;
return (
<ThemeProvider theme={theme}>
<Zoom txt='Hover me' />
<Cards list={exapleList} />
</ThemeProvider>
);
}
ThemeProvider is not essential, but highly recommended.
Priority is given to props, then followed by theme and default value.
Props
Button
prop | about |
---|---|
fontFamily | font family name |
fontSize | in px |
mainColor | any tipe of color |
secondColor | any tipe of color |
txtColor | any tipe of color |
activeColor | any tipe of color |
txt | string |
List
prop | about |
---|---|
fontFamily | font family name |
fontSize | in px |
mainColor | any tipe of color |
secondColor | any tipe of color |
txtColor | any tipe of color |
activeColor | any tipe of color |
list | array |