An open API service indexing awesome lists of open source software.

https://github.com/d0ruk/components

:sun_with_face:
https://github.com/d0ruk/components

component-p react styled-components styled-system webpack

Last synced: 2 months ago
JSON representation

:sun_with_face:

Awesome Lists containing this project

README

          

```js
import { Button, Loader } from "@doruk/components"

const aButton = () => (

Hello world!

);

const aLoader = () => (

);

const overlayedLoader = () => (
React.createPortal(
,
document.getElementById("loader")
)
);

const yetAnotherLoader = () => (

);
```

## Button

prop | type | description | default
---|---|:-:|---|
accent | string | one of; primary, secondary, success, error, warning | primary

## Loader

prop | type | description | default
---|---|:-:|--:|
fullscreen | string\|{color,tint} | overlay loader over \| {color:"mistyrose",tint:3}
fill|string|fill of the SVG elements| -
stroke|string|stroke of the SVG elements| -
size|string|one of; xs, sm, md, lg, xl|sm
variant|string|one of: spin1, spin2, spin3, rect1, rect2, rect3, rect4, rect5|spin1

## rest

Ul Li Main P Span Nav Div Section H1 H2 H3 H4 H5 H6 A Article Aside Audio B Br Caption Code Footer Header Hr I Iframe Img Input Li Main Ol Option P Picture Pre Progress Select Source Table Tbody Td Textarea Tfoot Th Thead Tr U Ul Video

## CSS reset & normalize

```js
import { Normalize, Reset, Main } from "@doruk/components"

const App = () => (




);
```

or

```js
import { normalize, reset, Section } from "@doruk/components"

const GlobalStyle = styled.createGlobalStyle`
${reset}
${normalize}
`;

const App = () => (



);
```

## Load from CDN

```html

```

Then the library is available as *_components*; i.e. *window._components.Button*