@doruk/components v3.1.1

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

const aButton = () => (
  <Button accent="success">
    Hello world!
  </Button>
);

const aLoader = () => (
  <Loader size="md" fill="rebeccapurple" />
);

const overlayedLoader = () => (
  React.createPortal(
    <Loader
      variant="rect5"
      fullscreen={{
        bg: { color: "rgba(0,0,0,.5)", tint: 9 }
      }}
    />,
    document.getElementById("loader")
  )
);

const yetAnotherLoader = () => (
  <Loader
    size="xs"
    fullscreen="rgba(0,0,0,.6)"
  />
);

Button

Loader

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

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

const App = () => (
  <Main>
    <Reset />
    <Normalize />
  </Main>
);

or

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

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

const App = () => (
  <Section>
    <GlobalStyle />
  </Section>
);

Load from CDN

<script src="https://unpkg.com/@doruk/components"></script>

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