@zohodesk/dot 1.0.0-temp-76 → 1.0.0-temp-77
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 +5 -0
- package/assets/Appearance/dark/mode/dotDarkMode.module.css +0 -2
- package/assets/Appearance/default/mode/dotDefaultMode.module.css +0 -2
- 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/AttachmentViewer.module.css +27 -82
- 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 +3 -16
- package/es/deprecated/SelectDropdown/SelectDropdown.module.css +3 -11
- package/es/dropdown/ToggleDropDown/ToggleDropDown.js +1 -2
- 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.js +9 -4
- 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.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/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/DepartmentDropDown/DepartmentDropDown.js +1 -1
- package/es/list/DotNew/DotNew.module.css +3 -3
- package/es/list/GridStencils/GridStencils.module.css +19 -71
- 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.js +1 -2
- 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/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 +11 -20
- package/lib/form/fields/TextBoxField/TextBoxField.js +1 -1
- package/lib/form/fields/TextEditor/TextEditor.js +1 -4
- package/lib/form/fields/TextEditor/TextEditor.module.css +2 -13
- package/lib/form/fields/TextareaField/TextareaField.js +1 -1
- 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 +3 -2
- package/lib/AttachmentViewer/Attachment.js +0 -28
- package/lib/AttachmentViewer/AttachmentImage.js +0 -129
- package/lib/AttachmentViewer/AttachmentViewer.js +0 -645
- package/lib/AttachmentViewer/AttachmentViewer.module.css +0 -346
- package/lib/AttachmentViewer/utils.js +0 -134
- package/lib/Provider/Config.js +0 -21
- package/lib/common/dot_animation.module.css +0 -27
- package/lib/common/dot_common.module.css +0 -4
- package/lib/deprecated/utils/General.js +0 -29
|
@@ -2,54 +2,42 @@
|
|
|
2
2
|
position: relative;
|
|
3
3
|
transition: width var(--zd_transition3);
|
|
4
4
|
width: var(--zd_size90);
|
|
5
|
-
}[dir=ltr] .container {
|
|
6
5
|
margin-right: var(--zd_size15);
|
|
7
|
-
}[dir=rtl] .container {
|
|
8
|
-
margin-left: var(--zd_size15);
|
|
9
6
|
}
|
|
10
7
|
.active {
|
|
11
8
|
width: var(--zd_size180);
|
|
12
9
|
}
|
|
13
|
-
.active .input,
|
|
10
|
+
.active .input,
|
|
11
|
+
.input:hover {
|
|
14
12
|
border-bottom-color: var(--zdt_search_input_border);
|
|
15
13
|
}
|
|
16
14
|
.icon {
|
|
17
15
|
position: absolute;
|
|
18
16
|
top: 0;
|
|
17
|
+
right: 0;
|
|
19
18
|
bottom: 0;
|
|
20
19
|
color: var(--zdt_search_icon);
|
|
21
20
|
line-height: var(--zd_size26);
|
|
22
21
|
cursor: pointer;
|
|
23
22
|
}
|
|
24
|
-
[dir=ltr] .icon {
|
|
25
|
-
right: 0;
|
|
26
|
-
}
|
|
27
|
-
[dir=rtl] .icon {
|
|
28
|
-
left: 0;
|
|
29
|
-
}
|
|
30
23
|
.icon:hover {
|
|
31
24
|
color: var(--zdt_search_hover_icon);
|
|
32
25
|
}
|
|
33
26
|
.input {
|
|
27
|
+
border: 0;
|
|
34
28
|
height: var(--zd_size26);
|
|
35
29
|
font-size: var(--zd_font_size13);
|
|
36
30
|
width: 100%;
|
|
37
31
|
letter-spacing: 0.2px;
|
|
32
|
+
border-bottom: 1px solid transparent;
|
|
38
33
|
transition: all var(--zd_transition3) ease;
|
|
39
34
|
color: var(--zdt_search_input_text);
|
|
40
35
|
font-family: var(--zd_regular);
|
|
41
36
|
-webkit-appearance: none;
|
|
42
37
|
-moz-appearance: none;
|
|
43
38
|
appearance: none;
|
|
44
|
-
border: 0;
|
|
45
|
-
border-bottom: 1px solid transparent;
|
|
46
|
-
background: var(--zdt_search_input_bg);
|
|
47
|
-
}
|
|
48
|
-
[dir=ltr] .input {
|
|
49
39
|
padding-right: var(--zd_size20);
|
|
50
|
-
|
|
51
|
-
[dir=rtl] .input {
|
|
52
|
-
padding-left: var(--zd_size20);
|
|
40
|
+
background: var(--zdt_search_input_bg);
|
|
53
41
|
}
|
|
54
42
|
.input::placeholder {
|
|
55
43
|
color: var(--zdt_search_placeholder_text);
|
|
@@ -63,6 +51,7 @@
|
|
|
63
51
|
.input::-ms-placeholder {
|
|
64
52
|
color: var(--zdt_search_placeholder_text);
|
|
65
53
|
}
|
|
66
|
-
.input:focus,
|
|
54
|
+
.input:focus,
|
|
55
|
+
.active .input:focus {
|
|
67
56
|
border-bottom-color: var(--zdt_search_input_focus_border);
|
|
68
57
|
}
|
|
@@ -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
|
}
|