@amalitech-org/design-system v0.1.3

Amalitech Design System

Amalitech Design Sytem provides a comprehensive set of web components built with typescript to work with vanilla html and other frameworks

Setting things up

Install the component library in your project with npm, yarn or pnpm:

npm install @amalitech-org/design-system

yarn add @amalitech-org/design-system

pnpm add @amalitech-org/design-system

You can also add a CDN link fron https://cdn.jsdelivr.net into the head of your html template.

Plain HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@amalitech-org/design-system@<VERSION NUMBER>/dist/amalitech-design-system/amalitech-design-system.css" />
<script type="module" src="https://cdn.jsdelivr.net/npm/@amalitech-org/design-system@<VERSION NUMBER>/dist/amalitech-design-system/amalitech-design-system.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/@amalitech-org/design-system@<VERSION NUMBER>/dist/amalitech-design-system/amalitech-design-system.js"></script>

Replace @<VERSION NUMBER> with your desired version

Omit the @<VERSION NUMBER> to get the most recent version

With a bundler or ES modules

import '@amalitech-org/design-system/dist/amalitech-design-system/amalitech-design-system.css';
import { defineCustomElements, applyPolyfills } from '@amalitech-org/design-system/loader';

applyPolyfills().then(() => {
  defineCustomElements(window);
});

For more information view our full documentation on Storybook