@bonniernews/dn-design-system-web 0.0.1-alpha.0

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.
Files changed (45) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/LICENSE +9 -0
  3. package/README.md +3 -0
  4. package/components/button/README.md +22 -0
  5. package/components/button/button.njk +46 -0
  6. package/components/button/button.scss +157 -0
  7. package/components/hyperlink/hyperlink.njk +17 -0
  8. package/components/hyperlink/hyperlink.scss +9 -0
  9. package/components/icon-button/README.md +16 -0
  10. package/components/icon-button/icon-button.njk +41 -0
  11. package/components/icon-button/icon-button.scss +112 -0
  12. package/components/text/text-sans.njk +25 -0
  13. package/components/text/text-sans.scss +1 -0
  14. package/foundations/colors.scss +31 -0
  15. package/foundations/fonts.scss +42 -0
  16. package/foundations/helpers/colorMap.scss +15 -0
  17. package/foundations/helpers/fontFamily.scss +11 -0
  18. package/foundations/helpers/spacing.scss +44 -0
  19. package/foundations/helpers/variable.scss +17 -0
  20. package/foundations/icons/icon-sprite.svg +2 -0
  21. package/foundations/icons/icon.njk +83 -0
  22. package/foundations/icons/icon.scss +5 -0
  23. package/foundations/icons/svg/arrow_back.svg +8 -0
  24. package/foundations/icons/svg/arrow_forward.svg +8 -0
  25. package/foundations/icons/svg/check.svg +8 -0
  26. package/foundations/icons/svg/delete.svg +8 -0
  27. package/foundations/icons/svg/favorite-filled.svg +8 -0
  28. package/foundations/icons/svg/favorite.svg +8 -0
  29. package/foundations/icons/svg/headphones-filled.svg +8 -0
  30. package/foundations/icons/svg/headphones.svg +8 -0
  31. package/foundations/icons/svg/home-filled.svg +8 -0
  32. package/foundations/icons/svg/home.svg +8 -0
  33. package/foundations/icons/svg/manage_accounts-filled.svg +8 -0
  34. package/foundations/icons/svg/manage_accounts.svg +8 -0
  35. package/foundations/icons/svg/menu.svg +8 -0
  36. package/foundations/icons/svg/notifications.svg +8 -0
  37. package/foundations/icons/svg/visibility.svg +8 -0
  38. package/foundations/icons/svg/visibility_off.svg +8 -0
  39. package/foundations/typography-sans.scss +43 -0
  40. package/foundations/variables/colorsDnDark.scss +66 -0
  41. package/foundations/variables/colorsDnLight.scss +66 -0
  42. package/foundations/variables/spacingComponent.scss +7 -0
  43. package/foundations/variables/spacingLayout.scss +6 -0
  44. package/foundations/variables/typography.scss +149 -0
  45. package/package.json +18 -0
package/foundations/variables/typography.scss ADDED
@@ -0,0 +1,149 @@
1
+ $typography: (
2
+ DNSans20Bold: (
3
+ fontFamily: "DN Sans 09",
4
+ fontSize: 20,
5
+ lineHeight: 28,
6
+ fontWeight: 700
7
+ ),
8
+ DNSans18: (
9
+ fontFamily: "DN Sans 09",
10
+ fontSize: 18,
11
+ lineHeight: 24,
12
+ fontWeight: 400
13
+ ),
14
+ DNSans18Medium: (
15
+ fontFamily: "DN Sans 09",
16
+ fontSize: 18,
17
+ lineHeight: 24,
18
+ fontWeight: 500
19
+ ),
20
+ DNSans16: (
21
+ fontFamily: "DN Sans 09",
22
+ fontSize: 16,
23
+ lineHeight: 24,
24
+ fontWeight: 400
25
+ ),
26
+ DNSans16Medium: (
27
+ fontFamily: "DN Sans 09",
28
+ fontSize: 16,
29
+ lineHeight: 24,
30
+ fontWeight: 500
31
+ ),
32
+ DNSansLink16: (
33
+ fontFamily: "DN Sans 09",
34
+ fontSize: 16,
35
+ lineHeight: 24,
36
+ fontWeight: 400
37
+ ),
38
+ DNSans14: (
39
+ fontFamily: "DN Sans 09",
40
+ fontSize: 14,
41
+ lineHeight: 20,
42
+ fontWeight: 400
43
+ ),
44
+ DNSans14Medium: (
45
+ fontFamily: "DN Sans 09",
46
+ fontSize: 14,
47
+ lineHeight: 20,
48
+ fontWeight: 500
49
+ ),
50
+ DNSansLink14: (
51
+ fontFamily: "DN Sans 09",
52
+ fontSize: 14,
53
+ lineHeight: 20,
54
+ fontWeight: 400
55
+ ),
56
+ DNSans12: (
57
+ fontFamily: "DN Sans 09",
58
+ fontSize: 12,
59
+ lineHeight: 16,
60
+ fontWeight: 400
61
+ ),
62
+ UIHeadlineLarge: (
63
+ fontFamily: "DN Sans 09",
64
+ fontSize: 20,
65
+ fontWeight: 700,
66
+ lineHeight: 24
67
+ ),
68
+ UIHeadlineSmall: (
69
+ fontFamily: "DN Sans 09",
70
+ fontSize: 16,
71
+ fontWeight: 700,
72
+ lineHeight: 20
73
+ ),
74
+ UISubtitleLargeRegular: (
75
+ fontFamily: "DN Sans 09",
76
+ fontSize: 20,
77
+ fontWeight: 400,
78
+ letterSpacing: -0.2,
79
+ lineHeight: 28
80
+ ),
81
+ UISubtitleLargeBold: (
82
+ fontFamily: "DN Sans 09",
83
+ fontSize: 20,
84
+ fontWeight: 700,
85
+ letterSpacing: -0.2,
86
+ lineHeight: 28
87
+ ),
88
+ UISubtitleSmallRegular: (
89
+ fontFamily: "DN Sans 09",
90
+ fontSize: 16,
91
+ fontWeight: 400,
92
+ lineHeight: 24
93
+ ),
94
+ UISubtitleSmallBold: (
95
+ fontFamily: "DN Sans 09",
96
+ fontSize: 16,
97
+ fontWeight: 700,
98
+ letterSpacing: -0.2,
99
+ lineHeight: 24
100
+ ),
101
+ UIBodyMedium: (
102
+ fontFamily: "DN Sans 09",
103
+ fontSize: 16,
104
+ fontWeight: 500,
105
+ lineHeight: 24
106
+ ),
107
+ UIBodyRegular: (
108
+ fontFamily: "DN Sans 09",
109
+ fontSize: 16,
110
+ fontWeight: 400,
111
+ lineHeight: 24
112
+ ),
113
+ UIInfo: (
114
+ fontFamily: "DN Sans 09",
115
+ fontSize: 14,
116
+ fontWeight: 400,
117
+ lineHeight: 20
118
+ ),
119
+ UILabel: (
120
+ fontFamily: "DN Sans 09",
121
+ fontSize: 12,
122
+ fontWeight: 700,
123
+ letterSpacing: 0.7,
124
+ lineHeight: 16,
125
+ textTransform: uppercase
126
+ ),
127
+ UIMeta: (
128
+ fontFamily: "DN Sans 09",
129
+ fontSize: 12,
130
+ fontWeight: 400,
131
+ letterSpacing: 0.2,
132
+ lineHeight: 16
133
+ ),
134
+ UILink: (
135
+ fontFamily: "DN Sans 09",
136
+ fontSize: 16,
137
+ fontWeight: 400,
138
+ letterSpacing: 0.2,
139
+ lineHeight: 20,
140
+ textDecorationLine: underline
141
+ ),
142
+ UIButtonLarge: (
143
+ fontFamily: "DN Sans 09",
144
+ fontSize: 16,
145
+ fontWeight: 500,
146
+ letterSpacing: 0.4,
147
+ lineHeight: 24
148
+ )
149
+ );
package/package.json ADDED
@@ -0,0 +1,18 @@
1
+ {
2
+ "name": "@bonniernews/dn-design-system-web",
3
+ "version": "0.0.1-alpha.0",
4
+ "description": "DN design system for web.",
5
+ "main": "index.js",
6
+ "homepage": "https://github.com/BonnierNews/dn-design-system/tree/main/web/src#readme",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "git+https://github.com/BonnierNews/dn-design-system.git",
10
+ "directory": "web/src"
11
+ },
12
+ "author": "Bonnier News AB",
13
+ "license": "MIT",
14
+ "scripts": {},
15
+ "bugs": {
16
+ "url": "https://github.com/BonnierNews/dn-design-system/issues"
17
+ }
18
+ }