elvia-design-system

name	elvia-design-system
description	Reference for UI components in Elvia's design system ("Elvis"). Covers component-specific guidelines for sizing, coloring, types, ordering, labeling, accessibility attributes, CSS setup, and web-component registration. Use when building, reviewing, or fixing UI in an Elvia frontend, even if the request doesn't name Elvia or the CSS classes explicitly (e.g. "add a save button", "make this icon bigger", "add a tooltip").
license	GPL-3.0-only
metadata	{"author":"Elvia","version":"0.1.0-alpha.4"}

Elvia Design System (Elvis)

Reference: https://design.elvia.io

Areas

Load only the reference file(s) for the area being worked in, not the whole set.

• Installation @elvia/elvis package, global CSS registration and optional reset, and Elvis web-component installation and registration. See installation.md.

If no reference file exists for the requested component, fall back to general Elvia design principles from https://design.elvia.io and note that no reference was available.

• App Bridge <elvia-app-bridge> web component, @elvia/elvis-app-bridge package, metering-point target, active apps, internal use only, routing, environments. See app-bridge.md.
• Icons <e-icon> web component, @elvia/elvis-icons/elvis-assets-icons, sizing, coloring, accessible icon buttons. See icon.md.
• Buttons e-btn class, @elvia/elvis CSS library, types, sizing, ordering, labeling. See button.md.
• Modal <elvia-modal> web component, @elvia/elvis-modal package, heading, content, buttons, illustration. See modal.md.
• Tooltips <elvia-tooltip> web component, @elvia/elvis-tooltip package, trigger and content slots, positioning. See tooltip.md.