UI Kitchensink
Denne skærm fungerer som et overblik over sitets forskellige UI elementer.
Tekst her.
Tekst her.
Tekst her.
Tekst her.
Hay joe.
Text.
Text.
Text.
Lorem ipsum
Typography H6
Typography H1
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum assumenda rerum incidunt omnis molestiae, maxime tenetur unde maiores veniam dolore autem.
Typography H2
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum assumenda rerum incidunt omnis molestiae, maxime tenetur unde maiores veniam dolore autem.
Typography H3
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum assumenda rerum incidunt omnis molestiae, maxime tenetur unde maiores veniam dolore autem.
Typography H4
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum assumenda rerum incidunt omnis molestiae, maxime tenetur unde maiores veniam dolore autem.
Typography H5
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum assumenda rerum incidunt omnis molestiae, maxime tenetur unde maiores veniam dolore autem.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum assumenda rerum incidunt omnis molestiae, maxime tenetur unde maiores veniam dolore autem.
Typography H6
Typography H2
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum assumenda rerum incidunt omnis molestiae, maxime tenetur unde maiores veniam dolore autem.
- Unordered list item
- Unordered list item
- Unordered list item
- Unordered list item
- Unordered list item
- Unordered list item
Lorem ipsum strong emphasized bold adipisicing elit. Ipsum Link rerum Link 2 omnis Link 3, maxime tenetur unde maiores veniam dolore autem.
Image: size-full.
Image: size-full/alignnone.
Image: size-full/aligncenter
Image: size-full/alignleft.
Image: size-full/alignright.
Images without size-full class are not made responsive and size-constrained. They are good for icons and smaller images.
Tables
| Table | Table | Table |
|---|---|---|
| Table | Table | Table |
| Table | Table | Table |
| Table | Table | Table |
Colors
Color: 1
Color: 2
Color: 3
Color: 4
Color: light
Color: medium
Color: dark
Color: success
Color: warning
Color: danger
Buttons
Button 1
Button 2
Button 3
Button 4
Button 5
Button 6
Button 7
Button 8
Button 1
Button 2
Button 3
Button 4
Button 5
Button 6
Button 7
Button 8
Interactions
Alert message
Spinner (non-blocking)
Spinner (blocking)
Confirm modal
Toast-besked: Info
Toast-besked: Success
Toast-besked: Warning
Toast-besked: Error
Form/input elements
Card header
Card content
Card header, level 1
Card content
Card header, level 2
Card content
Card content
Card header: 1
Card content
Card header: 2
Card content
Card header: 3
Card content
Card header: 4
Card content
Card header: Dark
Card content
Card header: Medium
Card content
Card header: Light
Card content
Card header: Success
Card content
Card header: Warning
Card content
Card header: Danger
Card content
Card header/body: 1
Card content
Card header/body: 2
Card content
Card header/body: 3
Card content
Card header/body: 4
Card content
Card header/body: Dark
Card content
Card header/body: Medium
Card content
Card header/body: Light
Card content
Card header/body: Success
Card content
Card header/body: Warning
Card content
Card header/body: Danger
Card content