@linzjs/lui 21.44.5-1 → 21.45.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 (46) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/assets/icons/c_report.svg +1 -0
  3. package/dist/assets/svg-content.d.ts +1 -1
  4. package/dist/assets/svg-content.tsx +9 -0
  5. package/dist/index.js +7 -3
  6. package/dist/index.js.map +1 -1
  7. package/dist/lui.css +149 -6
  8. package/dist/lui.css.map +1 -1
  9. package/dist/lui.esm.js +7 -3
  10. package/dist/lui.esm.js.map +1 -1
  11. package/dist/scss/Components/ContextMenu/context-menu.scss +7 -4
  12. package/dist/scss/Components/ExpandingSection/expanding-section.scss +4 -4
  13. package/dist/scss/Components/Footer/footer.scss +6 -2
  14. package/dist/scss/Components/Header/header.scss +5 -5
  15. package/dist/scss/Components/HeaderV2/header-v2.scss +7 -5
  16. package/dist/scss/Components/HelpSection/help-section.scss +8 -6
  17. package/dist/scss/Components/LOLCommonMenu/LOLAuthorisedLink.scss +2 -2
  18. package/dist/scss/Components/LOLCommonMenu/LOLDrawerMenu.scss +3 -3
  19. package/dist/scss/Components/LOLCommonMenu/LOLFirmSwitcherMenu.scss +2 -1
  20. package/dist/scss/Components/LuiErrorPage/LuiErrorPage.scss +1 -1
  21. package/dist/scss/Components/LuiFormElements/LuiRadioInput/LuiRadioInput.scss +3 -3
  22. package/dist/scss/Components/LuiFormElements/LuiSelectInput/LuiSelectInput.scss +2 -2
  23. package/dist/scss/Components/LuiFormElements/LuiTextAreaInput/LuiTextAreaInput.scss +4 -6
  24. package/dist/scss/Components/LuiFormElements/LuiTextInput/LuiTextInput.scss +1 -0
  25. package/dist/scss/Components/LuiLoadingSpinner/LuiLoadingSpinner.scss +6 -4
  26. package/dist/scss/Components/LuiMultiSwitch/LuiMultiSwitch.scss +2 -2
  27. package/dist/scss/Components/LuiSearchInput/LuiSearchInput.scss +5 -1
  28. package/dist/scss/Components/LuiShadow/LuiShadow.scss +2 -0
  29. package/dist/scss/Components/LuiSplitButton/LuiSplitButton.scss +7 -6
  30. package/dist/scss/Components/LuiTabs/LuiTab/LuiTab.scss +7 -6
  31. package/dist/scss/Components/Menu/menu.scss +4 -4
  32. package/dist/scss/Components/MenuV2/menu-v2.scss +5 -5
  33. package/dist/scss/Components/Messaging/messaging.scss +6 -5
  34. package/dist/scss/Components/Modal/modal.scss +11 -11
  35. package/dist/scss/Components/Notifications/notifications.scss +4 -4
  36. package/dist/scss/Elements/Buttons/buttons.scss +8 -6
  37. package/dist/scss/Elements/Forms/FormComponents/Inputs.scss +7 -5
  38. package/dist/scss/Elements/Forms/FormComponents/RadiosCheckboxes.scss +7 -6
  39. package/dist/scss/Elements/Tables/tables.scss +6 -5
  40. package/dist/scss/Elements/Tooltips/tippy.scss +3 -3
  41. package/dist/scss/Foundation/Utilities/Placeholder.scss +2 -2
  42. package/dist/scss/Global/GenericElements/Link.scss +1 -0
  43. package/dist/scss/Global/GenericElements/Typography.scss +15 -2
  44. package/dist/scss/Global/helpers.scss +5 -5
  45. package/dist/scss/Vendor/print.scss +2 -2
  46. package/package.json +1 -1
@@ -1,7 +1,7 @@
1
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
2
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
3
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
4
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
2
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
3
+ @use "../../Foundation/Variables/SpacingVars.scss"as spacing;
4
+ @use "../../Foundation/Utilities" as *;
5
5
 
6
6
  /**
7
7
  * Here is where we can override the styles of react-menu
@@ -71,6 +71,7 @@ li.lui-select-menuItem {
71
71
  }
72
72
 
73
73
  .lui-select-menuItemText {
74
+ @include fonts.font-regular();
74
75
  color: colors.$charcoal;
75
76
  margin: 0;
76
77
  padding-left: spacing.$unit-lg;
@@ -111,6 +112,7 @@ li.lui-select-menu-group {
111
112
  div[role='menuitem'] {
112
113
  padding: spacing.$unit-xs spacing.$unit-xs spacing.$unit-xs 2.5rem;
113
114
  text-decoration: none;
115
+ @include fonts.font-regular();
114
116
  height: 40px;
115
117
  }
116
118
  //overwrite the hover color
@@ -125,6 +127,7 @@ li.lui-select-menu-group {
125
127
  div[role='menuitem'] {
126
128
  padding-left: 0px;
127
129
  text-decoration: none;
130
+ @include fonts.font-regular();
128
131
  height: 40px;
129
132
  }
130
133
  }
@@ -1,7 +1,7 @@
1
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
2
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
3
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
4
- @use '../../Foundation/Utilities/' as *;
1
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
2
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
3
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
4
+ @use "../../Foundation/Utilities/" as *;
5
5
 
6
6
  .lui {
7
7
  &-expand {
@@ -1,5 +1,5 @@
1
- @use '../../Core' as lui;
2
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Core" as lui;
2
+ @use "../../Foundation/Utilities" as *;
3
3
 
4
4
  // This builds on the NZ Govt footer SCSS which lives in a separate folder
5
5
 
@@ -51,6 +51,7 @@
51
51
  h3,
52
52
  h4 {
53
53
  margin-top: 0;
54
+ @include lui.font-regular;
54
55
  }
55
56
 
56
57
  a {
@@ -194,6 +195,7 @@ $FooterCopyWriteForceLineBreak: toRem(250px);
194
195
  a {
195
196
  color: lui.$snow;
196
197
  font-size: toRem(14px);
198
+ @include lui.font-regular();
197
199
  text-decoration: none;
198
200
  line-height: toRem(24px);
199
201
  &:hover {
@@ -205,6 +207,7 @@ $FooterCopyWriteForceLineBreak: toRem(250px);
205
207
  .luiAppFooter-copyright {
206
208
  color: lui.$snow;
207
209
  font-size: toRem(14px);
210
+ @include lui.font-regular();
208
211
  line-height: toRem(24px);
209
212
  opacity: 0.8;
210
213
  margin: 0;
@@ -220,6 +223,7 @@ $FooterCopyWriteForceLineBreak: toRem(250px);
220
223
  grid-row-start: 1;
221
224
  grid-row-end: -1;
222
225
  }
226
+
223
227
  }
224
228
 
225
229
  .luiAppFooter-linzName {
@@ -1,8 +1,8 @@
1
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
3
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
5
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
3
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
4
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
5
+ @use "../../Foundation/Utilities" as *;
6
6
 
7
7
  $headerRowHeightSm: 60px;
8
8
  $headerRowHeightMd: 85px;
@@ -1,8 +1,8 @@
1
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
3
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
5
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
3
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
4
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
5
+ @use "../../Foundation/Utilities" as *;
6
6
 
7
7
  $headerRowHeightSmV2: 56px;
8
8
  $headerRowHeightMdV2: 85px;
@@ -138,6 +138,7 @@ $headerElementPadding: spacing.$unit-xs;
138
138
  color: colors.$white;
139
139
  font-size: 20px;
140
140
  line-height: 24px;
141
+ @include fonts.font-regular;
141
142
  }
142
143
  }
143
144
  }
@@ -207,6 +208,7 @@ $headerElementPadding: spacing.$unit-xs;
207
208
  text-align: center;
208
209
  border-radius: 4px;
209
210
  padding: 6px 6px;
211
+ @include fonts.font-regular;
210
212
  font-size: 14px;
211
213
  white-space: nowrap;
212
214
 
@@ -1,8 +1,8 @@
1
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
2
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
3
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
4
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
5
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
2
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
3
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
4
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
5
+ @use "../../Foundation/Utilities" as *;
6
6
 
7
7
  .lui-help-section {
8
8
  ol.lui-help-numbering {
@@ -13,7 +13,9 @@
13
13
  counter-increment: lui-list-counter;
14
14
  position: relative;
15
15
  margin: spacing.$unit-xl 0 0 spacing.$unit-xl;
16
-
16
+ p:first-child {
17
+ @include fonts.font-regular;
18
+ }
17
19
  &:before {
18
20
  content: counter(lui-list-counter);
19
21
  position: absolute;
@@ -1,5 +1,5 @@
1
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
2
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
1
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
2
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
3
3
 
4
4
  .LOLAuthorisedLink {
5
5
  & .lui-menu-drawer-option {
@@ -1,7 +1,7 @@
1
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
1
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
3
3
  @use '../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../Foundation/Utilities' as *;
4
+ @use "../../Foundation/Utilities" as *;
5
5
 
6
6
  .LOLDrawerMenu {
7
7
  display: flex;
@@ -1,4 +1,4 @@
1
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
1
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
2
2
  @use '../../Foundation/Variables/FontVars.scss' as fonts;
3
3
 
4
4
  .LOLFirmSwitcherMenu {
@@ -6,6 +6,7 @@
6
6
  padding: 0;
7
7
 
8
8
  &-header {
9
+ @include fonts.font-regular;
9
10
  font-size: fonts.$base-font-size;
10
11
  line-height: 1.3;
11
12
  text-align: right;
@@ -1,5 +1,5 @@
1
1
  @use '../../Core.scss' as lui;
2
- @use '../../Foundation/Utilities' as *;
2
+ @use "../../Foundation/Utilities" as *;
3
3
 
4
4
  $MaxContentWidth: toRem(800px);
5
5
  $MaxImgWidth: toRem(280px);
@@ -2,7 +2,7 @@
2
2
  @use '../../../Foundation/Variables/ColorVars' as colors;
3
3
  @use '../../../Foundation/Variables/SpacingVars' as spacing;
4
4
  @use '../../../Foundation/Utilities/ScreenReadersOnly' as screen;
5
- @use '../../../Foundation/Utilities' as *;
5
+ @use "../../../Foundation/Utilities" as *;
6
6
 
7
7
  .LuiRadioInput-fieldset {
8
8
  border: none;
@@ -74,7 +74,7 @@
74
74
  &:has(input:focus-visible):before {
75
75
  @include focusStyle;
76
76
  }
77
- }
77
+ }
78
78
 
79
79
  .LuiRadioInput--hasError {
80
80
  .LuiRadioInput-label:before {
@@ -145,4 +145,4 @@
145
145
  &:after {
146
146
  background-color: colors.$warning;
147
147
  }
148
- }
148
+ }
@@ -17,6 +17,7 @@
17
17
  }
18
18
 
19
19
  .LuiSelect-select {
20
+ @include fonts.font-regular();
20
21
  margin-bottom: 0;
21
22
  border: 1px solid colors.$silver;
22
23
  border-radius: MiscVars.$borderRadius;
@@ -124,8 +125,7 @@
124
125
  color: colors.$charcoal;
125
126
  }
126
127
 
127
- .LuiSelect-error-icon,
128
- .LuiSelect-warning-icon {
128
+ .LuiSelect-error-icon, .LuiSelect-warning-icon {
129
129
  position: absolute;
130
130
  left: 0;
131
131
  top: 2px;
@@ -19,6 +19,7 @@
19
19
  position: relative;
20
20
 
21
21
  textarea {
22
+ @include fonts.font-regular;
22
23
  @include luiFluidType.fluidType--size(
23
24
  14px,
24
25
  16px,
@@ -52,8 +53,7 @@
52
53
  display: block;
53
54
  }
54
55
 
55
- &.hasError,
56
- &.hasWarning {
56
+ &.hasError, &.hasWarning {
57
57
  .LuiTextAreaInput-wrapper {
58
58
  position: relative;
59
59
 
@@ -107,8 +107,7 @@
107
107
  position: relative;
108
108
  }
109
109
 
110
- .LuiTextAreaInput-error,
111
- .LuiTextAreaInput-warning {
110
+ .LuiTextAreaInput-error, .LuiTextAreaInput-warning {
112
111
  position: relative;
113
112
  display: flex;
114
113
  @include fonts.font-semibold;
@@ -123,8 +122,7 @@
123
122
  color: colors.$error;
124
123
  }
125
124
 
126
- .LuiTextAreaInput-error-icon,
127
- .LuiTextAreaInput-warning-icon {
125
+ .LuiTextAreaInput-error-icon, .LuiTextAreaInput-warning-icon {
128
126
  position: absolute;
129
127
  left: 0;
130
128
  top: 2px;
@@ -64,6 +64,7 @@ $label-line-height: spacing.$unit-md;
64
64
  }
65
65
 
66
66
  .LuiTextInput-input {
67
+ @include fonts.font-regular();
67
68
  @include forms.formPlaceholder;
68
69
  margin-bottom: 0;
69
70
  border: 1px solid colors.$silver;
@@ -13,10 +13,10 @@
13
13
  }
14
14
  .LuiLoadingSpinner-SupportText-container {
15
15
  position: absolute;
16
- top: 0;
17
- bottom: 0;
18
- left: 0;
19
- right: 0;
16
+ top:0;
17
+ bottom:0;
18
+ left:0;
19
+ right:0;
20
20
  display: flex;
21
21
  align-items: center;
22
22
  justify-content: center;
@@ -25,6 +25,7 @@
25
25
  display: flex;
26
26
  flex-direction: column;
27
27
  align-items: center;
28
+ @include fonts.font-regular;
28
29
  color: colors.$sea;
29
30
  width: 300px;
30
31
  // The spinner is nested inside the supporting text version, so we remove the positioning etc
@@ -34,6 +35,7 @@
34
35
  margin: 0;
35
36
  }
36
37
  p {
38
+ @include fonts.font-regular;
37
39
  }
38
40
  }
39
41
  }
@@ -35,8 +35,8 @@
35
35
  &[aria-checked='true'] {
36
36
  background-color: lui.$sea;
37
37
  color: white;
38
- box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.4);
39
- text-shadow: 0 3px 6px rgba(0, 0, 0, 0.4);
38
+ box-shadow: inset 0 3px 6px rgba(0,0,0,.4);
39
+ text-shadow: 0 3px 6px rgba(0,0,0,.4);
40
40
  }
41
41
  }
42
42
 
@@ -49,6 +49,7 @@ $input-wrapper-height-lg: 56px;
49
49
  }
50
50
 
51
51
  .LuiSearchInput-input {
52
+ @include fonts.font-regular();
52
53
  @include forms.formPlaceholder;
53
54
 
54
55
  $input-height: 40px;
@@ -89,7 +90,7 @@ $input-wrapper-height-lg: 56px;
89
90
 
90
91
  &-enabled {
91
92
  svg {
92
- fill: colors.$sea;
93
+ fill: colors.$sea
93
94
  }
94
95
  }
95
96
  }
@@ -124,6 +125,7 @@ $input-wrapper-height-lg: 56px;
124
125
  }
125
126
 
126
127
  .LuiSearchInput-resultEntry {
128
+ @include fonts.font-regular();
127
129
  font-size: 16px;
128
130
  cursor: pointer;
129
131
  padding: 5px 20px;
@@ -137,6 +139,7 @@ $input-wrapper-height-lg: 56px;
137
139
  }
138
140
 
139
141
  .LuiSearchInput-resultHeader {
142
+ @include fonts.font-regular();
140
143
  font-size: 14px;
141
144
  padding: 5px 20px;
142
145
  line-height: 18px;
@@ -145,6 +148,7 @@ $input-wrapper-height-lg: 56px;
145
148
  }
146
149
 
147
150
  .LuiSearchInput-disclaimer {
151
+ @include fonts.font-regular();
148
152
  font-size: 14px;
149
153
  padding: 5px 20px;
150
154
  line-height: 20px;
@@ -23,3 +23,5 @@
23
23
  @include utils.drop-shadow(lg);
24
24
  }
25
25
  }
26
+
27
+
@@ -1,9 +1,9 @@
1
1
  @use '../../Elements/Buttons/buttons.scss' as buttons;
2
2
  @use '../../Foundation/Variables/ColorVars.scss' as colors;
3
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
3
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
4
+ @use "../../Foundation/Variables/SpacingVars.scss"as spacing;
5
5
  @use '../../Foundation/Variables/MiscVars.scss' as misc;
6
- @use '../../Foundation/Utilities' as *;
6
+ @use "../../Foundation/Utilities" as *;
7
7
 
8
8
  .lui-split-button {
9
9
  display: flex;
@@ -57,10 +57,10 @@
57
57
  .lui-expand-icon {
58
58
  color: colors.$sea;
59
59
  }
60
- border-left: 0;
60
+ border-left:0;
61
61
  }
62
62
  &-secondary:hover {
63
- border-left: 0;
63
+ border-left:0;
64
64
  }
65
65
  }
66
66
  }
@@ -90,11 +90,12 @@ li.lui-split-button-menuItem {
90
90
 
91
91
  &:hover {
92
92
  background-color: colors.$polar;
93
- border-right: 1px solid white;
93
+ border-right: 1px solid white ;
94
94
  }
95
95
  }
96
96
 
97
97
  .lui-split-button-menuItemText {
98
+ @include fonts.font-regular();
98
99
  color: colors.$charcoal;
99
100
  margin: 0;
100
101
  padding-left: spacing.$unit-lg;
@@ -1,14 +1,15 @@
1
- @use '../../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../../Foundation/Variables/ColorVars.scss' as colors;
1
+ @use "../../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../../Foundation/Variables/ColorVars.scss" as colors;
3
3
  @use '../../../Foundation/Variables/FontVars.scss' as fonts;
4
4
  @use '../../../Foundation/Variables/SpacingVars.scss' as spacing;
5
- @use '../../../Foundation/Utilities' as *;
5
+ @use "../../../Foundation/Utilities" as *;
6
6
 
7
7
  .LuiTab {
8
8
  background: transparent;
9
9
  border-radius: 0;
10
10
  color: colors.$base-type-color;
11
11
  min-width: spacing.$unit-xxl * 2;
12
+ @include fonts.font-regular;
12
13
  display: flex;
13
14
  position: relative;
14
15
  justify-content: center;
@@ -23,11 +24,11 @@
23
24
  width: 100%;
24
25
  }
25
26
  &--error {
26
- // Border bottom doesn't cover the grey line underneath,
27
+ // Border bottom doesn't cover the grey line underneath,
27
28
  // so adding an after element to be offset by 1px to cover the line in a nice panic red.
28
29
  &:after {
29
30
  display: block;
30
- content: '';
31
+ content: "";
31
32
  position: absolute;
32
33
  left: 0;
33
34
  right: 0;
@@ -37,7 +38,7 @@
37
38
  }
38
39
  }
39
40
 
40
- &:disabled {
41
+ &:disabled{
41
42
  cursor: not-allowed;
42
43
  color: colors.$disabled-color;
43
44
  background: colors.$disabled-bg-color;
@@ -1,8 +1,8 @@
1
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
1
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
3
3
  @use '../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../Foundation/Utilities' as *;
5
- @use '../Header/header.scss' as header;
4
+ @use "../../Foundation/Utilities" as *;
5
+ @use "../Header/header.scss" as header;
6
6
 
7
7
  @mixin menu-container {
8
8
  text-align: left;
@@ -1,9 +1,9 @@
1
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
1
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
3
3
  @use '../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
5
- @use '../../Foundation/Utilities' as *;
6
- @use '../HeaderV2/header-v2.scss' as header;
4
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
5
+ @use "../../Foundation/Utilities" as *;
6
+ @use "../HeaderV2/header-v2.scss" as header;
7
7
 
8
8
  @mixin LuiHeaderMenuV2-drop-content {
9
9
  text-align: left;
@@ -1,8 +1,8 @@
1
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
3
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
5
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
3
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
4
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
5
+ @use "../../Foundation/Utilities" as *;
6
6
 
7
7
  @mixin message-base-styling {
8
8
  border-left: spacing.$unit-xl solid colors.$silver;
@@ -15,6 +15,7 @@
15
15
 
16
16
  p {
17
17
  margin: 0;
18
+ @include fonts.font-regular;
18
19
  }
19
20
 
20
21
  h2 {
@@ -1,7 +1,7 @@
1
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
2
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
3
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
4
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
2
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
3
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
4
+ @use "../../Foundation/Utilities" as *;
5
5
 
6
6
  .lui-modal {
7
7
  padding: spacing.$unit-lg;
@@ -47,7 +47,7 @@
47
47
  }
48
48
  &-header {
49
49
  color: colors.$white;
50
-
50
+
51
51
  &-title {
52
52
  display: flex;
53
53
  justify-content: space-between;
@@ -85,7 +85,7 @@
85
85
  border-radius: 50%;
86
86
  background-color: transparent;
87
87
  text-align: center;
88
- float: right;
88
+ float: right;
89
89
  }
90
90
  &-btn-size {
91
91
  font-size: toRem(32px);
@@ -97,7 +97,7 @@
97
97
  h1 {
98
98
  color: colors.$white;
99
99
  }
100
- path {
100
+ path{
101
101
  fill: rgb(255 255 255 / 70%);
102
102
  }
103
103
  }
@@ -106,7 +106,7 @@
106
106
  h1 {
107
107
  color: colors.$surfie;
108
108
  }
109
- path {
109
+ path{
110
110
  fill: colors.$gray;
111
111
  }
112
112
  }
@@ -123,13 +123,13 @@
123
123
  }
124
124
  }
125
125
 
126
- .lui-modal-header-buttons {
126
+ .lui-modal-header-buttons{
127
127
  padding-left: 12px;
128
128
  display: flex;
129
- button {
129
+ button{
130
130
  padding-left: 8px;
131
131
  padding-right: 0px;
132
- float: none;
132
+ float:none;
133
133
  display: flex;
134
134
  }
135
135
  }
@@ -1,7 +1,7 @@
1
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
2
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
3
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
4
- @use '../../Foundation/Utilities' as *;
1
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
2
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
3
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
4
+ @use "../../Foundation/Utilities" as *;
5
5
 
6
6
  .lui-large-feature-notification {
7
7
  width: 100%;
@@ -1,10 +1,10 @@
1
- @use 'sass:math';
1
+ @use "sass:math";
2
2
 
3
- @use '../../Foundation/Variables/ColorVars.scss' as colors;
4
- @use '../../Foundation/Variables/FontVars.scss' as fonts;
5
- @use '../../Foundation/Variables/MiscVars.scss' as misc;
6
- @use '../../Foundation/Variables/SpacingVars.scss' as spacing;
7
- @use '../../Foundation/Utilities' as *;
3
+ @use "../../Foundation/Variables/ColorVars.scss" as colors;
4
+ @use "../../Foundation/Variables/FontVars.scss" as fonts;
5
+ @use "../../Foundation/Variables/MiscVars.scss" as misc;
6
+ @use "../../Foundation/Variables/SpacingVars.scss" as spacing;
7
+ @use "../../Foundation/Utilities" as *;
8
8
 
9
9
  // button variables only used for this file
10
10
  $strokeWeight: 1px;
@@ -215,6 +215,7 @@ a.lui-button {
215
215
  colors.$tertiary-active-btn,
216
216
  #fff
217
217
  );
218
+ @include fonts.font-regular();
218
219
 
219
220
  border: none;
220
221
  margin: 2px; //account for the slightly smaller button size;
@@ -324,6 +325,7 @@ a.lui-button {
324
325
  // border bottom mimics what we have for text link styling
325
326
  //border-bottom: 1px solid;
326
327
  text-decoration: underline;
328
+ @include fonts.font-regular();
327
329
  // remove the padding and margin off the buttons - used for text only buttons
328
330
  padding: 0;
329
331
  margin: 0;
@@ -1,8 +1,8 @@
1
- @use '../../../Foundation/Variables/ColorVars.scss' as colors;
2
- @use '../../../Foundation/Variables/MiscVars.scss' as misc;
3
- @use '../../../Foundation/Variables/FontVars.scss' as fonts;
4
- @use '../../../Foundation/Variables/FormVars.scss' as forms;
5
- @use '../../../Foundation/Utilities/' as *;
1
+ @use "../../../Foundation/Variables/ColorVars.scss" as colors;
2
+ @use "../../../Foundation/Variables/MiscVars.scss" as misc;
3
+ @use "../../../Foundation/Variables/FontVars.scss" as fonts;
4
+ @use "../../../Foundation/Variables/FormVars.scss" as forms;
5
+ @use "../../../Foundation/Utilities/" as *;
6
6
 
7
7
  // All this is now legacy, deprecated styling.
8
8
  // In order to access these styles, use a wrapping div with the class LuiDeprecatedForms as close to the desired form/elements as possible
@@ -22,6 +22,7 @@
22
22
  input:not([type='checkbox']):not([type='radio']),
23
23
  textarea,
24
24
  select {
25
+ @include fonts.font-regular;
25
26
  font-size: $my-font-size;
26
27
  color: colors.$input-text;
27
28
  border: forms.$input-border-width solid colors.$silver;
@@ -47,6 +48,7 @@
47
48
 
48
49
  select {
49
50
  @include appearance(none);
51
+ @include fonts.font-regular;
50
52
  cursor: pointer;
51
53
  -webkit-font-smoothing: antialiased;
52
54
  -moz-osx-font-smoothing: grayscale;