@linzjs/lui 21.44.4 → 21.44.5-1
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/dist/index.js +3 -3
- package/dist/lui.css +6 -149
- package/dist/lui.css.map +1 -1
- package/dist/lui.esm.js +3 -3
- package/dist/scss/Components/ContextMenu/context-menu.scss +4 -7
- package/dist/scss/Components/ExpandingSection/expanding-section.scss +4 -4
- package/dist/scss/Components/Footer/footer.scss +2 -6
- package/dist/scss/Components/Header/header.scss +5 -5
- package/dist/scss/Components/HeaderV2/header-v2.scss +5 -7
- package/dist/scss/Components/HelpSection/help-section.scss +6 -8
- package/dist/scss/Components/LOLCommonMenu/LOLAuthorisedLink.scss +2 -2
- package/dist/scss/Components/LOLCommonMenu/LOLDrawerMenu.scss +3 -3
- package/dist/scss/Components/LOLCommonMenu/LOLFirmSwitcherMenu.scss +1 -2
- package/dist/scss/Components/LuiErrorPage/LuiErrorPage.scss +1 -1
- package/dist/scss/Components/LuiFormElements/LuiRadioInput/LuiRadioInput.scss +3 -3
- package/dist/scss/Components/LuiFormElements/LuiSelectInput/LuiSelectInput.scss +2 -2
- package/dist/scss/Components/LuiFormElements/LuiTextAreaInput/LuiTextAreaInput.scss +6 -4
- package/dist/scss/Components/LuiFormElements/LuiTextInput/LuiTextInput.scss +0 -1
- package/dist/scss/Components/LuiLoadingSpinner/LuiLoadingSpinner.scss +4 -6
- package/dist/scss/Components/LuiMultiSwitch/LuiMultiSwitch.scss +2 -2
- package/dist/scss/Components/LuiSearchInput/LuiSearchInput.scss +1 -5
- package/dist/scss/Components/LuiShadow/LuiShadow.scss +0 -2
- package/dist/scss/Components/LuiSplitButton/LuiSplitButton.scss +6 -7
- package/dist/scss/Components/LuiTabs/LuiTab/LuiTab.scss +6 -7
- package/dist/scss/Components/Menu/menu.scss +4 -4
- package/dist/scss/Components/MenuV2/menu-v2.scss +5 -5
- package/dist/scss/Components/Messaging/messaging.scss +5 -6
- package/dist/scss/Components/Modal/modal.scss +11 -11
- package/dist/scss/Components/Notifications/notifications.scss +4 -4
- package/dist/scss/Elements/Buttons/buttons.scss +6 -8
- package/dist/scss/Elements/Forms/FormComponents/Inputs.scss +5 -7
- package/dist/scss/Elements/Forms/FormComponents/RadiosCheckboxes.scss +6 -7
- package/dist/scss/Elements/Tables/tables.scss +5 -6
- package/dist/scss/Elements/Tooltips/tippy.scss +3 -3
- package/dist/scss/Foundation/Utilities/Placeholder.scss +2 -2
- package/dist/scss/Global/GenericElements/Link.scss +0 -1
- package/dist/scss/Global/GenericElements/Typography.scss +2 -15
- package/dist/scss/Global/helpers.scss +5 -5
- package/dist/scss/Vendor/print.scss +2 -2
- package/package.json +1 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
@use '../../Elements/Buttons/buttons.scss' as buttons;
|
|
2
2
|
@use '../../Foundation/Variables/ColorVars.scss' as colors;
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
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
|
|
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,12 +90,11 @@ 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();
|
|
99
98
|
color: colors.$charcoal;
|
|
100
99
|
margin: 0;
|
|
101
100
|
padding-left: spacing.$unit-lg;
|
|
@@ -1,15 +1,14 @@
|
|
|
1
|
-
@use
|
|
2
|
-
@use
|
|
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
|
|
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;
|
|
13
12
|
display: flex;
|
|
14
13
|
position: relative;
|
|
15
14
|
justify-content: center;
|
|
@@ -24,11 +23,11 @@
|
|
|
24
23
|
width: 100%;
|
|
25
24
|
}
|
|
26
25
|
&--error {
|
|
27
|
-
// Border bottom doesn't cover the grey line underneath,
|
|
26
|
+
// Border bottom doesn't cover the grey line underneath,
|
|
28
27
|
// so adding an after element to be offset by 1px to cover the line in a nice panic red.
|
|
29
28
|
&:after {
|
|
30
29
|
display: block;
|
|
31
|
-
content:
|
|
30
|
+
content: '';
|
|
32
31
|
position: absolute;
|
|
33
32
|
left: 0;
|
|
34
33
|
right: 0;
|
|
@@ -38,7 +37,7 @@
|
|
|
38
37
|
}
|
|
39
38
|
}
|
|
40
39
|
|
|
41
|
-
&:disabled{
|
|
40
|
+
&:disabled {
|
|
42
41
|
cursor: not-allowed;
|
|
43
42
|
color: colors.$disabled-color;
|
|
44
43
|
background: colors.$disabled-bg-color;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
@use
|
|
2
|
-
@use
|
|
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
|
|
5
|
-
@use
|
|
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
|
|
2
|
-
@use
|
|
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
|
|
5
|
-
@use
|
|
6
|
-
@use
|
|
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
|
|
2
|
-
@use
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
5
|
-
@use
|
|
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,7 +15,6 @@
|
|
|
15
15
|
|
|
16
16
|
p {
|
|
17
17
|
margin: 0;
|
|
18
|
-
@include fonts.font-regular;
|
|
19
18
|
}
|
|
20
19
|
|
|
21
20
|
h2 {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
@use
|
|
2
|
-
@use
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
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
|
|
2
|
-
@use
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
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
|
|
1
|
+
@use 'sass:math';
|
|
2
2
|
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
5
|
-
@use
|
|
6
|
-
@use
|
|
7
|
-
@use
|
|
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,7 +215,6 @@ a.lui-button {
|
|
|
215
215
|
colors.$tertiary-active-btn,
|
|
216
216
|
#fff
|
|
217
217
|
);
|
|
218
|
-
@include fonts.font-regular();
|
|
219
218
|
|
|
220
219
|
border: none;
|
|
221
220
|
margin: 2px; //account for the slightly smaller button size;
|
|
@@ -325,7 +324,6 @@ a.lui-button {
|
|
|
325
324
|
// border bottom mimics what we have for text link styling
|
|
326
325
|
//border-bottom: 1px solid;
|
|
327
326
|
text-decoration: underline;
|
|
328
|
-
@include fonts.font-regular();
|
|
329
327
|
// remove the padding and margin off the buttons - used for text only buttons
|
|
330
328
|
padding: 0;
|
|
331
329
|
margin: 0;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
@use
|
|
2
|
-
@use
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
5
|
-
@use
|
|
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,7 +22,6 @@
|
|
|
22
22
|
input:not([type='checkbox']):not([type='radio']),
|
|
23
23
|
textarea,
|
|
24
24
|
select {
|
|
25
|
-
@include fonts.font-regular;
|
|
26
25
|
font-size: $my-font-size;
|
|
27
26
|
color: colors.$input-text;
|
|
28
27
|
border: forms.$input-border-width solid colors.$silver;
|
|
@@ -48,7 +47,6 @@
|
|
|
48
47
|
|
|
49
48
|
select {
|
|
50
49
|
@include appearance(none);
|
|
51
|
-
@include fonts.font-regular;
|
|
52
50
|
cursor: pointer;
|
|
53
51
|
-webkit-font-smoothing: antialiased;
|
|
54
52
|
-moz-osx-font-smoothing: grayscale;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
@use
|
|
2
|
-
@use
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
5
|
-
@use
|
|
6
|
-
@use
|
|
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/Variables/FormVars.scss' as forms;
|
|
6
|
+
@use '../../../Foundation/Utilities/' as *;
|
|
7
7
|
|
|
8
8
|
// All this is now legacy, deprecated styling.
|
|
9
9
|
// In order to access these styles, use a wrapping div with the class LuiDeprecatedForms as close to the desired form/elements as possible
|
|
@@ -36,7 +36,6 @@
|
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
label {
|
|
39
|
-
@include fonts.font-light();
|
|
40
39
|
font-size: fonts.$base-font-size;
|
|
41
40
|
}
|
|
42
41
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
@use
|
|
1
|
+
@use 'sass:math';
|
|
2
2
|
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
5
|
-
@use
|
|
6
|
-
@use
|
|
3
|
+
@use '../../Foundation/Variables/MiscVars.scss' as misc;
|
|
4
|
+
@use '../../Foundation/Variables/ColorVars.scss' as colors;
|
|
5
|
+
@use '../../Foundation/Variables/FontVars.scss' as fonts;
|
|
6
|
+
@use '../../Foundation/Variables/SpacingVars.scss' as spacing;
|
|
7
7
|
|
|
8
8
|
$icon-col-width: math.div(24, 16) * 1rem; // 24px
|
|
9
9
|
|
|
@@ -96,7 +96,6 @@ table {
|
|
|
96
96
|
|
|
97
97
|
.lui-table-column-headers {
|
|
98
98
|
th {
|
|
99
|
-
@include fonts.font-regular;
|
|
100
99
|
}
|
|
101
100
|
}
|
|
102
101
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
@use '../../../scss/Core' as lui;
|
|
2
|
-
@use
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
2
|
+
@use '../../Foundation/Variables/ColorVars.scss' as colors;
|
|
3
|
+
@use '../../Foundation/Variables/FontVars.scss' as fonts;
|
|
4
|
+
@use '../../Foundation/Utilities' as *;
|
|
5
5
|
|
|
6
6
|
.tippy-box {
|
|
7
7
|
@include drop-shadow(sm);
|
|
@@ -3,12 +3,12 @@
|
|
|
3
3
|
// .Input {
|
|
4
4
|
// input {
|
|
5
5
|
// // long way
|
|
6
|
-
//
|
|
6
|
+
// @include placeholder {
|
|
7
7
|
// color: transparent;
|
|
8
8
|
// // whatever else you want here
|
|
9
9
|
// }
|
|
10
10
|
// // Shorthand for just colour
|
|
11
|
-
//
|
|
11
|
+
// @include placeholder(transparent);
|
|
12
12
|
// }
|
|
13
13
|
// }
|
|
14
14
|
|
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
|
|
9
9
|
a {
|
|
10
10
|
color: colors.$txt-link;
|
|
11
|
-
@include fonts.font-regular;
|
|
12
11
|
display: inline-block; // By setting them in inline block they stay together and fixes an issue with REACT adding display block and the borders dropping off.
|
|
13
12
|
position: relative;
|
|
14
13
|
transition: all 0.3s ease(expo-in-out);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
@use '../../Foundation/Variables/FontVars.scss' as fonts;
|
|
2
2
|
@use '../../Foundation/Variables/ColorVars.scss' as colors;
|
|
3
|
-
@use
|
|
4
|
-
@use
|
|
3
|
+
@use '../../Foundation/Variables/SpacingVars.scss' as spacing;
|
|
4
|
+
@use '../../Foundation/Variables/BreakpointVars.scss' as *;
|
|
5
5
|
@use '../../Foundation/Utilities/' as *;
|
|
6
6
|
|
|
7
7
|
////////////////////////////////////////
|
|
@@ -15,7 +15,6 @@
|
|
|
15
15
|
////////////////////////////////////////////
|
|
16
16
|
|
|
17
17
|
html {
|
|
18
|
-
@include fonts.font-light();
|
|
19
18
|
font-size: fonts.$base-font-size;
|
|
20
19
|
line-height: fonts.$base-line-height;
|
|
21
20
|
color: colors.$base-type-color;
|
|
@@ -114,7 +113,6 @@ h6,
|
|
|
114
113
|
|
|
115
114
|
h1,
|
|
116
115
|
.h1 {
|
|
117
|
-
@include fonts.font-light();
|
|
118
116
|
font-size: toRem(44px);
|
|
119
117
|
|
|
120
118
|
& + p {
|
|
@@ -124,7 +122,6 @@ h1,
|
|
|
124
122
|
|
|
125
123
|
h2,
|
|
126
124
|
.h2 {
|
|
127
|
-
@include fonts.font-light();
|
|
128
125
|
font-size: toRem(32px);
|
|
129
126
|
margin-top: spacing.$unit-xl; // 96px
|
|
130
127
|
|
|
@@ -135,7 +132,6 @@ h2,
|
|
|
135
132
|
|
|
136
133
|
h3,
|
|
137
134
|
.h3 {
|
|
138
|
-
@include fonts.font-regular();
|
|
139
135
|
font-size: toRem(26px);
|
|
140
136
|
margin-top: spacing.$unit-lg; // 64px
|
|
141
137
|
|
|
@@ -146,7 +142,6 @@ h3,
|
|
|
146
142
|
|
|
147
143
|
h4,
|
|
148
144
|
.h4 {
|
|
149
|
-
@include fonts.font-regular();
|
|
150
145
|
font-size: toRem(22px);
|
|
151
146
|
margin-top: spacing.$unit-lg; // 64px
|
|
152
147
|
|
|
@@ -173,13 +168,11 @@ h6,
|
|
|
173
168
|
|
|
174
169
|
p,
|
|
175
170
|
.p {
|
|
176
|
-
@include fonts.font-light();
|
|
177
171
|
font-size: toRem(16px);
|
|
178
172
|
margin-top: spacing.$unit-lg; //64px
|
|
179
173
|
}
|
|
180
174
|
|
|
181
175
|
p.lui-small {
|
|
182
|
-
@include fonts.font-light();
|
|
183
176
|
font-size: toRem(13px);
|
|
184
177
|
line-height: toRem(20px);
|
|
185
178
|
margin-top: spacing.$unit-lg; //64px
|
|
@@ -194,7 +187,6 @@ p.lui-small {
|
|
|
194
187
|
.LuiBeta-fonts220222 {
|
|
195
188
|
h1,
|
|
196
189
|
.h1 {
|
|
197
|
-
@include fonts.font-light();
|
|
198
190
|
@include fluidType--size(34px, 44px, $breakpoint-sm, $breakpoint-xl);
|
|
199
191
|
@include fluidType--lineHeight(44px, 52px, $breakpoint-sm, $breakpoint-xl);
|
|
200
192
|
|
|
@@ -205,7 +197,6 @@ p.lui-small {
|
|
|
205
197
|
|
|
206
198
|
h2,
|
|
207
199
|
.h2 {
|
|
208
|
-
@include fonts.font-light();
|
|
209
200
|
@include fluidType--size(28px, 32px, $breakpoint-sm, $breakpoint-xl);
|
|
210
201
|
@include fluidType--lineHeight(36px, 40px, $breakpoint-sm, $breakpoint-xl);
|
|
211
202
|
margin-top: spacing.$unit-xl; // 96px
|
|
@@ -217,7 +208,6 @@ p.lui-small {
|
|
|
217
208
|
|
|
218
209
|
h3,
|
|
219
210
|
.h3 {
|
|
220
|
-
@include fonts.font-regular();
|
|
221
211
|
@include fluidType--size(24px, 24px, $breakpoint-sm, $breakpoint-xl);
|
|
222
212
|
@include fluidType--lineHeight(32px, 32px, $breakpoint-sm, $breakpoint-xl);
|
|
223
213
|
letter-spacing: 0.2px;
|
|
@@ -230,7 +220,6 @@ p.lui-small {
|
|
|
230
220
|
|
|
231
221
|
h4,
|
|
232
222
|
.h4 {
|
|
233
|
-
@include fonts.font-regular();
|
|
234
223
|
@include fluidType--size(20px, 20px, $breakpoint-sm, $breakpoint-xl);
|
|
235
224
|
@include fluidType--lineHeight(24px, 24px, $breakpoint-sm, $breakpoint-xl);
|
|
236
225
|
letter-spacing: 0.2px;
|
|
@@ -262,13 +251,11 @@ p.lui-small {
|
|
|
262
251
|
|
|
263
252
|
p,
|
|
264
253
|
.p {
|
|
265
|
-
@include fonts.font-light();
|
|
266
254
|
font-size: toRem(16px);
|
|
267
255
|
margin-top: spacing.$unit-lg; //64px
|
|
268
256
|
}
|
|
269
257
|
|
|
270
258
|
p.lui-small {
|
|
271
|
-
@include fonts.font-light();
|
|
272
259
|
font-size: toRem(13px);
|
|
273
260
|
line-height: toRem(20px);
|
|
274
261
|
margin-top: spacing.$unit-lg; //64px
|
|
@@ -164,27 +164,27 @@ $lui-width-xl: 620px;
|
|
|
164
164
|
// @include lui-row-divider;
|
|
165
165
|
// &-xs {
|
|
166
166
|
// @media only screen and (max-width: $screen-xs) {
|
|
167
|
-
//
|
|
167
|
+
// @include lui-row-divider;
|
|
168
168
|
// }
|
|
169
169
|
// }
|
|
170
170
|
// &-sm {
|
|
171
171
|
// @media only screen and (min-width: $screen-xs) and (max-width: $screen-sm) {
|
|
172
|
-
//
|
|
172
|
+
// @include lui-row-divider;
|
|
173
173
|
// }
|
|
174
174
|
// }
|
|
175
175
|
// &-md {
|
|
176
176
|
// @media only screen and (min-width: $screen-sm) and (max-width: $screen-md) {
|
|
177
|
-
//
|
|
177
|
+
// @include lui-row-divider;
|
|
178
178
|
// }
|
|
179
179
|
// }
|
|
180
180
|
// &-lg {
|
|
181
181
|
// @media only screen and (min-width: $screen-md) and (max-width: $screen-lg) {
|
|
182
|
-
//
|
|
182
|
+
// @include lui-row-divider;
|
|
183
183
|
// }
|
|
184
184
|
// }
|
|
185
185
|
// &-xl {
|
|
186
186
|
// @media only screen and (min-width: $screen-lg) and (max-width: $screen-xl) {
|
|
187
|
-
//
|
|
187
|
+
// @include lui-row-divider;
|
|
188
188
|
// }
|
|
189
189
|
// }
|
|
190
190
|
// }
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@use
|
|
2
|
-
@use
|
|
1
|
+
@use '../Foundation/Variables/ColorVars.scss' as colors;
|
|
2
|
+
@use '../Foundation/Variables/FontVars.scss' as fonts;
|
|
3
3
|
|
|
4
4
|
@media only screen {
|
|
5
5
|
// Ensure the lui print only is hidden on the screen
|
package/package.json
CHANGED