UI Config

Theming tokens and styling for Max IV apps.

Background

Max IV has a lot of small to medium sized web applications. All of them uses their own look and feel. Some uses a UI library, but many of them do not.

This is an attempt to try to get our web applications on the same track, look-and-feel-wise.

Usage

Agnostic UI

import the tokens from Agnostic and then override them with the Max IV tokens.

// Init file, e.g. main.ts...

// Import styles from Agnostic UI
import './components/ag/styles/ag-tokens.css';
import './components/ag/styles/ag-tokens-dark.css';

// Import styles from Max IV UI config
import '@max-iv/ui-config/src/styles/ui-tokens.css';
import '@max-iv/ui-config/src/styles/ui-tokens-dark.css';

import App from './App.vue';
createApp(App);

Version History

v1.1.0

New token prefix is --maxiv- to avoid confusion with other css maxes

v1.0.0

First release

v0.0.0

Initial setup

License

GPL-3.0-or-later

Copyright

Copyright Lund University