@zohodesk/dot 1.0.0-temp-71 → 1.0.0-temp-74
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/README.md +4 -0
- package/assets/Appearance/dark/mode/dotDarkMode.module.css +10 -0
- package/assets/Appearance/dark/themes/blue/blueDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/green/greenDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/orange/orangeDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/red/redDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/yellow/yellowDarkDotTheme.module.css +6 -0
- package/assets/Appearance/default/mode/dotDefaultMode.module.css +10 -0
- package/assets/Appearance/default/themes/blue/blueDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/green/greenDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/orange/orangeDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/red/redDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/yellow/yellowDefaultDotTheme.module.css +6 -0
- package/es/ActionButton/ActionButton.module.css +9 -25
- package/es/AlphabeticList/AlphabeticList.module.css +4 -7
- package/es/Attachment/Attachment.module.css +9 -20
- package/es/AttachmentViewer/Attachment.js +17 -0
- package/es/AttachmentViewer/AttachmentImage.js +85 -0
- package/es/AttachmentViewer/AttachmentViewer.js +562 -0
- package/es/AttachmentViewer/AttachmentViewer.module.css +291 -0
- package/es/AttachmentViewer/utils.js +107 -0
- package/es/ChannelIcon/ChannelIcon.module.css +21 -30
- package/es/Drawer/Drawer.module.css +11 -59
- package/es/FlipCard/FlipCard.module.css +5 -14
- package/es/FormAction/FormAction.module.css +9 -34
- package/es/FreezeLayer/FreezeLayer.module.css +2 -6
- package/es/IconButton/IconButton.module.css +1 -1
- package/es/ImportantNotes/ImportantNotes.js +3 -5
- package/es/ImportantNotes/ImportantNotes.module.css +2 -7
- package/es/Loader/Loader.module.css +4 -25
- package/es/Message/Message.module.css +9 -42
- package/es/MessageBanner/MessageBanner.module.css +4 -12
- package/es/NewStar/NewStar.module.css +5 -42
- package/es/ToastMessage/ToastMessage.module.css +25 -96
- package/es/Upload/Upload.module.css +8 -27
- package/es/alert/AlertHeader/AlertHeader.module.css +3 -21
- package/es/alert/AlertLookup/AlertLookup.module.css +2 -6
- package/es/avatar/AvatarClose/AvatarClose.module.css +3 -9
- package/es/avatar/AvatarCollision/AvatarCollision.module.css +4 -18
- package/es/avatar/AvatarIcon/AvatarIcon.module.css +4 -3
- package/es/avatar/AvatarStatus/AvatarStatus.module.css +9 -59
- package/es/avatar/AvatarThread/AvatarThread.module.css +5 -55
- package/es/avatar/AvatarUser/AvatarUser.module.css +10 -81
- package/es/avatar/AvatarWithTeam/AvatarWithTeam.module.css +3 -10
- package/es/common/dot_animation.module.css +14 -0
- package/es/common/dot_common.module.css +4 -0
- package/es/deprecated/SelectDropdown/SelectDropdown.module.css +3 -11
- package/es/dropdown/ToggleDropDown/ToggleDropDown.module.css +6 -19
- package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css +4 -12
- package/es/emptystate/EditionPage/EditionPage.css +3 -9
- package/es/errorstate/EmptyStates.module.css +10 -13
- package/es/errorstate/Inconvenience/Inconvenience.module.css +0 -3
- package/es/errorstate/LinkText/LinkText.module.css +1 -1
- package/es/errorstate/PermissionPlay/PermissionPlay.module.css +2 -2
- package/es/errorstate/WillBack/WillBack.module.css +3 -1
- package/es/form/fields/Fields.module.css +14 -49
- package/es/form/fields/TagsMultiSelect/TagsMultiSelect.module.css +7 -19
- package/es/form/fields/TagsMultiSelectField/TagsMultiSelectField.module.css +1 -4
- package/es/form/fields/TextEditor/TextEditor.js +4 -1
- package/es/form/fields/TextEditor/TextEditor.module.css +72 -149
- package/es/form/fields/TextEditorWrapper/TextEditorWrapper.module.css +2 -13
- package/es/form/fields/ValidationMessage/ValidationMessage.module.css +4 -9
- package/es/form/layout/Field/Field.js +1 -1
- package/es/form/layout/Section/Section.js +3 -7
- package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css +16 -52
- package/es/layout/SubtabLayout/SubtabLayout.module.css +29 -55
- package/es/list/BluePrintStatus/BluePrintStatus.module.css +1 -4
- package/es/list/Comment/Comment.module.css +0 -5
- package/es/list/DotNew/DotNew.module.css +3 -3
- package/es/list/GridStencils/GridStencils.module.css +16 -70
- package/es/list/Icons/Icons.module.css +1 -1
- package/es/list/ListLayout/ListLayout.module.css +14 -22
- package/es/list/ListStencils/ListStencils.module.css +6 -11
- package/es/list/SecondaryText/SecondaryText.module.css +3 -13
- package/es/list/SentimentStatus/SentimentStatus.module.css +1 -4
- package/es/list/TagNew/TagNew.module.css +7 -14
- package/es/list/Thread/Thread.module.css +1 -13
- package/es/list/UserTime/UserTime.module.css +0 -6
- package/es/list/listCommon.module.css +1 -9
- package/es/list/status/StatusDropdown/StatusDropdown.module.css +6 -19
- package/es/list/status/StatusListItem/StatusListItem.module.css +15 -38
- package/es/lookup/Lookup/Lookup.module.css +2 -2
- package/es/lookup/Section/LookupSection.module.css +2 -2
- package/es/lookup/header/Close/LookupClose.module.css +4 -4
- package/es/lookup/header/ModuleHeader/ModuleHeader.js +3 -8
- package/es/lookup/header/Search/LookupSearch.module.css +12 -21
- package/es/lookup/header/TicketHeader/TicketHeader.js +4 -7
- package/es/lookup/header/TicketHeader/TicketHeader.module.css +2 -5
- package/es/lookup/header/ViewDropDown/ViewDropDown.module.css +3 -8
- package/es/lookup/header/lookupHeaderCommon.module.css +5 -21
- package/es/lookup/header/lookupHeaderCommonResponsive.module.css +3 -12
- package/es/setup/header/Button/HeaderButton.module.css +1 -3
- package/es/setup/header/Link/HeaderLink.module.css +1 -7
- package/es/setup/header/Search/Search.module.css +8 -19
- package/es/setup/header/Views/Views.module.css +5 -15
- package/es/setup/helptips/Link/HelpTipsLink.module.css +0 -1
- package/es/setup/helptips/ListGroup/ListGroup.module.css +1 -6
- package/es/setup/table/TableData/SetupTableData.module.css +3 -11
- package/es/setup/table/TableHead/SetupTableHead.module.css +0 -4
- package/es/setup/table/TableRow/SetupTableRow.module.css +2 -6
- package/es/version2/AlertClose/AlertClose.module.css +1 -1
- package/es/version2/GlobalNotification/GlobalNotification.module.css +9 -44
- package/es/version2/lookup/AlertHeader/AlertHeaderNew.module.css +2 -25
- package/es/version2/lookup/AlertLookup/AlertLookupNew.module.css +3 -7
- package/es/version2/lookup/alertLookupCommonNew.module.css +1 -8
- package/es/version2/notification/DesktopNotification/DesktopNotification.module.css +10 -26
- package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +10 -47
- package/images/audio_thumbnail.png +0 -0
- package/lib/ActionButton/ActionButton.module.css +1 -0
- package/lib/FreezeLayer/FreezeLayer.js +4 -31
- package/lib/ImportantNotes/ImportantNotes.js +3 -5
- package/lib/form/fields/CheckBoxField/CheckBoxField.js +1 -1
- package/lib/form/fields/CurrencyField/CurrencyField.js +8 -9
- package/lib/form/fields/DateField/DateField.js +1 -1
- package/lib/form/fields/MultiSelectField/MultiSelectField.js +1 -1
- package/lib/form/fields/PhoneField/PhoneField.js +1 -1
- package/lib/form/fields/RadioField/RadioField.js +1 -1
- package/lib/form/fields/SelectField/SelectField.js +1 -1
- package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.js +4 -7
- package/lib/form/fields/TextBoxField/TextBoxField.js +1 -1
- package/lib/form/fields/TextEditor/TextEditor.module.css +2 -13
- package/lib/form/fields/TextareaField/TextareaField.js +1 -1
- package/lib/form/layout/Field/Field.js +1 -1
- package/lib/form/layout/Section/Section.js +3 -7
- package/lib/list/status/StatusDropdown/StatusDropdown.js +37 -44
- package/lib/lookup/header/ModuleHeader/ModuleHeader.js +3 -8
- package/lib/lookup/header/TicketHeader/TicketHeader.js +4 -7
- package/lib/lookup/header/lookupHeaderCommon.module.css +2 -8
- package/lib/setup/header/Views/Views.js +2 -2
- package/lib/utils/General.js +24 -0
- package/package.json +7 -7
- package/lib/Provider/Config.js +0 -21
- package/lib/deprecated/utils/General.js +0 -29
|
@@ -1,34 +1,24 @@
|
|
|
1
1
|
.container {
|
|
2
2
|
display: inline-block;
|
|
3
|
-
}[dir=ltr] .container {
|
|
4
3
|
margin-right: var(--zd_size15);
|
|
5
|
-
}[dir=rtl] .container {
|
|
6
|
-
margin-left: var(--zd_size15);
|
|
7
4
|
}
|
|
8
5
|
.icon {
|
|
9
6
|
display: inline-block;
|
|
7
|
+
text-align: center;
|
|
8
|
+
cursor: pointer;
|
|
10
9
|
color: var(--zdt_views_icon);
|
|
10
|
+
border: 1px solid var(--zdt_views_border);
|
|
11
11
|
height: var(--zd_size28);
|
|
12
12
|
width: var(--zd_size28);
|
|
13
13
|
line-height: var(--zd_size26);
|
|
14
|
-
text-align: center;
|
|
15
|
-
cursor: pointer;
|
|
16
|
-
border: 1px solid var(--zdt_views_border);
|
|
17
14
|
}
|
|
18
|
-
|
|
15
|
+
.first {
|
|
19
16
|
border-radius: 2px 0 0 2px;
|
|
20
17
|
}
|
|
21
|
-
|
|
22
|
-
border-radius: 0 2px 2px 0;
|
|
23
|
-
}
|
|
24
|
-
[dir=ltr] .last {
|
|
18
|
+
.last {
|
|
25
19
|
border-radius: 0 2px 2px 0;
|
|
26
20
|
border-left-width: 0;
|
|
27
21
|
}
|
|
28
|
-
[dir=rtl] .last {
|
|
29
|
-
border-radius: 2px 0 0 2px;
|
|
30
|
-
border-right-width: 0;
|
|
31
|
-
}
|
|
32
22
|
.icon:hover {
|
|
33
23
|
color: var(--zdt_views_hover_icon);
|
|
34
24
|
}
|
|
@@ -5,15 +5,10 @@
|
|
|
5
5
|
}
|
|
6
6
|
.unOrderData,
|
|
7
7
|
.orderData {
|
|
8
|
+
margin: var(--zd_size15) 0 var(--zd_size15) var(--zd_size7);
|
|
8
9
|
font-size: var(--zd_font_size14);
|
|
9
10
|
color: var(--zdt_listgroup_text);
|
|
10
11
|
}
|
|
11
|
-
[dir=ltr] .unOrderData, [dir=ltr] .orderData {
|
|
12
|
-
margin: var(--zd_size15) 0 var(--zd_size15) var(--zd_size7);
|
|
13
|
-
}
|
|
14
|
-
[dir=rtl] .unOrderData, [dir=rtl] .orderData {
|
|
15
|
-
margin: var(--zd_size15) var(--zd_size7) var(--zd_size15) 0;
|
|
16
|
-
}
|
|
17
12
|
.orderData {
|
|
18
13
|
list-style: decimal;
|
|
19
14
|
}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
.container {
|
|
2
2
|
padding-left: var(--zd_size20);
|
|
3
|
-
}[dir=rtl] .container {
|
|
4
|
-
padding-right: var(--zd_size20);
|
|
5
3
|
}
|
|
6
4
|
.size70 {
|
|
7
5
|
flex-basis: var(--zd_size70);
|
|
@@ -30,15 +28,9 @@
|
|
|
30
28
|
.center {
|
|
31
29
|
text-align: center;
|
|
32
30
|
}
|
|
33
|
-
|
|
31
|
+
.left {
|
|
34
32
|
text-align: left;
|
|
35
33
|
}
|
|
36
|
-
|
|
34
|
+
.right {
|
|
37
35
|
text-align: right;
|
|
38
36
|
}
|
|
39
|
-
[dir=ltr] .right {
|
|
40
|
-
text-align: right;
|
|
41
|
-
}
|
|
42
|
-
[dir=rtl] .right {
|
|
43
|
-
text-align: left;
|
|
44
|
-
}
|
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
.container {
|
|
2
2
|
border-bottom: 1px solid var(--zdt_setuptablehead_border);
|
|
3
|
-
}[dir=ltr] .container {
|
|
4
3
|
padding-right: var(--zd_size40);
|
|
5
4
|
padding-left: var(--zd_size40);
|
|
6
|
-
}[dir=rtl] .container {
|
|
7
|
-
padding-left: var(--zd_size40);
|
|
8
|
-
padding-right: var(--zd_size40);
|
|
9
5
|
}
|
|
10
6
|
.subContainer {
|
|
11
7
|
height: var(--zd_size40);
|
|
@@ -1,13 +1,9 @@
|
|
|
1
1
|
.container {
|
|
2
2
|
position: relative;
|
|
3
|
-
height: var(--zd_size52);
|
|
4
|
-
border-bottom: 1px solid var(--zdt_setuptablerow_border);
|
|
5
|
-
}[dir=ltr] .container {
|
|
6
3
|
margin-right: var(--zd_size40);
|
|
7
4
|
margin-left: var(--zd_size40);
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
margin-right: var(--zd_size40);
|
|
5
|
+
border-bottom: 1px solid var(--zdt_setuptablerow_border);
|
|
6
|
+
height: var(--zd_size52);
|
|
11
7
|
}
|
|
12
8
|
.container:hover {
|
|
13
9
|
background-color: var( --zdt_setuptablerow_hover_bg);
|
|
@@ -11,38 +11,25 @@
|
|
|
11
11
|
top: 0;
|
|
12
12
|
z-index: 1000;
|
|
13
13
|
/*Hook for editor alert*/
|
|
14
|
-
pointer-events: none;
|
|
15
|
-
text-align: center;
|
|
16
|
-
}
|
|
17
|
-
[dir=ltr] .message {
|
|
18
14
|
right: 0;
|
|
15
|
+
text-align: center;
|
|
19
16
|
left: 0;
|
|
20
|
-
|
|
21
|
-
[dir=rtl] .message {
|
|
22
|
-
left: 0;
|
|
23
|
-
right: 0;
|
|
17
|
+
pointer-events: none;
|
|
24
18
|
}
|
|
25
19
|
|
|
26
20
|
.container {
|
|
21
|
+
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
27
22
|
position: relative;
|
|
28
23
|
pointer-events: initial;
|
|
29
|
-
color: var(--globalnotification_text_color);
|
|
30
|
-
max-width: var(--zd_size490);
|
|
31
|
-
composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
32
24
|
box-shadow: 0 4px 20px var(--globalnotification_box_shadow);
|
|
33
25
|
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
34
26
|
background-color: var(--globalnotification_bg_color);
|
|
35
27
|
border-style: solid;
|
|
36
28
|
border-color: var(--commonalert_border_color);
|
|
37
29
|
border-width: 2px 1px 1px 1px;
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
[dir=rtl] .container {
|
|
45
|
-
padding: var(--zd_size18) var(--zd_size75) var(--zd_size19) var(--zd_size70);
|
|
30
|
+
color: var(--globalnotification_text_color);
|
|
31
|
+
max-width: var(--zd_size490);
|
|
32
|
+
composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
46
33
|
}
|
|
47
34
|
|
|
48
35
|
.icon {
|
|
@@ -51,15 +38,8 @@
|
|
|
51
38
|
position: absolute;
|
|
52
39
|
top: 0;
|
|
53
40
|
bottom: 0;
|
|
54
|
-
margin: auto 0;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
[dir=ltr] .icon {
|
|
58
41
|
left: var(--zd_size18);
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
[dir=rtl] .icon {
|
|
62
|
-
right: var(--zd_size18);
|
|
42
|
+
margin: auto 0;
|
|
63
43
|
}
|
|
64
44
|
|
|
65
45
|
.success {
|
|
@@ -96,30 +76,15 @@
|
|
|
96
76
|
font-size: var(--zd_font_size14);
|
|
97
77
|
font-family: var(--zd_semibold);
|
|
98
78
|
composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
|
|
99
|
-
line-height: var(--zd_size20);
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
[dir=ltr] .text {
|
|
103
79
|
text-align: left;
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
[dir=rtl] .text {
|
|
107
|
-
text-align: right;
|
|
80
|
+
line-height: var(--zd_size20);
|
|
108
81
|
}
|
|
109
82
|
|
|
110
83
|
.close {
|
|
111
84
|
position: absolute;
|
|
112
85
|
top: 0;
|
|
113
86
|
bottom: 0;
|
|
114
|
-
height: var(--zd_size25);
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
[dir=ltr] .close {
|
|
118
87
|
right: var(--zd_size12);
|
|
119
88
|
margin: auto 0 auto var(--zd_size25);
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
[dir=rtl] .close {
|
|
123
|
-
left: var(--zd_size12);
|
|
124
|
-
margin: auto var(--zd_size25) auto 0;
|
|
89
|
+
height: var(--zd_size25);
|
|
125
90
|
}
|
|
@@ -11,13 +11,8 @@
|
|
|
11
11
|
}
|
|
12
12
|
.headerLayout {
|
|
13
13
|
min-height: var(--zd_size54);
|
|
14
|
-
}
|
|
15
|
-
[dir=ltr] .headerLayout {
|
|
16
14
|
padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
|
|
17
15
|
}
|
|
18
|
-
[dir=rtl] .headerLayout {
|
|
19
|
-
padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45);
|
|
20
|
-
}
|
|
21
16
|
|
|
22
17
|
.success {
|
|
23
18
|
--commonalert_border_color: var(--zdt_commonalert_success_border);
|
|
@@ -39,14 +34,10 @@
|
|
|
39
34
|
--commonalert_border_color: var(--zdt_commonalert_warning_border);
|
|
40
35
|
}
|
|
41
36
|
|
|
42
|
-
|
|
37
|
+
.extraSmall {
|
|
43
38
|
padding: var(--zd_size12) var(--zd_size45) var(--zd_size12) var(--zd_size16);
|
|
44
39
|
}
|
|
45
40
|
|
|
46
|
-
[dir=rtl] .extraSmall {
|
|
47
|
-
padding: var(--zd_size12) var(--zd_size16) var(--zd_size12) var(--zd_size45);
|
|
48
|
-
}
|
|
49
|
-
|
|
50
41
|
.iconContainer {
|
|
51
42
|
height: var(--zd_size51);
|
|
52
43
|
width: var(--zd_size51);
|
|
@@ -54,6 +45,7 @@
|
|
|
54
45
|
|
|
55
46
|
.title {
|
|
56
47
|
color: var(--zdt_alertlookupnew_text);
|
|
48
|
+
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
57
49
|
font-size: var(--zd_font_size18);
|
|
58
50
|
line-height: var(--zd_size22);
|
|
59
51
|
font-family: var(--zd_bold);
|
|
@@ -61,14 +53,6 @@
|
|
|
61
53
|
vertical-align: middle;
|
|
62
54
|
}
|
|
63
55
|
|
|
64
|
-
[dir=ltr] .title {
|
|
65
|
-
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
[dir=rtl] .title {
|
|
69
|
-
margin: 0 var(--zd_size10) 0 var(--zd_size5);
|
|
70
|
-
}
|
|
71
|
-
|
|
72
56
|
.iconStyle {
|
|
73
57
|
display: block;
|
|
74
58
|
}
|
|
@@ -76,12 +60,5 @@
|
|
|
76
60
|
.close {
|
|
77
61
|
position: absolute;
|
|
78
62
|
top: var(--zd_size12);
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
[dir=ltr] .close {
|
|
82
63
|
right: var(--zd_size12);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
[dir=rtl] .close {
|
|
86
|
-
left: var(--zd_size12);
|
|
87
64
|
}
|
|
@@ -3,21 +3,17 @@
|
|
|
3
3
|
}
|
|
4
4
|
|
|
5
5
|
.innerSection {
|
|
6
|
+
padding: var(--zd_size17) var(--zd_size30) var(--zd_size30);
|
|
6
7
|
color: var(--zdt_alertlookupnew_text);
|
|
7
8
|
font-size: var(--zd_font_size14);
|
|
8
9
|
line-height: var(--zd_size18);
|
|
9
10
|
composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
10
|
-
padding: var(--zd_size17) var(--zd_size30) var(--zd_size30);
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
.buttonGap {
|
|
14
14
|
margin: 0 0 0 var(--zd_size12);
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
[dir=rtl] .buttonGap {
|
|
18
|
-
margin: 0 var(--zd_size12) 0 0;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
17
|
.confirmMsgText {
|
|
22
18
|
margin-top: var(--zd_size20);
|
|
23
19
|
}
|
|
@@ -27,8 +23,8 @@
|
|
|
27
23
|
}
|
|
28
24
|
|
|
29
25
|
.footer {
|
|
30
|
-
overflow: hidden;
|
|
31
26
|
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
27
|
+
overflow: hidden;
|
|
32
28
|
}
|
|
33
29
|
.horizontalScroll, .verticalScroll, .bothScroll {
|
|
34
30
|
height: 100%;
|
|
@@ -2,16 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
.noteContainer {
|
|
4
4
|
padding: var(--zd_size4) var(--zd_size30) 0;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
[dir=ltr] .noteContainer {
|
|
8
5
|
border-left: solid 1px var(--zdt_alertlookup_border);
|
|
9
6
|
}
|
|
10
7
|
|
|
11
|
-
[dir=rtl] .noteContainer {
|
|
12
|
-
border-right: solid 1px var(--zdt_alertlookup_border);
|
|
13
|
-
}
|
|
14
|
-
|
|
15
8
|
.noteTitle {
|
|
16
9
|
font-size: var(--zd_font_size13);
|
|
17
10
|
font-family: var(--zd_semibold);
|
|
@@ -27,7 +20,7 @@
|
|
|
27
20
|
font-size: var(--zd_font_size12);
|
|
28
21
|
/* line-height: var(--zd_size14); */
|
|
29
22
|
color: var(--zdt_alertlookuop_text);
|
|
23
|
+
margin-bottom: var(--zd_size15);
|
|
30
24
|
list-style-type: disc;
|
|
31
25
|
line-height: initial;
|
|
32
|
-
margin-bottom: var(--zd_size15);
|
|
33
26
|
}
|
|
@@ -1,22 +1,17 @@
|
|
|
1
1
|
.parentElement {
|
|
2
|
-
position: relative;
|
|
3
2
|
margin-bottom: var(--zd_size7);
|
|
3
|
+
position: relative;
|
|
4
4
|
}
|
|
5
5
|
.container {
|
|
6
|
+
background-color: var(--zdt_desktopnotification_bg);
|
|
6
7
|
color: var(--zdt_desktopnotification_text);
|
|
7
8
|
transition: all var(--zd_transition4);
|
|
8
9
|
position: relative;
|
|
10
|
+
transform-origin: right center;
|
|
9
11
|
max-height: 100%;
|
|
10
|
-
pointer-events: auto;
|
|
11
|
-
background-color: var(--zdt_desktopnotification_bg);
|
|
12
12
|
box-shadow: 0 4px 20px var(--zdt_desktopnotification_box_shadow);
|
|
13
13
|
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
14
|
-
|
|
15
|
-
[dir=ltr] .container {
|
|
16
|
-
transform-origin: right center;
|
|
17
|
-
}
|
|
18
|
-
[dir=rtl] .container {
|
|
19
|
-
transform-origin: left center;
|
|
14
|
+
pointer-events: auto;
|
|
20
15
|
}
|
|
21
16
|
.globalNotify {
|
|
22
17
|
max-width: var(--zd_size490);
|
|
@@ -32,17 +27,11 @@
|
|
|
32
27
|
/* Animation Style */
|
|
33
28
|
.closeAnimation {
|
|
34
29
|
max-height: 0;
|
|
35
|
-
transition: all var(--zd_transition3) 0.4s;
|
|
36
30
|
margin-bottom: 0;
|
|
31
|
+
transition: all var(--zd_transition3) 0.4s;
|
|
37
32
|
}
|
|
38
33
|
.animation {
|
|
39
34
|
composes: modeForward from '~@zohodesk/components/lib/common/animation.module.css';
|
|
40
|
-
}
|
|
41
|
-
[dir=ltr] .animation {
|
|
42
|
-
animation-duration: var(--zd_transition4);
|
|
43
|
-
-webkit-animation-duration: var(--zd_transition4);
|
|
44
|
-
}
|
|
45
|
-
[dir=rtl] .animation {
|
|
46
35
|
animation-duration: var(--zd_transition4);
|
|
47
36
|
-webkit-animation-duration: var(--zd_transition4);
|
|
48
37
|
}
|
|
@@ -51,8 +40,8 @@
|
|
|
51
40
|
composes: animation;
|
|
52
41
|
}
|
|
53
42
|
.leftnoanimate {
|
|
54
|
-
opacity: 1;
|
|
55
43
|
transform: translateX(0) scale(1);
|
|
44
|
+
opacity: 1;
|
|
56
45
|
}
|
|
57
46
|
.rightanimate {
|
|
58
47
|
composes: slideRight from '~@zohodesk/components/lib/common/animation.module.css';
|
|
@@ -61,20 +50,15 @@
|
|
|
61
50
|
}
|
|
62
51
|
/* Container Style */
|
|
63
52
|
.message {
|
|
53
|
+
padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
|
|
54
|
+
border-top: 1px solid var(--zd_smoke1);
|
|
55
|
+
cursor: pointer;
|
|
64
56
|
position: relative;
|
|
65
57
|
color: var(--zd_smoke18);
|
|
66
58
|
font-size: var(--zd_font_size11);
|
|
67
59
|
composes: dotted textCap from '~@zohodesk/components/lib/common/common.module.css';
|
|
68
60
|
height: var(--zd_size33);
|
|
69
61
|
transition: padding var(--zd_transition3), height var(--zd_transition3);
|
|
70
|
-
border-top: 1px solid var(--zd_smoke1);
|
|
71
|
-
cursor: pointer;
|
|
72
|
-
}
|
|
73
|
-
[dir=ltr] .message {
|
|
74
|
-
padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
|
|
75
|
-
}
|
|
76
|
-
[dir=rtl] .message {
|
|
77
|
-
padding: var(--zd_size10) var(--zd_size76) var(--zd_size10) var(--zd_size20);
|
|
78
62
|
}
|
|
79
63
|
.message:hover {
|
|
80
64
|
background: var(--zd_alabaster);
|
|
@@ -101,6 +85,6 @@
|
|
|
101
85
|
margin-top: var(--zd_size20);
|
|
102
86
|
}
|
|
103
87
|
.footer {
|
|
104
|
-
overflow: hidden;
|
|
105
88
|
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
89
|
+
overflow: hidden;
|
|
106
90
|
}
|
package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css
CHANGED
|
@@ -5,27 +5,20 @@
|
|
|
5
5
|
composes: varClass;
|
|
6
6
|
min-height: var(--zd_size54);
|
|
7
7
|
position: relative;
|
|
8
|
-
color: var(--zdt_desktopnotification_text);
|
|
9
8
|
background-color: var(--alert_lookup_bg_color);
|
|
10
9
|
border-style: solid;
|
|
11
10
|
border-color: var(--commonalert_border_color);
|
|
12
11
|
border-width: 2px 0 0 0;
|
|
12
|
+
color: var(--zdt_desktopnotification_text);
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
.title {
|
|
16
|
+
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
16
17
|
font-size: var(--zd_font_size18);
|
|
17
18
|
line-height: var(--zd_size22);
|
|
18
19
|
font-family: var(--zd_bold);
|
|
19
20
|
composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
20
21
|
}
|
|
21
|
-
|
|
22
|
-
[dir=ltr] .title {
|
|
23
|
-
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
[dir=rtl] .title {
|
|
27
|
-
margin: 0 var(--zd_size10) 0 var(--zd_size5);
|
|
28
|
-
}
|
|
29
22
|
|
|
30
23
|
.infoText {
|
|
31
24
|
font-size: var(--zd_font_size14);
|
|
@@ -57,11 +50,8 @@
|
|
|
57
50
|
|
|
58
51
|
|
|
59
52
|
/* Primary Header */
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
}
|
|
63
|
-
[dir=rtl] .primary {
|
|
64
|
-
padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45);
|
|
53
|
+
.primary {
|
|
54
|
+
padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
|
|
65
55
|
}
|
|
66
56
|
|
|
67
57
|
.primary .iconContainer {
|
|
@@ -76,26 +66,14 @@
|
|
|
76
66
|
.primary .close {
|
|
77
67
|
position: absolute;
|
|
78
68
|
top: var(--zd_size12);
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
[dir=ltr] .primary .close {
|
|
82
|
-
right: var(--zd_size12);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
[dir=rtl] .primary .close {
|
|
86
|
-
left: var(--zd_size12);
|
|
69
|
+
right: var(--zd_size12);
|
|
87
70
|
}
|
|
88
71
|
|
|
89
72
|
/* Secondary Header */
|
|
90
73
|
.secondary {
|
|
91
|
-
|
|
74
|
+
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
92
75
|
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
93
|
-
|
|
94
|
-
[dir=ltr] .secondary {
|
|
95
|
-
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
96
|
-
}
|
|
97
|
-
[dir=rtl] .secondary {
|
|
98
|
-
padding: var(--zd_size18) var(--zd_size75) var(--zd_size19) var(--zd_size70);
|
|
76
|
+
composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
99
77
|
}
|
|
100
78
|
|
|
101
79
|
.secondary .infoText {
|
|
@@ -108,30 +86,15 @@
|
|
|
108
86
|
position: absolute;
|
|
109
87
|
top: 0;
|
|
110
88
|
bottom: 0;
|
|
89
|
+
left: var(--zd_size18);
|
|
111
90
|
margin: auto 0;
|
|
112
91
|
}
|
|
113
92
|
|
|
114
|
-
[dir=ltr] .secondary .iconContainer {
|
|
115
|
-
left: var(--zd_size18);
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
[dir=rtl] .secondary .iconContainer {
|
|
119
|
-
right: var(--zd_size18);
|
|
120
|
-
}
|
|
121
|
-
|
|
122
93
|
.secondary .close {
|
|
123
94
|
position: absolute;
|
|
124
95
|
top: 0;
|
|
125
96
|
bottom: 0;
|
|
97
|
+
right: var(--zd_size12);
|
|
98
|
+
margin: auto 0 auto var(--zd_size25);
|
|
126
99
|
height: var(--zd_size25);
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
[dir=ltr] .secondary .close {
|
|
130
|
-
right: var(--zd_size12);
|
|
131
|
-
margin: auto 0 auto var(--zd_size25);
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
[dir=rtl] .secondary .close {
|
|
135
|
-
left: var(--zd_size12);
|
|
136
|
-
margin: auto var(--zd_size25) auto 0;
|
|
137
100
|
}
|
|
Binary file
|
|
@@ -17,9 +17,9 @@ var _VelocityAnimationGroup = _interopRequireDefault(require("@zohodesk/componen
|
|
|
17
17
|
|
|
18
18
|
var _FreezeLayerModule = _interopRequireDefault(require("./FreezeLayer.module.css"));
|
|
19
19
|
|
|
20
|
-
var
|
|
20
|
+
var _KeyboardApi = require("../utils/KeyboardApi");
|
|
21
21
|
|
|
22
|
-
var
|
|
22
|
+
var _ZindexProvider = require("@zohodesk/components/lib/Provider/ZindexProvider");
|
|
23
23
|
|
|
24
24
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
25
25
|
|
|
@@ -63,29 +63,10 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
|
|
|
63
63
|
isChildActive: false
|
|
64
64
|
};
|
|
65
65
|
_this.getNextIndex = (0, _ZindexProvider.getZIndex)(_assertThisInitialized(_this));
|
|
66
|
-
_this.isFreezeLayerEnabled = false;
|
|
67
66
|
return _this;
|
|
68
67
|
}
|
|
69
68
|
|
|
70
69
|
_createClass(FreezeLayer, [{
|
|
71
|
-
key: "enableFreeze",
|
|
72
|
-
value: function enableFreeze() {
|
|
73
|
-
if (!this.isFreezeLayerEnabled) {
|
|
74
|
-
this.isFreezeLayerEnabled = true;
|
|
75
|
-
var freezeLayerEnable = ((0, _Config.getDotLibraryConfig)('freezeLayer') || {}).enable;
|
|
76
|
-
freezeLayerEnable && freezeLayerEnable();
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
}, {
|
|
80
|
-
key: "disableFreeze",
|
|
81
|
-
value: function disableFreeze() {
|
|
82
|
-
if (this.isFreezeLayerEnabled) {
|
|
83
|
-
this.isFreezeLayerEnabled = false;
|
|
84
|
-
var freezeLayerDisable = ((0, _Config.getDotLibraryConfig)('freezeLayer') || {}).disable;
|
|
85
|
-
freezeLayerDisable && freezeLayerDisable();
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
}, {
|
|
89
70
|
key: "componentDidMount",
|
|
90
71
|
value: function componentDidMount() {
|
|
91
72
|
var isActive = this.props.isActive;
|
|
@@ -94,7 +75,6 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
|
|
|
94
75
|
this.setState({
|
|
95
76
|
isChildActive: true
|
|
96
77
|
});
|
|
97
|
-
this.enableFreeze();
|
|
98
78
|
}
|
|
99
79
|
}
|
|
100
80
|
}, {
|
|
@@ -106,8 +86,7 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
|
|
|
106
86
|
|
|
107
87
|
if (isActive != prevProps.isActive) {
|
|
108
88
|
if (isActive) {
|
|
109
|
-
|
|
110
|
-
|
|
89
|
+
_KeyboardApi.Shortcut && _KeyboardApi.Shortcut.setState(false);
|
|
111
90
|
this.setState({
|
|
112
91
|
isActive: true
|
|
113
92
|
}, function () {
|
|
@@ -116,8 +95,7 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
|
|
|
116
95
|
});
|
|
117
96
|
});
|
|
118
97
|
} else {
|
|
119
|
-
|
|
120
|
-
|
|
98
|
+
_KeyboardApi.Shortcut && _KeyboardApi.Shortcut.setState(true);
|
|
121
99
|
this.setState({
|
|
122
100
|
isChildActive: false
|
|
123
101
|
}, function () {
|
|
@@ -128,11 +106,6 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
|
|
|
128
106
|
}
|
|
129
107
|
}
|
|
130
108
|
}
|
|
131
|
-
}, {
|
|
132
|
-
key: "componentWillUnmount",
|
|
133
|
-
value: function componentWillUnmount() {
|
|
134
|
-
this.disableFreeze();
|
|
135
|
-
}
|
|
136
109
|
}, {
|
|
137
110
|
key: "render",
|
|
138
111
|
value: function render() {
|
|
@@ -59,14 +59,13 @@ var ImportantNotes = /*#__PURE__*/function (_React$Component) {
|
|
|
59
59
|
iconSize = _this$props.iconSize,
|
|
60
60
|
children = _this$props.children,
|
|
61
61
|
iconClass = _this$props.iconClass,
|
|
62
|
-
isCover = _this$props.isCover
|
|
63
|
-
className = _this$props.className;
|
|
62
|
+
isCover = _this$props.isCover;
|
|
64
63
|
return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
|
|
65
64
|
isInline: !isCover,
|
|
66
65
|
isCover: false,
|
|
67
66
|
alignBox: "row",
|
|
68
67
|
align: "top",
|
|
69
|
-
className:
|
|
68
|
+
className: _ImportantNotesModule["default"].section
|
|
70
69
|
}, iconName ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
|
|
71
70
|
className: _ImportantNotesModule["default"].icon,
|
|
72
71
|
align: "start"
|
|
@@ -91,8 +90,7 @@ ImportantNotes.propTypes = {
|
|
|
91
90
|
iconName: _propTypes["default"].string,
|
|
92
91
|
iconSize: _propTypes["default"].string,
|
|
93
92
|
isCover: _propTypes["default"].bool,
|
|
94
|
-
text: _propTypes["default"].string
|
|
95
|
-
className: _propTypes["default"].string
|
|
93
|
+
text: _propTypes["default"].string
|
|
96
94
|
};
|
|
97
95
|
ImportantNotes.defaultProps = {
|
|
98
96
|
iconName: 'ZD-helpCentre',
|
|
@@ -154,7 +154,7 @@ var CheckBoxField = /*#__PURE__*/function (_PureComponent) {
|
|
|
154
154
|
|
|
155
155
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
156
156
|
className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : ''),
|
|
157
|
-
"data-title": isDisabled ? title :
|
|
157
|
+
"data-title": isDisabled ? title : ''
|
|
158
158
|
}, isDirectCol && labelElement, /*#__PURE__*/_react["default"].createElement("div", {
|
|
159
159
|
className: "".concat(isDirectCol ? _FieldsModule["default"].fieldContainer : _FieldsModule["default"].checkboxFieldContainer, " ").concat(isDirectCol && labelName ? _FieldsModule["default"]["fieldMargin_".concat(fieldSize)] : '')
|
|
160
160
|
}, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
|