Móttika · Administración

Panel de administración (AC.03)

@mottika/ui

Botones

Estilos · default y disabled (pasa el cursor para el hover)

Primary

Neutral

Outlined

Neutral 2

Red

Red soft

Ghost

Loading

Tamaños

Solo icono · pill (arriba) y rounded (abajo)

Special button

Avatar

Rounded

Neutral
ADADADAD
Primary
ADADADAD

Square

Neutral
ADADADAD
Primary
ADADADAD

Sin iniciales (respaldo) y con indicador

ADAD

Badges

Outline

LabelLabelLabelLabelmuted
LabelLabelLabelLabelneutral
LabelLabelLabelLabelbrand
LabelLabelLabelLabelwarning
LabelLabelLabelLabeldestructive
LabelLabelLabelLabelsuccess

Solid

LabelLabelLabelLabelmuted
LabelLabelLabelLabelneutral
LabelLabelLabelLabelbrand
LabelLabelLabelLabelwarning
LabelLabelLabelLabeldestructive
LabelLabelLabelLabelsuccess

Tabs

Con la regla de fondo · la primera está activa

Contenido de la primera pestaña.

Sin la regla de fondo

Slider

Default

Outlined

Checkbox

Sin texto y con texto · los estados son de solo lectura aquí

Interactivo

Radio

Estados por tamaño · sin marcar, marcado, deshabilitado, deshabilitado marcado

sm · 12

md · 16

lg · 20

Con texto · interactivo

Tooltip

Posición de la flecha · pasa el cursor por cada botón

Sin título

Siempre visible (referencia)

Estados del switch

Default

Off
On
Off disabled
On disabled

Success

Off
On
Off disabled
On disabled

Con iconos

Off
On
Off disabled
On disabled

Estados de campo

Input

Default

Active

Active complete

Complete

Error

Error message

Error complete

Error message

Disabled

Disabled complete

Textarea

Default

Active

Active complete

Complete

Error

Error message

Error complete

Error message

Disabled

Disabled complete

Select

Default

Active

Active complete

Complete

Error

Error message

Error complete

Error message

Disabled

Disabled complete

Loader

Sizes

Colors