@fremtind/jokul 0.24.1 → 0.25.1

package/README.md

@@ -2,7 +2,7 @@
 
 Her finner du alle React-komponenter, stilark og diverse utilities
 
-## Komponenter
+## React-komponenter
 
 Alle komponentene våre installeres fra denne pakka, enten fra roten
 
@@ -20,6 +20,10 @@ For en full liste over komponenter kan du kikke i [components-mappa](src/compone
 
 ## Stilark
 
+Stilarkene i Jøkul tilbys som Sass-filer, og som ferdigbygget CSS i både formatert og minifisert versjon. Vi anbefaler å bruke Sass-versjonene dersom du bruker en bundler, siden det kan optimalisere størrelsen på de ferdige stilene.
+
+### Felles stiler
+
 Det finnes en del grunnleggende stiler som må med for at ting skal fungere riktig, disse
 kan du importere med
 
@@ -27,22 +31,50 @@ kan du importere med
 @use "@fremtind/jokul/styles/core/core";
 ```
 
+eller i ts/js
+
+```tsx
+// Finnes også ferdig bygget, med filendelsene .css og .min.css
+import "@fremtind/jokul/styles/core/core.scss";
+```
+
+### Stiler for komponenter
+
 Når du bruker en komponent må du også importere stilen
 
 Dette kan gjøres med
 
 ```scss
-@use "@fremtind/jokul/styles/[komponent]";
+@use "@fremtind/jokul/styles/components/[komponent]";
+```
+
+eller direkte i tsx der du bruker komponenten
+
+```tsx
+// Ved å importere _index.scss får du også med stilarkene fra
+// eventuelle avhengigheter til komponenten, helt automatisk
+import "@fremtind/jokul/styles/components/[komponent]/_index.scss";
+
+// Det finnes også ferdigbygde stilark for komponentene, men
+// da får du ikke med stilene til eventuelle avhengigheter
+import "@fremtind/jokul/styles/components/[komponent]/[komponent].min.css";
 ```
 
 ### Import alle stiler
 
-Eller du kan importere alle stiler på en gang med
+Du kan importere stilarkene for alle Jøkulkomponentene på en gang med
 
 ```scss
 @use "@fremtind/jokul/styles";
 ```
 
+eller i ts/js
+
+```tsx
+// Finnes også ferdig bygget, med filendelsene .css og .min.css
+import "@fremtind/jokul/styles/styles.scss";
+```
+
 Vær obs på at du da kan få med en del mer stilark enn du trenger så vurder dette opp mot
 størrelsen på bundelen du sender ut. Bruker du SSR kan dette ende med veldig mye overhead.
 
@@ -89,7 +121,7 @@ kopieres inn i prosjektet. Deretter må du endre URLen i hver `@font-face`-defin
 For å få tilgang til mixins vi tilbyr kan du i din .scss fil bruke
 
 ```scss
-@use "@fremtind/jokul/core/jkl";
+@use "@fremtind/jokul/styles/core/jkl";
 ```
 
 ## Hooks
@@ -100,7 +132,7 @@ Akkurat som med komponenter kan disse importeres fra roten
 import { useAnimatedDetails, useLocalStorage } from "@fremtind/jokul";
 ```
 
-eller via /hooks stien
+eller via `/hooks`-stien
 
 ```jsx
 import { useAnimatedDetails, useLocalStorage } from "@fremtind/jokul/hooks";
@@ -116,7 +148,7 @@ Du gjettet riktig, disse kan også hentes fra roten av pakka
 import { tabListener, unicode } from "@fremtind/jokul";
 ```
 
-Eller via /utilities stien
+Eller via `/utilities`-stien
 
 ```jsx
 import { tabListener, unicode } from "@fremtind/jokul/utilities";