@oslokommune/punkt-css 0.22.1 → 0.22.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +19 -0
- package/CONTRIBUTING.md +33 -35
- package/README.md +10 -9
- package/package.json +7 -7
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,25 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.22.4](https://github.com/oslokommune/punkt/compare/v0.22.3...v0.22.4) (2023-02-27)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @oslokommune/punkt-css
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [0.22.2](https://github.com/oslokommune/punkt/compare/v0.22.1...v0.22.2) (2023-02-26)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
### Bug Fixes
|
|
18
|
+
|
|
19
|
+
* **react:** Sett opp react-lib og publiseringsflyter ([#660](https://github.com/oslokommune/punkt/issues/660)) ([1bb89c7](https://github.com/oslokommune/punkt/commit/1bb89c764e1fd0e100cd7c2d6d820d958273609e))
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
6
25
|
## [0.22.1](https://github.com/oslokommune/punkt/compare/v0.22.0...v0.22.1) (2023-02-23)
|
|
7
26
|
|
|
8
27
|
**Note:** Version bump only for package @oslokommune/punkt-css
|
package/CONTRIBUTING.md
CHANGED
|
@@ -7,18 +7,40 @@ er at vi høflig ber deg endre på noe. **Vi setter pris på alle hyggelige bidr
|
|
|
7
7
|
Vi oppfordrer deg til å starte med å lese vår
|
|
8
8
|
[overordnede guide for å bidra](/kom-i-gang/bidra/).
|
|
9
9
|
|
|
10
|
-
Happy coding!
|
|
10
|
+
👋 Happy coding!
|
|
11
11
|
|
|
12
|
-
## Forutsetninger
|
|
13
|
-
|
|
14
|
-
- Node 16.15 er installert
|
|
12
|
+
## 📝 Forutsetninger
|
|
13
|
+
- Node 16.15
|
|
15
14
|
- Kunnskap om [Sass (SCSS)](https://sass-lang.com/) og [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS).
|
|
16
15
|
- Forståelse av [BEM-navnekonvensjoner](http://getbem.com/) som designsystemet følger.
|
|
17
16
|
- Skal du jobbe med [SVG](https://developer.mozilla.org/en-US/docs/Web/SVG) er det nyttig å kunne litt om det.
|
|
18
17
|
- Noen skal ha designet komponenten i [Figma](https://www.figma.com/file/Eej5jm3jIUjeMfzLE0aOTB/Punkt---Origo-designsystem?node-id=0%3A1&t=VDbEaltk80wYiYn3-0) (Krever innlogging og tilgang).
|
|
19
18
|
|
|
20
|
-
|
|
19
|
+
Aller først må du konfigurere git-hooks slik at scripts kjøres ved commits, som for eksempel et script som kopierer innhold fra readme og contributing til dokumentasjonsnettsiden.
|
|
20
|
+
|
|
21
|
+
Sett opp git hooks:
|
|
22
|
+
|
|
23
|
+
```sh
|
|
24
|
+
git config core.hooksPath scripts/git-hooks
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Lerna
|
|
28
|
+
Punkt er et monorepo og bruker `lerna`. Det betyr at alle kommandoer kjører
|
|
29
|
+
fra repoets rot, og ikke i subrepoene.
|
|
30
|
+
|
|
31
|
+
Et utdrag fra rot-package.json viser noen scripts som er satt opp for å forenkle
|
|
32
|
+
utvikling i dette subrepoet:
|
|
33
|
+
|
|
34
|
+
```sh
|
|
35
|
+
"scripts": {
|
|
36
|
+
"build-css": "npx lerna run build --scope=@oslokommune/punkt-css",
|
|
37
|
+
"build-css-app": "npx lerna run build-app --scope=@oslokommune/punkt-css",
|
|
38
|
+
"dev-css": "npx lerna run dev --scope=@oslokommune/punkt-css",
|
|
39
|
+
}
|
|
40
|
+
```
|
|
21
41
|
|
|
42
|
+
## 🛠️ Gjør arbeidet
|
|
43
|
+
### Bli kjent med koden
|
|
22
44
|
|
|
23
45
|
```sh
|
|
24
46
|
@oslokommune/punkt-css
|
|
@@ -86,45 +108,21 @@ $breakpoints: (
|
|
|
86
108
|
) !default;
|
|
87
109
|
```
|
|
88
110
|
|
|
89
|
-
##
|
|
90
|
-
|
|
91
|
-
Test css-komponentene i Vite-appen, kjør:
|
|
92
|
-
|
|
93
|
-
Punkt er et monorepo og bruker `lerna`. Det betyr at alle kommandoer kjører
|
|
94
|
-
fra repoets rot, og ikke i subrepoene.
|
|
95
|
-
|
|
96
|
-
Et utdrag fra rot-package.json viser noen scripts som er satt opp for å forenkle
|
|
97
|
-
utvikling i dette subrepoet:
|
|
98
|
-
|
|
99
|
-
```sh
|
|
100
|
-
"scripts": {
|
|
101
|
-
"build-css": "npx lerna run build --scope=@oslokommune/punkt-css",
|
|
102
|
-
"build-css-app": "npx lerna run build-app --scope=@oslokommune/punkt-css",
|
|
103
|
-
"dev-css": "npx lerna run dev --scope=@oslokommune/punkt-css",
|
|
104
|
-
}
|
|
105
|
-
```
|
|
106
|
-
|
|
107
|
-
## Lag PR
|
|
111
|
+
## 🤝 Lag PR
|
|
108
112
|
Når du er klar for en PR skriv din GitHub-message som sier hva som er gjort, og evt issue nummer.
|
|
109
113
|
|
|
110
114
|
Vi bruker [Conventional Commits](https://www.conventionalcommits.org/) for å beskrive commits gjennom
|
|
111
115
|
noen regler. Ingen fare om du ikke følger den, vi tar en gjennomgang og evt justerer 😎.
|
|
112
116
|
|
|
113
117
|
```sh
|
|
114
|
-
|
|
115
|
-
fix(
|
|
116
|
-
feat(
|
|
117
|
-
feat(
|
|
118
|
+
fix(css): #NR Rett feil på alert-komponenten # med issuenummer
|
|
119
|
+
fix(css): Rett feil på alert-komponenten # patcher en bug i koden (patch i Semantic Versioning)
|
|
120
|
+
feat(css): Legg til funksjonalitet # ny funksjonalitet i koden (minor i Semantic Versioning)
|
|
121
|
+
feat(css)!: Legg til funksjonalitet og endre eksisterende # breaking change i koden (major i Semantic Versioning)
|
|
118
122
|
docs: Endre dokumentasjon # Endring i dokumentasjon
|
|
119
123
|
```
|
|
120
124
|
|
|
121
|
-
## Publisering og versjonering
|
|
122
|
-
|
|
125
|
+
## 🔢 Publisering og versjonering
|
|
123
126
|
Vi tar oss av publisering av pakken og versjonering.
|
|
124
127
|
|
|
125
128
|
Punkt bruker [Semantic Versioning 2.0.0](https://semver.org/spec/v2.0.0.html) for versjonering av pakkene.
|
|
126
|
-
|
|
127
|
-
Mens vi er i en beta-fase, versjonering vil følge dette mønsteret: **v0.Y.Z**, hvor
|
|
128
|
-
|
|
129
|
-
- **Y**: Major (breaking changes)
|
|
130
|
-
- **Z**: Minor eller patch
|
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
Denne pakken inneholder CSS-rammeverket som gjenspeiler skissene i Figma. Det er ikke automatikk mellom Figma og denne koden, så kode vil som regel henge litt etter hva som oppdateres i Figma.
|
|
6
6
|
|
|
7
|
-
## Innhold
|
|
7
|
+
## 📖 Innhold
|
|
8
8
|
|
|
9
9
|
```sh
|
|
10
10
|
@oslokommune/punkt-css
|
|
@@ -39,11 +39,9 @@ Eksempelet under viser installasjon i en applikasjon med `Vue 3` + `Vite`.
|
|
|
39
39
|
For å kunne bruke logo, ikoner og fonter med CSS-pakken må du installere punkt-assets
|
|
40
40
|
|
|
41
41
|
```sh
|
|
42
|
-
npm add -D sass
|
|
43
|
-
npm add @oslokommune/punkt-
|
|
44
|
-
|
|
45
|
-
```sh
|
|
46
|
-
npm add @oslokommune/punkt-assets
|
|
42
|
+
npm add -D sass # Viktig å bruke denne og ikke node-sass
|
|
43
|
+
npm add @oslokommune/punkt-assets # Pakken med svg-ressurser
|
|
44
|
+
npm add @oslokommune/punkt-css # Ja denne
|
|
47
45
|
```
|
|
48
46
|
|
|
49
47
|
### 2. Opprett en scss-fil
|
|
@@ -136,7 +134,7 @@ Legg til logo -->
|
|
|
136
134
|
</style>
|
|
137
135
|
```
|
|
138
136
|
|
|
139
|
-
## CSS-rammeverket
|
|
137
|
+
## 🎨 CSS-rammeverket
|
|
140
138
|
|
|
141
139
|
- Modulært - import modulene du selv ønsker.
|
|
142
140
|
- Må bruke css-klasser - ingen overstyring utenom å bruke OsloSans.
|
|
@@ -146,7 +144,7 @@ Legg til logo -->
|
|
|
146
144
|
### Innhold
|
|
147
145
|
|
|
148
146
|
| Kategori | Beskrivelse |
|
|
149
|
-
|
|
147
|
+
|:-----------|:-----------------------------------------------------------------------------------------|
|
|
150
148
|
| Abstracts | Variabler, funksjoner, mixins: Alle Sass-verktøy som brukes på tvers av rammeverket |
|
|
151
149
|
| Normalise | Normalisering for å ha en felles baseline |
|
|
152
150
|
| Base | Grunnleggende moduler som farger, grid, spacing, hjelpeklasser, mm. |
|
|
@@ -259,7 +257,7 @@ Les mer om:
|
|
|
259
257
|
#### Hjelpeklasser
|
|
260
258
|
|
|
261
259
|
| Type | Klassenavn | Modifier / Helper | Beskrivelse |
|
|
262
|
-
|
|
260
|
+
|-------------------|-----------------------------------------------|---------------------------------------------|-------------------------------------------------------------|
|
|
263
261
|
| Synlighet | .pkt-show, .pkt-hide | `-{synlighet}`-`{breakpoint}-up` | |
|
|
264
262
|
| Tekstjustering | .pkt-txt-start, .pkt-txt-center, .pkt-txt-end | | |
|
|
265
263
|
| Screenreader only | .pkt-sr-only | | Innholdet blir skjult visuelt, men kan leses av skjermleser |
|
|
@@ -330,6 +328,9 @@ Komponenter er sammensatte elementer som består av en gruppe av elementer og/el
|
|
|
330
328
|
|
|
331
329
|
Alle våre komponenter er dokumentert [under komponenter](/komponenter/om-komponenter).
|
|
332
330
|
|
|
331
|
+
## 🔢 Versjonering
|
|
332
|
+
Punkt bruker [Semantic Versioning 2.0.0](https://semver.org/spec/v2.0.0.html) for versjonering av pakkene.
|
|
333
|
+
|
|
333
334
|
## 👮 Lisens
|
|
334
335
|
|
|
335
336
|
`Punkt` er distribuert under [MIT-lisens](https://github.com/oslokommune/punkt/blob/main/packages/css/LICENSE) for åpen kildekode.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oslokommune/punkt-css",
|
|
3
|
-
"version": "0.22.
|
|
3
|
+
"version": "0.22.4",
|
|
4
4
|
"description": "CSS-rammeverket til Punkt, et designsystem laget av Oslo Origo",
|
|
5
5
|
"homepage": "https://punkt.oslo.kommune.no",
|
|
6
6
|
"author": "Team Designsystem, Oslo Origo",
|
|
@@ -9,8 +9,8 @@
|
|
|
9
9
|
"module": "index.js",
|
|
10
10
|
"files": [
|
|
11
11
|
"/dist",
|
|
12
|
-
"
|
|
13
|
-
"
|
|
12
|
+
"CHANGELOG.md",
|
|
13
|
+
"CONTRIBUTING.md"
|
|
14
14
|
],
|
|
15
15
|
"scripts": {
|
|
16
16
|
"astro": "astro",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"watch": "chokidar \"src/scss/**/*\" -c \"npm run build\""
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
|
-
"@oslokommune/punkt-assets": "^0.22.
|
|
24
|
+
"@oslokommune/punkt-assets": "^0.22.4",
|
|
25
25
|
"astro": "^2.0.2",
|
|
26
26
|
"chokidar-cli": "^3.0.0",
|
|
27
27
|
"edit-json-file": "^1.7.0",
|
|
@@ -32,10 +32,10 @@
|
|
|
32
32
|
"svgson": "^5.2.1"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
|
-
"@oslokommune/punkt-assets": ">=0.
|
|
35
|
+
"@oslokommune/punkt-assets": ">=1.0.0"
|
|
36
36
|
},
|
|
37
37
|
"engines": {
|
|
38
|
-
"node": ">=16.
|
|
38
|
+
"node": ">=16.0.0"
|
|
39
39
|
},
|
|
40
40
|
"private": false,
|
|
41
41
|
"publishConfig": {
|
|
@@ -57,5 +57,5 @@
|
|
|
57
57
|
"url": "https://github.com/oslokommune/punkt/issues"
|
|
58
58
|
},
|
|
59
59
|
"license": "MIT",
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "9892f3bedcbad36ee76a3a896b920948ed48fb4f"
|
|
61
61
|
}
|