You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
docs: update theme guide with extra image for broken links (#3266)
* small fixes
* update image and text
* Update apps/storefront/app/grunnleggende/for-designere/eget-tema/page.mdx
---------
Co-authored-by: Michael Marszalek <[email protected]>
Copy file name to clipboardexpand all lines: apps/storefront/app/grunnleggende/for-designere/eget-tema/page.mdx
+14-4
Original file line number
Diff line number
Diff line change
@@ -69,7 +69,7 @@ Dette alternativet krever **ikke** Token Studio. Med dette alternativet kjører
69
69
70
70
## Alternativ 2: Med kobling
71
71
72
-
En kobling gjør at du slipper å legge variablene inn i Figma, du importerer dem i stedet fra pluginen "Tokens Studio".
72
+
En kobling gjør at du slipper å legge variablene inn i Figma, du importerer dem i stedet fra pluginen "Tokens Studio". Dette alternativet krever kjennskap til Git.
73
73
74
74
<Card
75
75
data-color='brand2'
@@ -81,13 +81,13 @@ En kobling gjør at du slipper å legge variablene inn i Figma, du importerer de
81
81
</Card>
82
82
83
83
84
-
### Slik går du frem for å få det til:
84
+
### Slik går du frem:
85
85
86
86
1. Hent komponentbiblioteket fra [Figma Community](https://www.figma.com/community/file/1322138390374166141/designsystemet-core-ui-kit) (Trykk "Open in Figma") til din organisasjon som har mimimum pro-lisens. Merk at dette blir en kopi av komponentbiblioteket uten noen kobling mot hovedfilen. Filen har nå lagt seg i "drafts", så du må flytte den til et fornuftig sted i din organisasjon.
87
87
88
88
2. Gå til [Temabyggeren](https://next.theme.designsystemet.no) og generer fargeskalaen ut i fra dine profilfarger. Klikk "Ta i bruk tema". Kopier kodesnutten og kjør den i en terminal i ditt Git repo. Sjekk inn og push filene.
89
89
90
-
3. Installer pluginen [Tokens Studio](<https://www.figma.com/community/plugin/843461159747178978/Tokens-Studio-for-Figma-(Figma-Tokens)>) for Figma. Tokens Studio sørger for kobling mellom Figma og kode, ved hjelp av Design Tokens (i json-filer).
90
+
3. Installer pluginen [Tokens Studio](<https://www.figma.com/community/plugin/843461159747178978/Tokens-Studio-for-Figma-(Figma-Tokens)>) for Figma. Tokens Studio sørger for kobling mellom Figma og kode, ved hjelp av Design Tokens.
91
91
92
92
<Image
93
93
src='/img/tokenstudio.png'
@@ -108,6 +108,16 @@ En kobling gjør at du slipper å legge variablene inn i Figma, du importerer de
108
108
dataUnstyled
109
109
/>
110
110
111
+
Vær oppmerksom på at modes som allerede ligger i Community-filen ikke blir slettet av Token Studio. Slett temaene du ikke trenger i Figma "Local variables" under "Theme". Det samme kan skje under "Main" og "Support".
112
+
113
+
<Image
114
+
src='/img/brutte-referanser.png'
115
+
alt='Skjermbilde som viser brutte koblinger i Figma-variablene. Høyreklikk og slett temaene du ikke trenger.'
116
+
boxShadow={false}
117
+
dataUnstyled
118
+
119
+
/>
120
+
111
121
5. Nå skal du se alle komponentene med dine egne profilfarger i Figma. For at andre designere i organisasjonen skal kunne bruke komponentene må du publisere filen.
112
122
113
-
6. Ferdig! PS. Dersom du skal gjøre endringer på tokens i Tokens Studio kan du pushe endringene til repoet ditt ved å trykke på "Last-opp"-ikonet (Push) nederst.
123
+
6. Ferdig! PS. Dersom du skal gjøre endringer på tokens i Tokens Studio kan du pushe endringene til repoet ditt ved å trykke på "Last-opp"-ikonet (Push) nederst.
0 commit comments