Skip to content

nve-icon

Et ikon. Vi bruker ikoner fra Material Symbols. Vi bruker strek-tykkelse 400 uansett størrelse på ikonet. Fill skal ikke brukes.

Arvet fra: LitElement

html
<nve-icon name="Favorite"></nve-icon>

Her er oversikt over ikoner i Material Symbols.

Eksempler

Størrelse

html
<nve-icon name="Rocket" style="width: 1.25rem;height: 1.25rem;"></nve-icon> liten (20px høyde)
<nve-icon name="Rocket" style="width: 1.5rem;height: 1.5rem;"></nve-icon> stor (24px høyde)
  • TODO: Burde vi sette standard størrelse automatisk?
  • TODO: Burde vi ha en egen property for størrelse?
  • TODO: Hvorfor bruker Figma 20 og 24px bredde når Google bruker 16px?

Skarpe eller mye kanter

Bruk library="Outlined" for myke kanter. Sharp er standard. Outlined skal kun brukes hvis symbolet blir lettere å lese.

html
<nve-icon name="Home"></nve-icon> skarpe <nve-icon name="Home" library="Outlined"></nve-icon> myke

Egenskaper

NavnAttributt-synkTypeStandardverdiArvet fraBeskrivelse
library'Outlined' | 'Sharp''Sharp'Skarpe eller myke hjørner. Ikonene i ikonsettet skal i utgangspunktet ha skarpe hjørner, men hjørner kan være avrundet om det gjør motivet tydeligere.
namestring''Navnet på ikonet i Material Symbols-biblioteket

Metoder

NavnParametreReturtypeArvet fraBeskrivelse
firstUpdated
render