@linzjs/lui 17.9.1 → 17.9.4
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/CHANGELOG.md +6 -0
- package/dist/components/LuiAccordicardStatic/LuiAccordicardStatic.d.ts +8 -0
- package/dist/index.d.ts +2 -1
- package/dist/index.js +23 -10
- package/dist/index.js.map +1 -1
- package/dist/lui.css +75 -2
- package/dist/lui.css.map +1 -1
- package/dist/lui.esm.js +23 -11
- package/dist/lui.esm.js.map +1 -1
- package/dist/scss/Components/LuiAccordicard/LuiAccordicard.scss +17 -6
- package/dist/scss/Components/LuiAccordicardStatic/LuiAccordicardStatic.scss +72 -0
- package/dist/scss/base.scss +47 -46
- package/package.json +1 -1
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
@use '../../Foundation/Variables/FormVars' as forms;
|
|
2
|
-
@use
|
|
3
|
-
@use
|
|
2
|
+
@use '../../Foundation/Variables/MiscVars.scss' as misc;
|
|
3
|
+
@use '../../Foundation/Variables/ColorVars.scss' as colors;
|
|
4
4
|
@use '../../Foundation/Variables/FontVars.scss' as fonts;
|
|
5
5
|
@use '../../Foundation/Variables/SpacingVars.scss' as spacing;
|
|
6
|
-
@use
|
|
6
|
+
@use '../../Foundation/Utilities' as *;
|
|
7
7
|
|
|
8
8
|
.LuiAccordicard {
|
|
9
9
|
@include drop-shadow(sm);
|
|
10
10
|
border-radius: misc.$borderRadius-md;
|
|
11
11
|
display: flex;
|
|
12
12
|
flex-direction: column;
|
|
13
|
-
transition: all 0.3s ease-in-out;
|
|
14
13
|
position: relative;
|
|
15
14
|
padding: spacing.$unit-sm spacing.$unit-rg;
|
|
16
15
|
|
|
@@ -24,10 +23,22 @@
|
|
|
24
23
|
justify-content: space-between;
|
|
25
24
|
width: 100%;
|
|
26
25
|
position: relative;
|
|
26
|
+
padding-right: spacing.$unit-sm * 3;
|
|
27
27
|
}
|
|
28
28
|
|
|
29
29
|
.LuiAccordicard-contentWrapper {
|
|
30
|
-
|
|
30
|
+
overflow: hidden;
|
|
31
|
+
transition: max-height 0.3s ease;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.LuiAccordicard-content {
|
|
35
|
+
will-change: opacity;
|
|
36
|
+
opacity: 0;
|
|
37
|
+
transition: opacity 0.3s ease-in-out 0.2;
|
|
38
|
+
|
|
39
|
+
&--isOpen {
|
|
40
|
+
opacity: 1;
|
|
41
|
+
}
|
|
31
42
|
}
|
|
32
43
|
|
|
33
44
|
.LuiAccordicard-headerContent {
|
|
@@ -58,4 +69,4 @@
|
|
|
58
69
|
&--isOpen {
|
|
59
70
|
transform: rotate(180deg);
|
|
60
71
|
}
|
|
61
|
-
}
|
|
72
|
+
}
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
@use '../../Foundation/Variables/FormVars' as forms;
|
|
2
|
+
@use '../../Foundation/Variables/MiscVars.scss' as misc;
|
|
3
|
+
@use '../../Foundation/Variables/ColorVars.scss' as colors;
|
|
4
|
+
@use '../../Foundation/Variables/FontVars.scss' as fonts;
|
|
5
|
+
@use '../../Foundation/Variables/SpacingVars.scss' as spacing;
|
|
6
|
+
@use '../../Foundation/Utilities' as *;
|
|
7
|
+
|
|
8
|
+
.LuiAccordicardStatic {
|
|
9
|
+
@include drop-shadow(sm);
|
|
10
|
+
border-radius: misc.$borderRadius-md;
|
|
11
|
+
display: flex;
|
|
12
|
+
flex-direction: column;
|
|
13
|
+
position: relative;
|
|
14
|
+
padding: spacing.$unit-sm spacing.$unit-rg;
|
|
15
|
+
|
|
16
|
+
&:not(:first-child) {
|
|
17
|
+
margin-top: spacing.$unit-xs;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.LuiAccordicardStatic-header {
|
|
22
|
+
display: flex;
|
|
23
|
+
justify-content: space-between;
|
|
24
|
+
width: 100%;
|
|
25
|
+
position: relative;
|
|
26
|
+
padding-right: spacing.$unit-sm * 3;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.LuiAccordicardStatic-contentWrapper {
|
|
30
|
+
overflow: hidden;
|
|
31
|
+
transition: max-height 0.3s ease;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.LuiAccordicardStatic-content {
|
|
35
|
+
will-change: opacity;
|
|
36
|
+
opacity: 0;
|
|
37
|
+
transition: opacity 0.3s ease-in-out 0.2;
|
|
38
|
+
|
|
39
|
+
&--isOpen {
|
|
40
|
+
opacity: 1;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.LuiAccordicardStatic-headerContent {
|
|
45
|
+
display: flex;
|
|
46
|
+
align-items: center;
|
|
47
|
+
flex-wrap: wrap;
|
|
48
|
+
column-gap: spacing.$unit-xl;
|
|
49
|
+
row-gap: spacing.$unit-md;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.LuiAccordicardStatic-trigger {
|
|
53
|
+
background: none;
|
|
54
|
+
border: none;
|
|
55
|
+
line-height: 1;
|
|
56
|
+
padding: 0;
|
|
57
|
+
height: spacing.$unit-xl;
|
|
58
|
+
width: spacing.$unit-xl;
|
|
59
|
+
position: absolute;
|
|
60
|
+
top: 3px;
|
|
61
|
+
right: 0;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.LuiAccordicardStatic-chevron {
|
|
65
|
+
transition: all 0.3s ease-in-out;
|
|
66
|
+
transform: rotate(0);
|
|
67
|
+
fill: colors.$sea;
|
|
68
|
+
|
|
69
|
+
&--isOpen {
|
|
70
|
+
transform: rotate(180deg);
|
|
71
|
+
}
|
|
72
|
+
}
|
package/dist/scss/base.scss
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
//////////////////////////////////////////
|
|
2
2
|
// Base
|
|
3
3
|
/////////////////////////////////////////
|
|
4
|
-
@forward
|
|
5
|
-
@forward
|
|
4
|
+
@forward './Vendor/naturalize.scss';
|
|
5
|
+
@forward './Global';
|
|
6
6
|
|
|
7
7
|
//////////////////////////////////////////
|
|
8
8
|
// Globals
|
|
9
9
|
/////////////////////////////////////////
|
|
10
10
|
|
|
11
11
|
// @forward "./Global/foundation.scss";
|
|
12
|
-
@forward
|
|
12
|
+
@forward './Global/helpers.scss';
|
|
13
13
|
// @forward "./Global/print.scss";
|
|
14
14
|
|
|
15
15
|
//////////////////////////////////////////
|
|
@@ -17,22 +17,22 @@
|
|
|
17
17
|
/////////////////////////////////////////
|
|
18
18
|
|
|
19
19
|
// Buttons
|
|
20
|
-
@forward
|
|
20
|
+
@forward './Elements/Buttons/buttons-linz.scss';
|
|
21
21
|
// Load non Lui scss files - these are specific element builds that the UX team have created for their individual needs.
|
|
22
|
-
@forward
|
|
22
|
+
@forward './Elements/Buttons/buttons.scss';
|
|
23
23
|
|
|
24
24
|
// Forms
|
|
25
|
-
@forward
|
|
26
|
-
@forward
|
|
25
|
+
@forward './Elements/Forms/forms.scss';
|
|
26
|
+
@forward './Elements/Forms/plain-form-common.scss';
|
|
27
27
|
|
|
28
28
|
// Icons
|
|
29
|
-
@forward
|
|
29
|
+
@forward './Elements/Icons/icons.scss';
|
|
30
30
|
|
|
31
31
|
//Tables
|
|
32
|
-
@forward
|
|
32
|
+
@forward './Elements/Tables/tables.scss';
|
|
33
33
|
|
|
34
34
|
//Tooltips
|
|
35
|
-
@forward
|
|
35
|
+
@forward './Elements/Tooltips/tippy.scss';
|
|
36
36
|
|
|
37
37
|
//////////////////////////////////////////
|
|
38
38
|
// Components
|
|
@@ -41,46 +41,47 @@
|
|
|
41
41
|
// This is perhaps not ideal - would rather each react component pulled its own css along with it
|
|
42
42
|
// But this works for both html/css and React implementations. It's on the backlog to fix
|
|
43
43
|
|
|
44
|
-
@forward
|
|
45
|
-
@forward
|
|
46
|
-
@forward
|
|
47
|
-
@forward
|
|
48
|
-
@forward
|
|
49
|
-
@forward
|
|
50
|
-
@forward
|
|
51
|
-
@forward
|
|
52
|
-
@forward
|
|
53
|
-
@forward
|
|
54
|
-
@forward
|
|
55
|
-
@forward
|
|
56
|
-
@forward
|
|
57
|
-
@forward
|
|
58
|
-
@forward
|
|
59
|
-
@forward
|
|
60
|
-
@forward
|
|
61
|
-
@forward
|
|
62
|
-
@forward
|
|
63
|
-
@forward
|
|
64
|
-
@forward
|
|
65
|
-
@forward
|
|
66
|
-
@forward
|
|
67
|
-
@forward
|
|
68
|
-
@forward
|
|
69
|
-
@forward
|
|
70
|
-
@forward
|
|
71
|
-
@forward
|
|
72
|
-
@forward
|
|
73
|
-
@forward
|
|
74
|
-
@forward
|
|
75
|
-
@forward
|
|
76
|
-
@forward
|
|
44
|
+
@forward './Components/ContextMenu/context-menu.scss';
|
|
45
|
+
@forward './Components/ExpandingSection/expanding-section.scss';
|
|
46
|
+
@forward './Components/Footer/footer.scss';
|
|
47
|
+
@forward './Components/Header/header.scss';
|
|
48
|
+
@forward './Components/HelpSection/help-section.scss';
|
|
49
|
+
@forward './Components/Menu/menu.scss';
|
|
50
|
+
@forward './Components/Messaging/messaging.scss';
|
|
51
|
+
@forward './Components/Modal/modal.scss';
|
|
52
|
+
@forward './Components/NavDrawer/nav-drawer.scss';
|
|
53
|
+
@forward './Components/Notifications/notifications.scss';
|
|
54
|
+
@forward './Components/Scrim/scrim.scss';
|
|
55
|
+
@forward './Components/LuiError/LuiError.scss';
|
|
56
|
+
@forward './Components/LuiErrorPage/LuiErrorPage.scss';
|
|
57
|
+
@forward './Components/LuiFilterContainer/LuiFilterContainer.scss';
|
|
58
|
+
@forward './Components/LOLCommonMenu/LOLAuthorisedLink.scss';
|
|
59
|
+
@forward './Components/LOLCommonMenu/LOLDrawerMenu.scss';
|
|
60
|
+
@forward './Components/LOLCommonMenu/LOLUserLastLogin.scss';
|
|
61
|
+
@forward './Components/LOLCommonMenu/LOLFirmSwitcherMenu.scss';
|
|
62
|
+
@forward './Components/Spinner/spinner.scss';
|
|
63
|
+
@forward './Components/LuiFormElements/LuiCheckboxInput/LuiCheckboxInput.scss';
|
|
64
|
+
@forward './Components/LuiFormElements/LuiRadioInput/LuiRadioInput.scss';
|
|
65
|
+
@forward './Components/LuiFormElements/LuiSelectInput/LuiSelectInput.scss';
|
|
66
|
+
@forward './Components/LuiFormElements/LuiTextAreaInput/LuiTextAreaInput.scss';
|
|
67
|
+
@forward './Components/LuiFormElements/LuiTextInput/LuiTextInput.scss';
|
|
68
|
+
@forward './Components/LuiSearchInput/LuiSearchInput.scss';
|
|
69
|
+
@forward './Components/LuiSearchBox/LuiSearchBox.scss';
|
|
70
|
+
@forward './Components/LuiForms/LuiComboSelect/LuiComboSelect.scss';
|
|
71
|
+
@forward './Components/LuiFormElements/LuiFileInputBox.scss';
|
|
72
|
+
@forward './Components/LuiFormSection/LuiFormSectionHeader.scss';
|
|
73
|
+
@forward './Components/LuiFormSection/LuiHelpInfo/LuiHelpInfo.scss';
|
|
74
|
+
@forward './Components/LuiShadow/LuiShadow.scss';
|
|
75
|
+
@forward './Components/LuiBadge/LuiBadge.scss';
|
|
76
|
+
@forward './Components/LuiAccordicardStatic/LuiAccordicardStatic.scss';
|
|
77
|
+
@forward './Components/LuiAccordicard/LuiAccordicard.scss';
|
|
77
78
|
|
|
78
79
|
// The following have scss next to the component that is yet to be hooked up with the react implementation
|
|
79
80
|
// LuiTabs
|
|
80
|
-
@forward
|
|
81
|
+
@forward './Components/LuiTabs/LuiTabs.scss';
|
|
81
82
|
|
|
82
83
|
// LuiIcon
|
|
83
|
-
@forward
|
|
84
|
+
@forward './Components/LuiIcon/LuiIcons.scss';
|
|
84
85
|
|
|
85
86
|
// LuiMenuTrigger
|
|
86
|
-
@forward
|
|
87
|
+
@forward './Components/LuiMenuTrigger/LuiMenuTrigger.scss';
|
package/package.json
CHANGED