@progress/kendo-theme-default 11.3.3-dev.0 → 12.0.0-dev.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/all.css +1 -1
- package/dist/default-blue.css +1 -1
- package/dist/default-dataviz-v4.css +1 -1
- package/dist/default-green.css +1 -1
- package/dist/default-main-dark.css +1 -1
- package/dist/default-main.css +1 -1
- package/dist/default-nordic.css +1 -1
- package/dist/default-ocean-blue-a11y.css +1 -1
- package/dist/default-ocean-blue.css +1 -1
- package/dist/default-orange.css +1 -1
- package/dist/default-purple.css +1 -1
- package/dist/default-turquoise.css +1 -1
- package/dist/default-urban.css +1 -1
- package/dist/meta/sassdoc-data.json +9102 -7854
- package/dist/meta/sassdoc-raw-data.json +1053 -478
- package/dist/meta/variables.json +202 -106
- package/lib/swatches/default-blue.json +1 -1
- package/lib/swatches/default-dataviz-v4.json +1 -1
- package/lib/swatches/default-green.json +1 -1
- package/lib/swatches/default-main-dark.json +1 -1
- package/lib/swatches/default-main.json +1 -1
- package/lib/swatches/default-nordic.json +1 -1
- package/lib/swatches/default-ocean-blue-a11y.json +1 -1
- package/lib/swatches/default-ocean-blue.json +1 -1
- package/lib/swatches/default-orange.json +1 -1
- package/lib/swatches/default-purple.json +1 -1
- package/lib/swatches/default-turquoise.json +1 -1
- package/lib/swatches/default-urban.json +1 -1
- package/package.json +4 -4
- package/scss/bubble/_index.scss +16 -0
- package/scss/bubble/_layout.scss +6 -0
- package/scss/bubble/_theme.scss +6 -0
- package/scss/bubble/_variables.scss +93 -0
- package/scss/chat/_index.scss +18 -2
- package/scss/chat/_variables.scss +139 -129
- package/scss/index.scss +4 -0
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
@use "../core/_index.scss" as *;
|
|
2
|
+
@use "../core/functions/index.import.scss" as *;
|
|
3
|
+
|
|
4
|
+
/// The border radius of the Bubble.
|
|
5
|
+
/// @group bubble
|
|
6
|
+
$kendo-bubble-border-radius: k-border-radius(xxl) !default;
|
|
7
|
+
/// The small border radius of the Bubble.
|
|
8
|
+
/// @group bubble
|
|
9
|
+
$kendo-bubble-border-radius-sm: k-border-radius(xs) !default;
|
|
10
|
+
/// The vertical padding of the Bubble.
|
|
11
|
+
/// @group bubble
|
|
12
|
+
$kendo-bubble-padding-y: k-spacing(2) !default;
|
|
13
|
+
/// The horizontal padding of the Bubble.
|
|
14
|
+
/// @group bubble
|
|
15
|
+
$kendo-bubble-padding-x: k-spacing(3) !default;
|
|
16
|
+
/// The border width of the Bubble.
|
|
17
|
+
/// @group bubble
|
|
18
|
+
$kendo-bubble-border-width: 1px !default;
|
|
19
|
+
/// The border style of the Bubble.
|
|
20
|
+
/// @group bubble
|
|
21
|
+
$kendo-bubble-border-style: solid !default;
|
|
22
|
+
/// The line height of the Bubble.
|
|
23
|
+
/// @group bubble
|
|
24
|
+
$kendo-bubble-line-height: var( --kendo-line-height, normal ) !default;
|
|
25
|
+
|
|
26
|
+
/// The text color of the Bubble.
|
|
27
|
+
/// @group bubble
|
|
28
|
+
$kendo-bubble-text: k-color(on-app-surface) !default;
|
|
29
|
+
/// The background color of the Bubble.
|
|
30
|
+
/// @group bubble
|
|
31
|
+
$kendo-bubble-bg: k-color(base-subtle) !default;
|
|
32
|
+
/// The border color of the Bubble.
|
|
33
|
+
/// @group bubble
|
|
34
|
+
$kendo-bubble-border: $kendo-bubble-bg !default;
|
|
35
|
+
/// The shadow of the Bubble.
|
|
36
|
+
/// @group bubble
|
|
37
|
+
$kendo-bubble-shadow: none !default;
|
|
38
|
+
|
|
39
|
+
/// The background color of the hover Bubble.
|
|
40
|
+
/// @group bubble
|
|
41
|
+
$kendo-bubble-hover-bg: k-color(base-subtle-hover) !default;
|
|
42
|
+
/// The border color of the active Bubble.
|
|
43
|
+
/// @group bubble
|
|
44
|
+
$kendo-bubble-hover-border: $kendo-bubble-hover-bg !default;
|
|
45
|
+
/// The background color of the active Bubble.
|
|
46
|
+
/// @group bubble
|
|
47
|
+
$kendo-bubble-active-bg: k-color(base-subtle-active) !default;
|
|
48
|
+
/// The border color of the active Bubble.
|
|
49
|
+
/// @group bubble
|
|
50
|
+
$kendo-bubble-active-border: $kendo-bubble-active-bg !default;
|
|
51
|
+
/// The background color of the focused Bubble.
|
|
52
|
+
/// @group bubble
|
|
53
|
+
$kendo-bubble-focus-bg: k-color(base-subtle) !default;
|
|
54
|
+
/// The border color of the focused Bubble.
|
|
55
|
+
/// @group bubble
|
|
56
|
+
$kendo-bubble-focus-border: $kendo-bubble-focus-bg !default;
|
|
57
|
+
/// The box shadow of the focused Bubble.
|
|
58
|
+
/// @group bubble
|
|
59
|
+
$kendo-bubble-focus-shadow: 0 0 0 2px color-mix(in srgb, k-color(on-app-surface) 8%, transparent) !default;
|
|
60
|
+
|
|
61
|
+
/// The spacing between content and icon in expandable Bubble.
|
|
62
|
+
/// @group bubble
|
|
63
|
+
$kendo-bubble-expandable-spacing: $kendo-bubble-padding-x !default;
|
|
64
|
+
/// The horizontal padding of the expandable Bubble icon.
|
|
65
|
+
/// @group bubble
|
|
66
|
+
$kendo-bubble-expandable-icon-padding-x: k-spacing(2.5) !default;
|
|
67
|
+
/// The vertical padding of the expandable Bubble icon.
|
|
68
|
+
/// @group bubble
|
|
69
|
+
$kendo-bubble-expandable-icon-padding-y: k-spacing(2.5) !default;
|
|
70
|
+
|
|
71
|
+
@forward "@progress/kendo-theme-core/scss/components/bubble/_variables.scss" with (
|
|
72
|
+
$kendo-bubble-border-radius: $kendo-bubble-border-radius,
|
|
73
|
+
$kendo-bubble-border-radius-sm: $kendo-bubble-border-radius-sm,
|
|
74
|
+
$kendo-bubble-padding-y: $kendo-bubble-padding-y,
|
|
75
|
+
$kendo-bubble-padding-x: $kendo-bubble-padding-x,
|
|
76
|
+
$kendo-bubble-border-width: $kendo-bubble-border-width,
|
|
77
|
+
$kendo-bubble-border-style: $kendo-bubble-border-style,
|
|
78
|
+
$kendo-bubble-line-height: $kendo-bubble-line-height,
|
|
79
|
+
$kendo-bubble-text: $kendo-bubble-text,
|
|
80
|
+
$kendo-bubble-bg: $kendo-bubble-bg,
|
|
81
|
+
$kendo-bubble-border: $kendo-bubble-border,
|
|
82
|
+
$kendo-bubble-shadow: $kendo-bubble-shadow,
|
|
83
|
+
$kendo-bubble-hover-bg: $kendo-bubble-hover-bg,
|
|
84
|
+
$kendo-bubble-hover-border: $kendo-bubble-hover-border,
|
|
85
|
+
$kendo-bubble-active-bg: $kendo-bubble-active-bg,
|
|
86
|
+
$kendo-bubble-active-border: $kendo-bubble-active-border,
|
|
87
|
+
$kendo-bubble-focus-bg: $kendo-bubble-focus-bg,
|
|
88
|
+
$kendo-bubble-focus-border: $kendo-bubble-focus-border,
|
|
89
|
+
$kendo-bubble-focus-shadow: $kendo-bubble-focus-shadow,
|
|
90
|
+
$kendo-bubble-expandable-spacing: $kendo-bubble-expandable-spacing,
|
|
91
|
+
$kendo-bubble-expandable-icon-padding-x: $kendo-bubble-expandable-icon-padding-x,
|
|
92
|
+
$kendo-bubble-expandable-icon-padding-y: $kendo-bubble-expandable-icon-padding-y,
|
|
93
|
+
);
|
package/scss/chat/_index.scss
CHANGED
|
@@ -1,9 +1,17 @@
|
|
|
1
1
|
// Dependencies
|
|
2
2
|
@use "../core/_index.scss" as *;
|
|
3
3
|
@use "../icons/_index.scss" as *;
|
|
4
|
-
@use "../
|
|
4
|
+
@use "../textarea/_index.scss" as *;
|
|
5
5
|
@use "../card/_index.scss" as *;
|
|
6
|
+
@use "../appbar/_index.scss" as *;
|
|
6
7
|
@use "../toolbar/_index.scss" as *;
|
|
8
|
+
@use "../bubble/_index.scss" as *;
|
|
9
|
+
@use "../upload/_index.scss" as *;
|
|
10
|
+
@use "../dropzone/_index.scss" as *;
|
|
11
|
+
@use "../avatar/_index.scss" as *;
|
|
12
|
+
@use "../speech-to-text-button/_index.scss" as *;
|
|
13
|
+
@use "../suggestion/_index.scss" as *;
|
|
14
|
+
@use "../skeleton/_index.scss" as *;
|
|
7
15
|
|
|
8
16
|
// Component
|
|
9
17
|
@forward "./_variables.scss";
|
|
@@ -14,10 +22,18 @@
|
|
|
14
22
|
@mixin kendo-chat--styles() {
|
|
15
23
|
@include import-once( "chat" ) {
|
|
16
24
|
@include core-styles();
|
|
17
|
-
@include kendo-
|
|
25
|
+
@include kendo-textarea--styles();
|
|
18
26
|
@include kendo-card--styles();
|
|
19
27
|
@include kendo-icon--styles();
|
|
28
|
+
@include kendo-appbar--styles();
|
|
20
29
|
@include kendo-toolbar--styles();
|
|
30
|
+
@include kendo-bubble--styles();
|
|
31
|
+
@include kendo-suggestion--styles();
|
|
32
|
+
@include kendo-skeleton--styles();
|
|
33
|
+
@include kendo-upload--styles();
|
|
34
|
+
@include kendo-dropzone--styles();
|
|
35
|
+
@include kendo-avatar--styles();
|
|
36
|
+
@include kendo-speech-to-text-button--styles();
|
|
21
37
|
@include kendo-chat--layout();
|
|
22
38
|
@include kendo-chat--theme();
|
|
23
39
|
}
|
|
@@ -10,10 +10,10 @@ $kendo-chat-padding-x: k-spacing(4) !default;
|
|
|
10
10
|
/// The vertical padding of the Chat.
|
|
11
11
|
/// @group chat
|
|
12
12
|
$kendo-chat-padding-y: k-spacing(4) !default;
|
|
13
|
-
/// The width of the Chat.
|
|
13
|
+
/// The minimum width of the Chat.
|
|
14
14
|
/// @group chat
|
|
15
|
-
$kendo-chat-width:
|
|
16
|
-
/// The height of the Chat.
|
|
15
|
+
$kendo-chat-width: 320px !default;
|
|
16
|
+
/// The minimum height of the Chat.
|
|
17
17
|
/// @group chat
|
|
18
18
|
$kendo-chat-height: 600px !default;
|
|
19
19
|
/// The border width of the Chat.
|
|
@@ -29,13 +29,17 @@ $kendo-chat-font-size: var( --kendo-font-size, inherit ) !default;
|
|
|
29
29
|
/// @group chat
|
|
30
30
|
$kendo-chat-line-height: var( --kendo-line-height, normal ) !default;
|
|
31
31
|
|
|
32
|
-
/// The horizontal spacing between the items of the Chat.
|
|
33
|
-
/// @group chat
|
|
34
|
-
$kendo-chat-item-spacing-x: k-spacing(2) !default;
|
|
35
32
|
/// The vertical spacing between the items of the Chat.
|
|
36
33
|
/// @group chat
|
|
37
34
|
$kendo-chat-item-spacing-y: k-spacing(4) !default;
|
|
38
35
|
|
|
36
|
+
/// The maximum width of the Chat message.
|
|
37
|
+
/// @group chat
|
|
38
|
+
$kendo-chat-message-max-width: min(75%, 460px) !default;
|
|
39
|
+
/// The spacing between the items of the Chat message.
|
|
40
|
+
/// @group chat
|
|
41
|
+
$kendo-chat-message-gap: k-spacing(2) !default;
|
|
42
|
+
|
|
39
43
|
/// The horizontal padding of the Chat message list.
|
|
40
44
|
/// @group chat
|
|
41
45
|
$kendo-chat-message-list-padding-x: $kendo-chat-padding-x !default;
|
|
@@ -46,6 +50,10 @@ $kendo-chat-message-list-padding-y: $kendo-chat-padding-y !default;
|
|
|
46
50
|
/// @group chat
|
|
47
51
|
$kendo-chat-message-list-spacing: $kendo-chat-item-spacing-y !default;
|
|
48
52
|
|
|
53
|
+
/// The spacing between the icon and text in the Chat message status.
|
|
54
|
+
/// @group chat
|
|
55
|
+
$kendo-chat-message-status-gap: k-spacing(1) !default;
|
|
56
|
+
|
|
49
57
|
/// The font size of the Chat timestamp.
|
|
50
58
|
/// @group chat
|
|
51
59
|
$kendo-chat-timestamp-font-size: var( --kendo-font-size-sm, inherit ) !default;
|
|
@@ -54,13 +62,19 @@ $kendo-chat-timestamp-font-size: var( --kendo-font-size-sm, inherit ) !default;
|
|
|
54
62
|
$kendo-chat-timestamp-line-height: var( --kendo-line-height-lg, normal ) !default;
|
|
55
63
|
/// The text transform of the Chat timestamp.
|
|
56
64
|
/// @group chat
|
|
57
|
-
$kendo-chat-timestamp-transform:
|
|
65
|
+
$kendo-chat-timestamp-transform: none !default;
|
|
58
66
|
/// The text color of the Chat timestamp.
|
|
59
67
|
/// @group chat
|
|
60
68
|
$kendo-chat-timestamp-text: k-color(subtle) !default;
|
|
61
69
|
/// The background color of the Chat timestamp.
|
|
62
70
|
/// @group chat
|
|
63
71
|
$kendo-chat-timestamp-bg: null !default;
|
|
72
|
+
/// The background color of the Chat timestamp separator.
|
|
73
|
+
/// @group chat
|
|
74
|
+
$kendo-chat-timestamp-separator-bg: k-color(border) !default;
|
|
75
|
+
/// The spacing between the Chat timestamp and its separator.
|
|
76
|
+
/// @group chat
|
|
77
|
+
$kendo-chat-timestamp-separator-spacing: k-spacing(1) !default;
|
|
64
78
|
|
|
65
79
|
/// The font size of the Chat message meta text.
|
|
66
80
|
/// @group chat
|
|
@@ -74,41 +88,16 @@ $kendo-chat-message-meta-line-height: var( --kendo-line-height-lg, normal ) !def
|
|
|
74
88
|
$kendo-chat-author-font-size: var( --kendo-font-size-sm, inherit ) !default;
|
|
75
89
|
/// The line height of the Chat author text.
|
|
76
90
|
/// @group chat
|
|
77
|
-
$kendo-chat-author-line-height: var( --kendo-line-height-
|
|
78
|
-
|
|
79
|
-
/// The horizontal padding of the Chat bubble message.
|
|
80
|
-
/// @group chat
|
|
81
|
-
$kendo-chat-bubble-padding-x: k-spacing(3) !default;
|
|
82
|
-
/// The vertical padding of the Chat bubble message.
|
|
83
|
-
/// @group chat
|
|
84
|
-
$kendo-chat-bubble-padding-y: k-spacing(2) !default;
|
|
85
|
-
/// The spacing of the Chat bubble message.
|
|
86
|
-
/// @group chat
|
|
87
|
-
$kendo-chat-bubble-spacing: k-spacing(0.5) !default;
|
|
88
|
-
/// The line height of the Chat bubble message.
|
|
89
|
-
/// @group chat
|
|
90
|
-
$kendo-chat-bubble-line-height: var( --kendo-line-height, normal ) !default;
|
|
91
|
+
$kendo-chat-author-line-height: var( --kendo-line-height-xs, normal ) !default;
|
|
91
92
|
|
|
92
|
-
/// The
|
|
93
|
+
/// The text color of the Chat status.
|
|
93
94
|
/// @group chat
|
|
94
|
-
$kendo-chat-
|
|
95
|
-
/// The border radius of the Chat small bubble message
|
|
96
|
-
/// @group chat
|
|
97
|
-
$kendo-chat-bubble-border-radius-sm: 2px !default;
|
|
95
|
+
$kendo-chat-status-text: k-color(subtle) !default;
|
|
98
96
|
|
|
99
|
-
/// The
|
|
100
|
-
/// @group chat
|
|
101
|
-
$kendo-chat-avatar-size: 32px !default;
|
|
102
|
-
/// The spacing of the Chat Avatar.
|
|
97
|
+
/// The spacing of the Chat bubble message.
|
|
103
98
|
/// @group chat
|
|
104
|
-
$kendo-chat-
|
|
99
|
+
$kendo-chat-bubble-spacing: k-spacing(2) !default;
|
|
105
100
|
|
|
106
|
-
/// The horizontal padding of the Chat Toolbar.
|
|
107
|
-
/// @group chat
|
|
108
|
-
$kendo-chat-toolbar-padding-x: $kendo-toolbar-md-padding-x !default;
|
|
109
|
-
/// The vertical padding of the Chat Toolbar.
|
|
110
|
-
/// @group chat
|
|
111
|
-
$kendo-chat-toolbar-padding-y: $kendo-toolbar-md-padding-y !default;
|
|
112
101
|
/// The background color of the Chat Toolbar.
|
|
113
102
|
/// @group chat
|
|
114
103
|
$kendo-chat-toolbar-bg: $kendo-toolbar-bg !default;
|
|
@@ -119,20 +108,6 @@ $kendo-chat-toolbar-text: $kendo-toolbar-text !default;
|
|
|
119
108
|
/// @group chat
|
|
120
109
|
$kendo-chat-toolbar-border: inherit !default;
|
|
121
110
|
|
|
122
|
-
/// The horizontal padding of the Chat quick reply.
|
|
123
|
-
/// @group chat
|
|
124
|
-
$kendo-chat-quick-reply-padding-x: k-spacing(3) !default;
|
|
125
|
-
/// The vertical padding of the Chat quick reply.
|
|
126
|
-
/// @group chat
|
|
127
|
-
$kendo-chat-quick-reply-padding-y: k-spacing(2) !default;
|
|
128
|
-
/// The spacing of the Chat quick reply.
|
|
129
|
-
/// @group chat
|
|
130
|
-
$kendo-chat-quick-reply-spacing: k-spacing(2) !default;
|
|
131
|
-
/// The line height of the Chat quick reply.
|
|
132
|
-
/// @group chat
|
|
133
|
-
$kendo-chat-quick-reply-line-height: $kendo-chat-bubble-line-height !default;
|
|
134
|
-
|
|
135
|
-
|
|
136
111
|
/// The background color of the Chat.
|
|
137
112
|
/// @group chat
|
|
138
113
|
$kendo-chat-bg: k-color(surface) !default;
|
|
@@ -143,24 +118,9 @@ $kendo-chat-text: k-color(on-app-surface) !default;
|
|
|
143
118
|
/// @group chat
|
|
144
119
|
$kendo-chat-border: k-color(border) !default;
|
|
145
120
|
|
|
146
|
-
/// The
|
|
147
|
-
/// @group chat
|
|
148
|
-
$kendo-chat-bubble-bg: k-color(surface-alt) !default;
|
|
149
|
-
/// The text color of the Chat bubble.
|
|
150
|
-
/// @group chat
|
|
151
|
-
$kendo-chat-bubble-text: k-color(on-app-surface) !default;
|
|
152
|
-
/// The border color of the Chat bubble.
|
|
153
|
-
/// @group chat
|
|
154
|
-
$kendo-chat-bubble-border: $kendo-chat-bubble-bg !default;
|
|
155
|
-
/// The box shadow of the Chat bubble.
|
|
121
|
+
/// The color of the typing indicator dots.
|
|
156
122
|
/// @group chat
|
|
157
|
-
$kendo-chat-
|
|
158
|
-
/// The shadow of the hovered Chat bubble.
|
|
159
|
-
/// @group chat
|
|
160
|
-
$kendo-chat-bubble-hover-shadow: k-elevation(2) !default;
|
|
161
|
-
/// The shadow of the selected Chat bubble.
|
|
162
|
-
/// @group chat
|
|
163
|
-
$kendo-chat-bubble-selected-shadow: k-elevation(3) !default;
|
|
123
|
+
$kendo-chat-typing-indicator-text: k-color(base-on-subtle) !default;
|
|
164
124
|
|
|
165
125
|
/// The background color of the Chat alt bubble.
|
|
166
126
|
/// @group chat
|
|
@@ -173,50 +133,98 @@ $kendo-chat-alt-bubble-text: k-color(on-primary) !default;
|
|
|
173
133
|
$kendo-chat-alt-bubble-border: $kendo-chat-alt-bubble-bg !default;
|
|
174
134
|
/// The shadow of the Chat alt bubble.
|
|
175
135
|
/// @group chat
|
|
176
|
-
$kendo-chat-alt-bubble-shadow:
|
|
177
|
-
/// The
|
|
136
|
+
$kendo-chat-alt-bubble-shadow: none !default;
|
|
137
|
+
/// The background color of the hovered alt Bubble.
|
|
138
|
+
/// @group bubble
|
|
139
|
+
$kendo-chat-alt-bubble-hover-bg: k-color(primary-hover) !default;
|
|
140
|
+
/// The border color of the hovered alt Bubble.
|
|
141
|
+
/// @group bubble
|
|
142
|
+
$kendo-chat-alt-bubble-hover-border: $kendo-chat-alt-bubble-hover-bg !default;
|
|
143
|
+
/// The background color of the active Bubble.
|
|
144
|
+
/// @group bubble
|
|
145
|
+
$kendo-chat-alt-bubble-active-bg: k-color(primary-active) !default;
|
|
146
|
+
/// The border color of the active alt Bubble.
|
|
147
|
+
/// @group bubble
|
|
148
|
+
$kendo-chat-alt-bubble-active-border: $kendo-chat-alt-bubble-active-bg !default;
|
|
149
|
+
/// The background color of the focused alt Bubble.
|
|
150
|
+
/// @group bubble
|
|
151
|
+
$kendo-chat-alt-bubble-focus-bg: $kendo-chat-alt-bubble-bg !default;
|
|
152
|
+
/// The border color of the focused alt Bubble.
|
|
153
|
+
/// @group bubble
|
|
154
|
+
$kendo-chat-alt-bubble-focus-border: $kendo-chat-alt-bubble-focus-bg !default;
|
|
155
|
+
/// The box shadow of the focused alt Bubble.
|
|
156
|
+
/// @group bubble
|
|
157
|
+
$kendo-chat-alt-bubble-focus-shadow: 0 0 0 2px color-mix(in srgb, k-color(primary) 16%, transparent) !default;
|
|
158
|
+
|
|
159
|
+
/// The width of a file in the Chat Textarea.
|
|
178
160
|
/// @group chat
|
|
179
|
-
$kendo-chat-
|
|
180
|
-
/// The
|
|
161
|
+
$kendo-chat-file-width: 240px !default;
|
|
162
|
+
/// The horizontal padding of the Chat file.
|
|
181
163
|
/// @group chat
|
|
182
|
-
$kendo-chat-
|
|
183
|
-
|
|
184
|
-
/// The background color of the Chat quick reply.
|
|
164
|
+
$kendo-chat-file-padding-x: k-spacing(2) !default;
|
|
165
|
+
/// The vertical padding of the Chat file.
|
|
185
166
|
/// @group chat
|
|
186
|
-
$kendo-chat-
|
|
187
|
-
/// The
|
|
167
|
+
$kendo-chat-file-padding-y: k-spacing(2) !default;
|
|
168
|
+
/// The spacing between the elements of the Chat file.
|
|
188
169
|
/// @group chat
|
|
189
|
-
$kendo-chat-
|
|
190
|
-
|
|
170
|
+
$kendo-chat-file-gap: k-spacing(1) !default;
|
|
171
|
+
|
|
172
|
+
/// The border width of the Chat file.
|
|
191
173
|
/// @group chat
|
|
192
|
-
$kendo-chat-
|
|
174
|
+
$kendo-chat-file-border-width: 1px !default;
|
|
175
|
+
/// The border style of the Chat file.
|
|
176
|
+
/// @group chat
|
|
177
|
+
$kendo-chat-file-border-style: solid !default;
|
|
193
178
|
|
|
194
|
-
/// The background color of the
|
|
179
|
+
/// The background color of the Chat file.
|
|
180
|
+
/// @group chat
|
|
181
|
+
$kendo-chat-file-bg: k-color(base-subtle) !default;
|
|
182
|
+
/// The text color of the Chat file.
|
|
183
|
+
/// @group chat
|
|
184
|
+
$kendo-chat-file-text: k-color(base-on-subtle) !default;
|
|
185
|
+
/// The border color of the Chat file.
|
|
195
186
|
/// @group chat
|
|
196
|
-
$kendo-chat-
|
|
197
|
-
/// The
|
|
187
|
+
$kendo-chat-file-border: $kendo-chat-file-bg !default;
|
|
188
|
+
/// The border-radius of the Chat file.
|
|
189
|
+
/// @group chat
|
|
190
|
+
$kendo-chat-file-border-radius: k-border-radius(md) !default;
|
|
191
|
+
|
|
192
|
+
/// The horizontal padding of the file download wrapper.
|
|
198
193
|
/// @group chat
|
|
199
|
-
$kendo-chat-
|
|
200
|
-
/// The
|
|
194
|
+
$kendo-chat-file-download-padding-x: k-spacing(2) !default;
|
|
195
|
+
/// The vertical padding of the file download wrapper.
|
|
201
196
|
/// @group chat
|
|
202
|
-
$kendo-chat-
|
|
197
|
+
$kendo-chat-file-download-padding-y: k-spacing(2) !default;
|
|
203
198
|
|
|
204
|
-
/// The
|
|
199
|
+
/// The border width of the Chat pinned message;
|
|
205
200
|
/// @group chat
|
|
206
|
-
$kendo-chat-
|
|
207
|
-
/// The
|
|
201
|
+
$kendo-chat-message-pinned-border-width: 1px !default;
|
|
202
|
+
/// The border style of the Chat pinned message;
|
|
208
203
|
/// @group chat
|
|
209
|
-
$kendo-chat-
|
|
210
|
-
/// The
|
|
204
|
+
$kendo-chat-message-pinned-border-style: solid !default;
|
|
205
|
+
/// The border color of the Chat pinned message;
|
|
211
206
|
/// @group chat
|
|
212
|
-
$kendo-chat-
|
|
207
|
+
$kendo-chat-message-pinned-border-color: k-color(border) !default;
|
|
213
208
|
|
|
214
|
-
/// The
|
|
209
|
+
/// The horizontal padding of the Chat message reference.
|
|
210
|
+
/// @group chat
|
|
211
|
+
$kendo-chat-message-reference-padding-x: k-spacing(2) !default;
|
|
212
|
+
/// The vertical padding of the Chat message reference.
|
|
213
|
+
/// @group chat
|
|
214
|
+
$kendo-chat-message-reference-padding-y: k-spacing(2) !default;
|
|
215
|
+
|
|
216
|
+
/// The background color of the Chat message reference.
|
|
217
|
+
/// @group chat
|
|
218
|
+
$kendo-chat-message-reference-bg: k-color(surface) !default;
|
|
219
|
+
/// The text color of the Chat message reference.
|
|
220
|
+
/// @group chat
|
|
221
|
+
$kendo-chat-message-reference-text: k-color(on-app-surface) !default;
|
|
222
|
+
/// The background color of the message reference marker.
|
|
215
223
|
/// @group chat
|
|
216
|
-
$kendo-chat-
|
|
217
|
-
/// The
|
|
224
|
+
$kendo-chat-message-reference-marker-bg: k-color(base-emphasis) !default;
|
|
225
|
+
/// The background color of the message reference alt marker.
|
|
218
226
|
/// @group chat
|
|
219
|
-
$kendo-chat-
|
|
227
|
+
$kendo-chat-message-reference-marker-alt-bg: k-color(primary-emphasis) !default;
|
|
220
228
|
|
|
221
229
|
@forward "@progress/kendo-theme-core/scss/components/chat/_variables.scss" with (
|
|
222
230
|
$kendo-chat-padding-x: $kendo-chat-padding-x,
|
|
@@ -227,61 +235,63 @@ $kendo-chat-typing-indicator-dot-spacing: 5px !default;
|
|
|
227
235
|
$kendo-chat-font-family: $kendo-chat-font-family,
|
|
228
236
|
$kendo-chat-font-size: $kendo-chat-font-size,
|
|
229
237
|
$kendo-chat-line-height: $kendo-chat-line-height,
|
|
230
|
-
$kendo-chat-item-spacing-x: $kendo-chat-item-spacing-x,
|
|
231
238
|
$kendo-chat-item-spacing-y: $kendo-chat-item-spacing-y,
|
|
239
|
+
$kendo-chat-message-max-width: $kendo-chat-message-max-width,
|
|
240
|
+
$kendo-chat-message-gap: $kendo-chat-message-gap,
|
|
232
241
|
$kendo-chat-message-list-padding-x: $kendo-chat-message-list-padding-x,
|
|
233
242
|
$kendo-chat-message-list-padding-y: $kendo-chat-message-list-padding-y,
|
|
234
243
|
$kendo-chat-message-list-spacing: $kendo-chat-message-list-spacing,
|
|
244
|
+
$kendo-chat-message-status-gap: $kendo-chat-message-status-gap,
|
|
235
245
|
$kendo-chat-timestamp-font-size: $kendo-chat-timestamp-font-size,
|
|
236
246
|
$kendo-chat-timestamp-line-height: $kendo-chat-timestamp-line-height,
|
|
237
247
|
$kendo-chat-timestamp-transform: $kendo-chat-timestamp-transform,
|
|
238
248
|
$kendo-chat-timestamp-text: $kendo-chat-timestamp-text,
|
|
239
249
|
$kendo-chat-timestamp-bg: $kendo-chat-timestamp-bg,
|
|
250
|
+
$kendo-chat-timestamp-separator-bg: $kendo-chat-timestamp-separator-bg,
|
|
251
|
+
$kendo-chat-timestamp-separator-spacing: $kendo-chat-timestamp-separator-spacing,
|
|
240
252
|
$kendo-chat-message-meta-font-size: $kendo-chat-message-meta-font-size,
|
|
241
253
|
$kendo-chat-message-meta-line-height: $kendo-chat-message-meta-line-height,
|
|
242
254
|
$kendo-chat-author-font-size: $kendo-chat-author-font-size,
|
|
243
255
|
$kendo-chat-author-line-height: $kendo-chat-author-line-height,
|
|
244
|
-
$kendo-chat-
|
|
245
|
-
$kendo-chat-bubble-padding-y: $kendo-chat-bubble-padding-y,
|
|
256
|
+
$kendo-chat-status-text: $kendo-chat-status-text,
|
|
246
257
|
$kendo-chat-bubble-spacing: $kendo-chat-bubble-spacing,
|
|
247
|
-
$kendo-chat-bubble-line-height: $kendo-chat-bubble-line-height,
|
|
248
|
-
$kendo-chat-bubble-border-radius: $kendo-chat-bubble-border-radius,
|
|
249
|
-
$kendo-chat-bubble-border-radius-sm: $kendo-chat-bubble-border-radius-sm,
|
|
250
|
-
$kendo-chat-avatar-size: $kendo-chat-avatar-size,
|
|
251
|
-
$kendo-chat-avatar-spacing: $kendo-chat-avatar-spacing,
|
|
252
|
-
$kendo-chat-toolbar-padding-x: $kendo-chat-toolbar-padding-x,
|
|
253
|
-
$kendo-chat-toolbar-padding-y: $kendo-chat-toolbar-padding-y,
|
|
254
258
|
$kendo-chat-toolbar-bg: $kendo-chat-toolbar-bg,
|
|
255
259
|
$kendo-chat-toolbar-text: $kendo-chat-toolbar-text,
|
|
256
260
|
$kendo-chat-toolbar-border: $kendo-chat-toolbar-border,
|
|
257
|
-
$kendo-chat-quick-reply-padding-x: $kendo-chat-quick-reply-padding-x,
|
|
258
|
-
$kendo-chat-quick-reply-padding-y: $kendo-chat-quick-reply-padding-y,
|
|
259
|
-
$kendo-chat-quick-reply-spacing: $kendo-chat-quick-reply-spacing,
|
|
260
|
-
$kendo-chat-quick-reply-line-height: $kendo-chat-quick-reply-line-height,
|
|
261
261
|
$kendo-chat-bg: $kendo-chat-bg,
|
|
262
262
|
$kendo-chat-text: $kendo-chat-text,
|
|
263
263
|
$kendo-chat-border: $kendo-chat-border,
|
|
264
|
-
$kendo-chat-bubble-bg: $kendo-chat-bubble-bg,
|
|
265
|
-
$kendo-chat-bubble-text: $kendo-chat-bubble-text,
|
|
266
|
-
$kendo-chat-bubble-border: $kendo-chat-bubble-border,
|
|
267
|
-
$kendo-chat-bubble-shadow: $kendo-chat-bubble-shadow,
|
|
268
|
-
$kendo-chat-bubble-hover-shadow: $kendo-chat-bubble-hover-shadow,
|
|
269
|
-
$kendo-chat-bubble-selected-shadow: $kendo-chat-bubble-selected-shadow,
|
|
270
264
|
$kendo-chat-alt-bubble-bg: $kendo-chat-alt-bubble-bg,
|
|
271
265
|
$kendo-chat-alt-bubble-text: $kendo-chat-alt-bubble-text,
|
|
272
266
|
$kendo-chat-alt-bubble-border: $kendo-chat-alt-bubble-border,
|
|
273
267
|
$kendo-chat-alt-bubble-shadow: $kendo-chat-alt-bubble-shadow,
|
|
274
|
-
$kendo-chat-alt-bubble-hover-
|
|
275
|
-
$kendo-chat-alt-bubble-
|
|
276
|
-
$kendo-chat-
|
|
277
|
-
$kendo-chat-
|
|
278
|
-
$kendo-chat-
|
|
279
|
-
$kendo-chat-
|
|
280
|
-
$kendo-chat-
|
|
281
|
-
$kendo-chat-
|
|
282
|
-
$kendo-chat-
|
|
283
|
-
$kendo-chat-
|
|
284
|
-
$kendo-chat-
|
|
285
|
-
$kendo-chat-
|
|
286
|
-
$kendo-chat-
|
|
268
|
+
$kendo-chat-alt-bubble-hover-bg: $kendo-chat-alt-bubble-hover-bg,
|
|
269
|
+
$kendo-chat-alt-bubble-hover-border: $kendo-chat-alt-bubble-hover-border,
|
|
270
|
+
$kendo-chat-alt-bubble-active-bg: $kendo-chat-alt-bubble-active-bg,
|
|
271
|
+
$kendo-chat-alt-bubble-active-border: $kendo-chat-alt-bubble-active-border,
|
|
272
|
+
$kendo-chat-alt-bubble-focus-bg: $kendo-chat-alt-bubble-focus-bg,
|
|
273
|
+
$kendo-chat-alt-bubble-focus-border: $kendo-chat-alt-bubble-focus-border,
|
|
274
|
+
$kendo-chat-alt-bubble-focus-shadow: $kendo-chat-alt-bubble-focus-shadow,
|
|
275
|
+
$kendo-chat-typing-indicator-text: $kendo-chat-typing-indicator-text,
|
|
276
|
+
$kendo-chat-file-width: $kendo-chat-file-width,
|
|
277
|
+
$kendo-chat-file-padding-x: $kendo-chat-file-padding-x,
|
|
278
|
+
$kendo-chat-file-padding-y: $kendo-chat-file-padding-y,
|
|
279
|
+
$kendo-chat-file-gap: $kendo-chat-file-gap,
|
|
280
|
+
$kendo-chat-file-border-width: $kendo-chat-file-border-width,
|
|
281
|
+
$kendo-chat-file-border-style: $kendo-chat-file-border-style,
|
|
282
|
+
$kendo-chat-file-bg: $kendo-chat-file-bg,
|
|
283
|
+
$kendo-chat-file-text: $kendo-chat-file-text,
|
|
284
|
+
$kendo-chat-file-border: $kendo-chat-file-border,
|
|
285
|
+
$kendo-chat-file-border-radius: $kendo-chat-file-border-radius,
|
|
286
|
+
$kendo-chat-file-download-padding-x: $kendo-chat-file-download-padding-x,
|
|
287
|
+
$kendo-chat-file-download-padding-y: $kendo-chat-file-download-padding-y,
|
|
288
|
+
$kendo-chat-message-pinned-border-width: $kendo-chat-message-pinned-border-width,
|
|
289
|
+
$kendo-chat-message-pinned-border-style: $kendo-chat-message-pinned-border-style,
|
|
290
|
+
$kendo-chat-message-pinned-border-color: $kendo-chat-message-pinned-border-color,
|
|
291
|
+
$kendo-chat-message-reference-padding-x: $kendo-chat-message-reference-padding-x,
|
|
292
|
+
$kendo-chat-message-reference-padding-y: $kendo-chat-message-reference-padding-y,
|
|
293
|
+
$kendo-chat-message-reference-bg: $kendo-chat-message-reference-bg,
|
|
294
|
+
$kendo-chat-message-reference-text: $kendo-chat-message-reference-text,
|
|
295
|
+
$kendo-chat-message-reference-marker-bg: $kendo-chat-message-reference-marker-bg,
|
|
296
|
+
$kendo-chat-message-reference-marker-alt-bg: $kendo-chat-message-reference-marker-alt-bg,
|
|
287
297
|
);
|
package/scss/index.scss
CHANGED
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
@forward "./virtual-scroller/_index.scss";
|
|
17
17
|
@forward "./no-data/_index.scss";
|
|
18
18
|
@forward "./suggestion/_index.scss";
|
|
19
|
+
@forward "./bubble/_index.scss";
|
|
19
20
|
@forward "./avatar/_index.scss";
|
|
20
21
|
@forward "./badge/_index.scss";
|
|
21
22
|
@forward "./color-preview/_index.scss";
|
|
@@ -24,6 +25,7 @@
|
|
|
24
25
|
@forward "./time-marker/_index.scss";
|
|
25
26
|
@forward "./tooltip/_index.scss";
|
|
26
27
|
@forward "./button/_index.scss";
|
|
28
|
+
@forward "./speech-to-text-button/_index.scss";
|
|
27
29
|
@forward "./input/_index.scss";
|
|
28
30
|
@forward "./floating-label/_index.scss";
|
|
29
31
|
@forward "./textbox/_index.scss";
|
|
@@ -145,6 +147,7 @@
|
|
|
145
147
|
@use "./virtual-scroller/_index.scss" as *;
|
|
146
148
|
@use "./no-data/_index.scss" as *;
|
|
147
149
|
@use "./suggestion/_index.scss" as *;
|
|
150
|
+
@use "./bubble/_index.scss" as *;
|
|
148
151
|
@use "./column-menu/_index.scss" as *;
|
|
149
152
|
|
|
150
153
|
|
|
@@ -320,6 +323,7 @@
|
|
|
320
323
|
@include kendo-virtual-scroller--styles();
|
|
321
324
|
@include kendo-no-data--styles();
|
|
322
325
|
@include kendo-suggestion--styles();
|
|
326
|
+
@include kendo-bubble--styles();
|
|
323
327
|
@include kendo-column-menu--styles();
|
|
324
328
|
|
|
325
329
|
|