Link

Om komponenten

Punkt har CSS-klasser som kan brukes for å style HTML-elementet <a>. Se kode-eksempelet i HTML nedenfor. Det er ikke utviklet egne React- og Vue-komponenter for Link i Punkt.

Varianter

Eksempel

<a href="#" class="pkt-link">Normal lenke</a>
<a href="#" class="pkt-link pkt-link--focus">Fokus lenke</a>
<a href="#" class="pkt-link pkt-link--hover">Hover lenke</a>
<a href="#" class="pkt-link pkt-link--active">Aktiv lenke</a>
<a href="#" class="pkt-link pkt-link--external">Ekstern lenke</a>

<a href="#" class="pkt-link pkt-link--icon-right">
  <span class="pkt-icon">
    <svg class="pkt-link__icon" viewBox="0 0 32 32">
      <use href="#chevron-right"></use>
    </svg>
  </span>
  Link med ikon til høyre
</a>

<a href="#" class="pkt-link pkt-link--icon-left">
  <span class="pkt-icon">
    <svg class="pkt-link__icon" viewBox="0 0 32 32">
      <use href="#chevron-right"></use>
    </svg>
  </span>
  Link med ikon til venstre
</a>