lol.ui is a ui library for my personal projects. It is mostly css for existing html elements, but there are also some custom components. The custom components are built with lithtml, but should work with any framework.
Colors
The colors for the current theme.
Typography
This is a paragraph. With some emphasized text, and some more text and a link!
This is a block quote.
- First item
- Second item
- Sub item #1
- Sub item #2
- Third item
Card
Internal App
An app intended for internal audiences
Internal App
An app intended for internal audiences
Forms
Expander
Expander
Some text
Table
| Column A | Column B | Column C |
|---|---|---|
| Some Product or something | Some Category | $1 234.50 |
| Some Product or something | Some Category | $1 234.50 |
| Some Product or something | Some Category | $1 111.11 |
| Some Product or something | Some Category | $8 888.88 |
Tabs
Section 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam euismod, tortor nec pharetra ultricies, ante erat imperdiet velit, nec laoreet enim lacus a velit. Nam luctus, enim in interdum condimentum, nisl diam iaculis lorem, vel volutpat mi leo sit amet lectus. Praesent non odio bibendum magna bibendum accumsan.
Section 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam euismod, tortor nec pharetra ultricies, ante erat imperdiet velit, nec laoreet enim lacus a velit. Nam luctus, enim in interdum condimentum, nisl diam iaculis lorem, vel volutpat mi leo sit amet lectus. Praesent non odio bibendum magna bibendum accumsan.
Listbox
Notification
import { NotificationBuilder } from './components/ui-notification.ts';
const n = new NotificationBuilder("Hello from notifications")
.withBody("What's up")
.withIcon("error");
document.getElementById('noti').onclick = () => n.send();