lol.ui

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.
  1. First item
  2. Second item
    1. Sub item #1
    2. Sub item #2
  3. 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();