Global kantradius / avrundede hjørner
Ved å bruke globale kantradiuser kan du definere hver størrelse i temainnstillingene og gjenbruke dem på tvers av hele designet. Dette sørger for at alle radiene forblir like, noe som skaper et konsistent design. Hvis du senere ønsker å endre verdien på en kantradius, trenger du bare å gjøre det i temainnstillingene, så vil alle blokker og innstillinger som bruker denne kantradiusen oppdatere seg automatisk.
Justering av global kantradius
- Åpne designverktøyet (builder).
- Åpne temainnstillingene.
- Gå til Generelt > Avrundede hjørner (kantradius)
- Herfra kan du justere hver enkelt kantradiusverdi. Husk at verdien du skriver inn trenger en enhet, som px eller rem.
Bruk av global radius
Innstillingen for global radius er tilgjengelig på mange blokker (men ikke alle). For å bruke den må du ha avansert modus aktivert. Selve innstillingen finner du under seksjonen for avanserte innstillinger på en blokk eller seksjon.
I bildet nedenfor har "hero banner"-en aktivert global radius med verdien RADIUS-3XL
Aktiver "Global kantradius"
For mange blokker og seksjoner må du først aktivere bruken av global kantradius med en bryter (toggle). Når du gjør dette, vil eksisterende manuelle innstillinger for kantradius fjernes. Det betyr at du ikke kan bruke både global og vanlig kantradius samtidig.
Globale verdier i tilpasset kode
Hvis du skriver tilpasset kode (CSS) og ønsker å bruke de globale verdiene, kan du enkelt gjøre det. Hver globale radius har en tilsvarende CSS-variabel:
var(--radius-xs)var(--radius-sm)var(--radius-md)var(--radius-lg)var(--radius-xl)var(--radius-2xl)var(--radius-3xl)var(--radius-full)var(--radius-none)