@tabetalt/kit

The technical implementation of Tabetalt Designsystem, based on Theme UI.

Showing:

Popularity

Downloads/wk

36

GitHub Stars

11

Maintenance

Last Commit

1mo ago

Contributors

11

Package

Dependencies

11

License

Apache-2.0

Type Definitions

Built-In

Tree-Shakeable

Yes?

Categories

Readme

Tabetalt Kit

Build & Deploy Total alerts LGTM Grade Maintainability npm bundle size

About

Tabetalt Kit is the technical implementation of Tabetalt Designsystem. It is based on Theme UI and features theme and a collection of components for use in Tabetalt applications.

Our intentions are to stylize according to Tabetalt Designsystem on all Theme UI components.

Quickstart

All components are included in one package. Install it as such:

▶ yarn add @tabetalt/kit

Install necessary peer dependencies.

▶ yarn add theme-ui@next

Remember to include Google Fonts No fonts are packaged with the library. Therefore, you'll need to add a Link to it, as such:

<link
  href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap"
  rel="stylesheet"
/>

Example

You'll have to register the ThemeProvider in order to make the theme work.

import { ThemeProvider, Styled } from 'theme-ui';
import { theme } from '@tabetalt/kit';

const App = () => (
  <ThemeProvider theme={theme}>
    <Styled.h1>Hello world!</Styled.h1>
  </ThemeProvider>
);

Documentation

Apart from this README, you can find details and examples of using the SDK in the following places:

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100