@helsenorge/designsystem-react 10.2.0 → 10.3.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 (78) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/components/AnchorLink/styles.module.scss +8 -9
  3. package/components/Avatar/styles.module.scss +9 -9
  4. package/components/Badge/styles.module.scss +9 -9
  5. package/components/Button/styles.module.scss +65 -59
  6. package/components/Checkbox/styles.module.scss +103 -103
  7. package/components/Chip/styles.module.scss +22 -22
  8. package/components/Close/styles.module.scss +4 -4
  9. package/components/DictionaryTrigger/styles.module.scss +5 -5
  10. package/components/Drawer/styles.module.scss +16 -16
  11. package/components/Dropdown/styles.module.scss +51 -51
  12. package/components/Duolist/index.js +2 -1
  13. package/components/Duolist/index.js.map +1 -1
  14. package/components/Duolist/styles.module.scss +57 -35
  15. package/components/Duolist/styles.module.scss.d.ts +1 -0
  16. package/components/EmptyState/styles.module.scss +12 -12
  17. package/components/ErrorWrapper/styles.module.scss +11 -21
  18. package/components/ErrorWrapper/styles.module.scss.d.ts +0 -1
  19. package/components/Expander/styles.module.scss +46 -46
  20. package/components/ExpanderHierarchy/expander.module.scss +29 -29
  21. package/components/ExpanderHierarchy/styles.module.scss +4 -5
  22. package/components/ExpanderList/styles.module.scss +30 -30
  23. package/components/EyebrowHeader/styles.module.scss +0 -2
  24. package/components/FormGroup/styles.module.scss +9 -9
  25. package/components/FormLayout/styles.module.scss +4 -5
  26. package/components/HelpBubble/styles.module.scss +13 -13
  27. package/components/HelpPanel/styles.module.scss +2 -2
  28. package/components/HelpQuestion/styles.module.scss +19 -19
  29. package/components/HighlightPanel/styles.module.scss +20 -20
  30. package/components/HorizontalScroll/styles.module.scss +4 -3
  31. package/components/Input/styles.module.scss +12 -12
  32. package/components/Label/styles.module.scss +15 -15
  33. package/components/LinkList/styles.module.scss +33 -33
  34. package/components/ListHeader/styles.module.scss +8 -8
  35. package/components/Loader/styles.module.scss +14 -14
  36. package/components/MaxCharacters/styles.module.scss +11 -11
  37. package/components/Modal/styles.module.scss +34 -34
  38. package/components/NotificationPanel/styles.module.scss +33 -33
  39. package/components/Panel/styles.module.scss +45 -45
  40. package/components/PanelList/styles.module.scss +5 -5
  41. package/components/PopMenu/styles.module.scss +15 -15
  42. package/components/PopOver/styles.module.scss +13 -14
  43. package/components/PopOver/styles.module.scss.d.ts +0 -3
  44. package/components/Progressbar/styles.module.scss +4 -4
  45. package/components/PromoPanel/styles.module.scss +22 -22
  46. package/components/RadioButton/styles.module.scss +99 -99
  47. package/components/Select/styles.module.scss +21 -21
  48. package/components/ServiceMessage/styles.module.scss +49 -49
  49. package/components/SharingStatus/styles.module.scss +13 -13
  50. package/components/Slider/styles.module.scss +24 -24
  51. package/components/Spacer/styles.module.scss +14 -14
  52. package/components/StatusDot/styles.module.scss +22 -22
  53. package/components/Step/styles.module.scss +3 -3
  54. package/components/StepButtons/styles.module.scss +9 -9
  55. package/components/Stepper/styles.module.scss +23 -15
  56. package/components/StickyNote/styles.module.scss +3 -3
  57. package/components/Table/styles.module.scss +32 -32
  58. package/components/Tabs/TabList/styles.module.scss +1 -1
  59. package/components/Tabs/TabPanel/styles.module.scss +5 -5
  60. package/components/Tabs/styles.module.scss +1 -1
  61. package/components/Tag/styles.module.scss +16 -16
  62. package/components/TagList/styles.module.scss +4 -4
  63. package/components/Textarea/styles.module.scss +9 -9
  64. package/components/Tile/styles.module.scss +25 -25
  65. package/components/Title/styles.module.scss +8 -8
  66. package/components/Toggle/styles.module.scss +14 -14
  67. package/components/Tooltip/TooltipWord/styles.module.scss +4 -4
  68. package/components/Trigger/styles.module.scss +21 -21
  69. package/components/Validation/styles.module.scss +10 -10
  70. package/package.json +1 -1
  71. package/scss/_body.scss +5 -6
  72. package/scss/_breakpoints.scss +2 -2
  73. package/scss/_font-mixins.scss +2 -2
  74. package/scss/_fonts.scss +0 -2
  75. package/scss/_input.scss +53 -50
  76. package/scss/_print.scss +2 -2
  77. package/scss/layout.module.scss +2 -2
  78. package/scss/typography.module.scss +44 -43
package/scss/typography.module.scss CHANGED
@@ -1,9 +1,10 @@
1
1
  @use 'sass:map';
2
- @import './spacers';
3
- @import './breakpoints';
2
+ @use './spacers' as spacers;
3
+ @use './palette' as palette;
4
+ @use './font-mixins' as fonts;
5
+ @use './font-settings' as font-settings;
6
+ @use './breakpoints' as *;
4
7
  @import './fonts';
5
- @import './palette';
6
- @import './font-mixins';
7
8
 
8
9
  /*
9
10
  Denne filen er ment til å importeres som en css module:
@@ -12,123 +13,123 @@ import designsystemtypography from './scss/typography.scss'
12
13
  */
13
14
 
14
15
  .title-feature {
15
- @include title-feature;
16
+ @include fonts.title-feature;
16
17
  }
17
18
 
18
19
  .focused-content {
19
- font-size: $font-size-sm;
20
- line-height: $lineheight-size-sm;
20
+ font-size: font-settings.$font-size-sm;
21
+ line-height: font-settings.$lineheight-size-sm;
21
22
  }
22
23
 
23
24
  .title1 {
24
- @include title1;
25
+ @include fonts.title1;
25
26
  }
26
27
 
27
28
  .title2 {
28
- @include title2;
29
+ @include fonts.title2;
29
30
  }
30
31
 
31
32
  .title3 {
32
- @include title3;
33
+ @include fonts.title3;
33
34
  }
34
35
 
35
36
  .title4 {
36
- @include title4;
37
+ @include fonts.title4;
37
38
  }
38
39
 
39
40
  .title5 {
40
- @include title5;
41
+ @include fonts.title5;
41
42
  }
42
43
 
43
44
  .title6 {
44
- @include title6;
45
+ @include fonts.title6;
45
46
  }
46
47
 
47
48
  .body {
48
- @include body;
49
+ @include fonts.body;
49
50
  }
50
51
 
51
52
  .preamble {
52
- @include preamble;
53
+ @include fonts.preamble;
53
54
  }
54
55
 
55
56
  .legend {
56
- @include legend;
57
+ @include fonts.legend;
57
58
  }
58
59
 
59
60
  .label {
60
- @include label;
61
+ @include fonts.label;
61
62
  }
62
63
 
63
64
  .label-subdued {
64
- @include label-subdued;
65
+ @include fonts.label-subdued;
65
66
  }
66
67
 
67
68
  .sublabel {
68
- @include sublabel;
69
+ @include fonts.sublabel;
69
70
  }
70
71
 
71
72
  .sublabel-subdued {
72
- @include sublabel-subdued;
73
+ @include fonts.sublabel-subdued;
73
74
  }
74
75
 
75
76
  .compact-data {
76
- @include compact-data;
77
+ @include fonts.compact-data;
77
78
  }
78
79
 
79
80
  .table-cell {
80
- @include table-cell;
81
+ @include fonts.table-cell;
81
82
  }
82
83
 
83
84
  .strong {
84
- font-size: $font-size-sm;
85
- line-height: $lineheight-size-sm;
85
+ font-size: font-settings.$font-size-sm;
86
+ line-height: font-settings.$lineheight-size-sm;
86
87
 
87
88
  @media (min-width: map.get($grid-breakpoints, md)) {
88
- font-size: $font-size-md;
89
- line-height: $lineheight-size-md;
89
+ font-size: font-settings.$font-size-md;
90
+ line-height: font-settings.$lineheight-size-md;
90
91
  }
91
92
  }
92
93
 
93
94
  .form {
94
- font-size: $font-size-sm;
95
- line-height: $lineheight-size-sm;
95
+ font-size: font-settings.$font-size-sm;
96
+ line-height: font-settings.$lineheight-size-sm;
96
97
 
97
98
  @media (min-width: map.get($grid-breakpoints, md)) {
98
- font-size: $font-size-md;
99
+ font-size: font-settings.$font-size-md;
99
100
  }
100
101
  }
101
102
 
102
103
  .status-timestamp {
103
- @include status-timestamp;
104
+ @include fonts.status-timestamp;
104
105
  }
105
106
 
106
107
  .image-caption {
107
- @include image-caption;
108
+ @include fonts.image-caption;
108
109
  }
109
110
 
110
111
  .image-credit {
111
- @include image-credit;
112
+ @include fonts.image-credit;
112
113
  }
113
114
 
114
115
  .input-text {
115
- @include input-text;
116
+ @include fonts.input-text;
116
117
  }
117
118
 
118
119
  .input-text-large {
119
- @include input-text-large;
120
+ @include fonts.input-text-large;
120
121
  }
121
122
 
122
123
  .text-list {
123
- @include text-list;
124
+ @include fonts.text-list;
124
125
  }
125
126
 
126
127
  .definition-list-type {
127
- @include definition-list-type;
128
+ @include fonts.definition-list-type;
128
129
  }
129
130
 
130
131
  .definition-list-data {
131
- @include definition-list-data;
132
+ @include fonts.definition-list-data;
132
133
  }
133
134
 
134
135
  .anchorlink-wrapper {
@@ -138,24 +139,24 @@ import designsystemtypography from './scss/typography.scss'
138
139
  overflow-wrap: break-word;
139
140
  word-break: break-word;
140
141
  text-align: left;
141
- color: $blueberry600;
142
+ color: palette.$blueberry600;
142
143
  border: 0.15rem solid transparent;
143
144
  text-decoration: underline;
144
145
  text-underline-offset: 0.16rem;
145
- text-decoration-color: $blueberry400;
146
+ text-decoration-color: palette.$blueberry400;
146
147
  text-decoration-thickness: 0.0625rem;
147
148
  padding: 0.1rem;
148
149
 
149
150
  &:hover {
150
151
  cursor: pointer;
151
- color: $blueberry700;
152
- background-color: $blueberry50;
153
- text-decoration-color: $blueberry600;
152
+ color: palette.$blueberry700;
153
+ background-color: palette.$blueberry50;
154
+ text-decoration-color: palette.$blueberry600;
154
155
  }
155
156
 
156
157
  &:focus {
157
158
  outline: none;
158
- border: 0.15rem solid $black;
159
+ border: 0.15rem solid palette.$black;
159
160
  }
160
161
 
161
162
  &[target='_blank'] {