@lux-design-system/font 0.0.0-canary-20241001152439
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/LICENSE.md +7 -0
- package/README.md +42 -0
- package/dist/index.css +36 -0
- package/dist/index.scss +5 -0
- package/dist/ro-font-face-mixin.scss +67 -0
- package/package.json +37 -0
package/LICENSE.md
ADDED
package/README.md
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
# Font assets voor het LUX Design System
|
|
2
|
+
|
|
3
|
+
Deze package bevat de referenties naar de lettertypes RijksoverheidSerif en RijksoverheidSans die het LUX Design System gebruikt.
|
|
4
|
+
**Let op:** Deze fonts zijn auteurrechtelijk beschermd. Lees meer op [Gebruiksvoorwaarden typografie](https://www.rijkshuisstijl.nl/publiek/modules/product/DigitalStyleGuide/default/index.aspx?ItemId=10370) op Rijkshuisstijl.nl
|
|
5
|
+
|
|
6
|
+
## Installeren
|
|
7
|
+
|
|
8
|
+
### NPM
|
|
9
|
+
|
|
10
|
+
`npm install @lux-design-system/font --save-dev`
|
|
11
|
+
|
|
12
|
+
### Yarn
|
|
13
|
+
|
|
14
|
+
`yarn add @lux-design-system/font --dev`
|
|
15
|
+
|
|
16
|
+
### PNPM
|
|
17
|
+
|
|
18
|
+
`pnpm add -D @lux-design-system/font --save-dev`
|
|
19
|
+
|
|
20
|
+
Daarna zijn de volgende `@font-face` `font-family`s beschikbaar:
|
|
21
|
+
|
|
22
|
+
- RijksoverheidSansWebText, in regular, bold en italic
|
|
23
|
+
- RijksoverheidSerifWeb, in regular, bold en italic
|
|
24
|
+
|
|
25
|
+
_De fonts worden vanwege copyright niet mee gepubliceerd._
|
|
26
|
+
|
|
27
|
+
## Bestanden
|
|
28
|
+
|
|
29
|
+
### `dist/index.css`
|
|
30
|
+
|
|
31
|
+
Hierin staan de definities en font-family-namen die binnen LUX worden gebruikt.
|
|
32
|
+
|
|
33
|
+
Dit bestand kun je importeren of invoegen in je website of applicatie. De font-bestanden zal je zelf naar de folder moeten kopieren.
|
|
34
|
+
|
|
35
|
+
### `dist/ro-font-face-mixin.scss` en `index.scss`
|
|
36
|
+
|
|
37
|
+
De SCSS mixin waarin de definities opgebouwd worden, deze kan je in je eigen buildproces meenemen en daarmee je eigen folder opgeven waar de font-bestanden zijn gekopieerd.
|
|
38
|
+
Een voorbeeld staat in `index.scss`.
|
|
39
|
+
|
|
40
|
+
## Eigen (online) font gebruiken?
|
|
41
|
+
|
|
42
|
+
Dan heb je deze package niet nodig.
|
package/dist/index.css
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
@font-face {
|
|
2
|
+
font-style: normal;
|
|
3
|
+
font-weight: 400;
|
|
4
|
+
src: local("ROsanswebtextregular"), url("./ROsanswebtextregular.woff") format("woff"), url("./ROsanswebtextregular.eot") format("embedded-opentype"), url("./ROsanswebtextregular.ttf") format("truetype");
|
|
5
|
+
font-family: "RijksoverheidSansWebText";
|
|
6
|
+
}
|
|
7
|
+
@font-face {
|
|
8
|
+
font-style: normal;
|
|
9
|
+
font-weight: 700;
|
|
10
|
+
src: local("ROsanswebtextbold"), url("./ROsanswebtextbold.woff") format("woff"), url("./ROsanswebtextbold.eot") format("embedded-opentype"), url("./ROsanswebtextbold.ttf") format("truetype");
|
|
11
|
+
font-family: "RijksoverheidSansWebText";
|
|
12
|
+
}
|
|
13
|
+
@font-face {
|
|
14
|
+
font-style: italic;
|
|
15
|
+
font-weight: 400;
|
|
16
|
+
src: local("ROsanswebtextitalic"), url("./ROsanswebtextitalic.woff") format("woff"), url("./ROsanswebtextitalic.eot") format("embedded-opentype"), url("./ROsanswebtextitalic.ttf") format("truetype");
|
|
17
|
+
font-family: "RijksoverheidSansWebText";
|
|
18
|
+
}
|
|
19
|
+
@font-face {
|
|
20
|
+
font-style: normal;
|
|
21
|
+
font-weight: 400;
|
|
22
|
+
src: local("ROserifwebregular"), url("./ROserifwebregular.woff") format("woff"), url("./ROserifwebregular.eot") format("embedded-opentype"), url("./ROserifwebregular.ttf") format("truetype");
|
|
23
|
+
font-family: "RijksoverheidSerifWeb";
|
|
24
|
+
}
|
|
25
|
+
@font-face {
|
|
26
|
+
font-style: normal;
|
|
27
|
+
font-weight: 700;
|
|
28
|
+
src: local("ROserifwebbold"), url("./ROserifwebbold.woff") format("woff"), url("./ROserifwebbold.eot") format("embedded-opentype"), url("./ROserifwebbold.ttf") format("truetype");
|
|
29
|
+
font-family: "RijksoverheidSerifWeb";
|
|
30
|
+
}
|
|
31
|
+
@font-face {
|
|
32
|
+
font-style: italic;
|
|
33
|
+
font-weight: 400;
|
|
34
|
+
src: local("ROserifwebitalic"), url("./ROserifwebitalic.woff") format("woff"), url("./ROserifwebitalic.eot") format("embedded-opentype"), url("./ROserifwebitalic.ttf") format("truetype");
|
|
35
|
+
font-family: "RijksoverheidSerifWeb";
|
|
36
|
+
}
|
package/dist/index.scss
ADDED
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
@mixin ro-font-face($folder: ".") {
|
|
2
|
+
@font-face {
|
|
3
|
+
font-style: normal;
|
|
4
|
+
font-weight: 400;
|
|
5
|
+
src:
|
|
6
|
+
local("ROsanswebtextregular"),
|
|
7
|
+
url("#{$folder}/ROsanswebtextregular.woff") format("woff"),
|
|
8
|
+
url("#{$folder}/ROsanswebtextregular.eot") format("embedded-opentype"),
|
|
9
|
+
url("#{$folder}/ROsanswebtextregular.ttf") format("truetype");
|
|
10
|
+
font-family: "RijksoverheidSansWebText";
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@font-face {
|
|
14
|
+
font-style: normal;
|
|
15
|
+
font-weight: 700;
|
|
16
|
+
src:
|
|
17
|
+
local("ROsanswebtextbold"),
|
|
18
|
+
url("#{$folder}/ROsanswebtextbold.woff") format("woff"),
|
|
19
|
+
url("#{$folder}/ROsanswebtextbold.eot") format("embedded-opentype"),
|
|
20
|
+
url("#{$folder}/ROsanswebtextbold.ttf") format("truetype");
|
|
21
|
+
font-family: "RijksoverheidSansWebText";
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
@font-face {
|
|
25
|
+
font-style: italic;
|
|
26
|
+
font-weight: 400;
|
|
27
|
+
src:
|
|
28
|
+
local("ROsanswebtextitalic"),
|
|
29
|
+
url("#{$folder}/ROsanswebtextitalic.woff") format("woff"),
|
|
30
|
+
url("#{$folder}/ROsanswebtextitalic.eot") format("embedded-opentype"),
|
|
31
|
+
url("#{$folder}/ROsanswebtextitalic.ttf") format("truetype");
|
|
32
|
+
font-family: "RijksoverheidSansWebText";
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
@font-face {
|
|
36
|
+
font-style: normal;
|
|
37
|
+
font-weight: 400;
|
|
38
|
+
src:
|
|
39
|
+
local("ROserifwebregular"),
|
|
40
|
+
url("#{$folder}/ROserifwebregular.woff") format("woff"),
|
|
41
|
+
url("#{$folder}/ROserifwebregular.eot") format("embedded-opentype"),
|
|
42
|
+
url("#{$folder}/ROserifwebregular.ttf") format("truetype");
|
|
43
|
+
font-family: "RijksoverheidSerifWeb";
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
@font-face {
|
|
47
|
+
font-style: normal;
|
|
48
|
+
font-weight: 700;
|
|
49
|
+
src:
|
|
50
|
+
local("ROserifwebbold"),
|
|
51
|
+
url("#{$folder}/ROserifwebbold.woff") format("woff"),
|
|
52
|
+
url("#{$folder}/ROserifwebbold.eot") format("embedded-opentype"),
|
|
53
|
+
url("#{$folder}/ROserifwebbold.ttf") format("truetype");
|
|
54
|
+
font-family: "RijksoverheidSerifWeb";
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
@font-face {
|
|
58
|
+
font-style: italic;
|
|
59
|
+
font-weight: 400;
|
|
60
|
+
src:
|
|
61
|
+
local("ROserifwebitalic"),
|
|
62
|
+
url("#{$folder}/ROserifwebitalic.woff") format("woff"),
|
|
63
|
+
url("#{$folder}/ROserifwebitalic.eot") format("embedded-opentype"),
|
|
64
|
+
url("#{$folder}/ROserifwebitalic.ttf") format("truetype");
|
|
65
|
+
font-family: "RijksoverheidSerifWeb";
|
|
66
|
+
}
|
|
67
|
+
}
|
package/package.json
ADDED
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": "0.0.0-canary-20241001152439",
|
|
3
|
+
"author": "Community for NL Design System",
|
|
4
|
+
"description": "Font assets for LUX, the Design System for Logius, based on the NL Design System architecture",
|
|
5
|
+
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
|
+
"name": "@lux-design-system/font",
|
|
7
|
+
"main": "dist/index.css",
|
|
8
|
+
"keywords": [
|
|
9
|
+
"nl-design-system",
|
|
10
|
+
"lux-design-system"
|
|
11
|
+
],
|
|
12
|
+
"private": false,
|
|
13
|
+
"publishConfig": {
|
|
14
|
+
"access": "public"
|
|
15
|
+
},
|
|
16
|
+
"files": [
|
|
17
|
+
"dist"
|
|
18
|
+
],
|
|
19
|
+
"devDependencies": {
|
|
20
|
+
"cpy-cli": "5.0.0",
|
|
21
|
+
"npm-run-all": "4.1.5",
|
|
22
|
+
"rimraf": "6.0.1",
|
|
23
|
+
"sass": "1.77.8"
|
|
24
|
+
},
|
|
25
|
+
"repository": {
|
|
26
|
+
"type": "git+ssh",
|
|
27
|
+
"url": "git@github.com:nl-design-system/lux.git",
|
|
28
|
+
"directory": "proprietary/font"
|
|
29
|
+
},
|
|
30
|
+
"scripts": {
|
|
31
|
+
"clean:dist": "rimraf dist/",
|
|
32
|
+
"create:dist": "cpy src/**/*.scss dist/",
|
|
33
|
+
"prebuild": "npm run clean:dist",
|
|
34
|
+
"build:css": "sass src/index.scss:dist/index.css --no-source-map --verbose",
|
|
35
|
+
"build": "npm-run-all create:dist build:css"
|
|
36
|
+
}
|
|
37
|
+
}
|