@linktr.ee/messaging-react 1.22.0 → 1.22.2-rc-1772424036

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/src/styles.css CHANGED
@@ -134,9 +134,51 @@
134
134
  color: #016630;
135
135
  }
136
136
 
137
- .message-tag--chatbot {
138
- background-color: transparent;
139
- color: #7f22fe;
137
+ .message-chatbot-indicator {
138
+ display: inline-flex;
139
+ align-items: center;
140
+ font-size: 10px;
141
+ font-weight: 400;
142
+ line-height: 16px;
143
+ letter-spacing: 0.2px;
144
+ }
145
+
146
+ .message-chatbot-indicator--text {
147
+ width: 100%;
148
+ gap: 6px;
149
+ margin-top: 12px;
150
+ padding-inline: 16px;
151
+ }
152
+
153
+ .message-chatbot-indicator--receiver {
154
+ justify-content: flex-start;
155
+ color: rgba(0, 0, 0, 0.3);
156
+ }
157
+
158
+ .message-chatbot-indicator--sender {
159
+ justify-content: flex-end;
160
+ }
161
+
162
+ .message-chatbot-indicator--sender.message-chatbot-indicator--text {
163
+ justify-content: flex-start;
164
+ color: rgba(255, 255, 255, 0.55);
165
+ }
166
+
167
+ .message-chatbot-indicator--attachment {
168
+ width: 100%;
169
+ gap: 8px;
170
+ margin-top: 4px;
171
+ color: rgba(0, 0, 0, 0.3);
172
+ }
173
+
174
+ .message-chatbot-indicator__icon {
175
+ display: inline-flex;
176
+ align-items: center;
177
+ line-height: 1;
178
+ }
179
+
180
+ .message-chatbot-indicator__label {
181
+ text-align: left;
140
182
  }
141
183
 
142
184
  /* Message vote buttons (chatbot feedback) */
@@ -159,7 +201,9 @@
159
201
  background-color: transparent;
160
202
  color: rgba(0, 0, 0, 0.35);
161
203
  cursor: pointer;
162
- transition: background-color 0.15s, color 0.15s;
204
+ transition:
205
+ background-color 0.15s,
206
+ color 0.15s;
163
207
  }
164
208
 
165
209
  .message-vote-button:hover {
@@ -195,7 +239,7 @@
195
239
  justify-content: center;
196
240
  gap: 10px;
197
241
  margin-inline: auto;
198
- margin-bottom: 4px;
242
+ margin-bottom: 8px;
199
243
  width: fit-content;
200
244
  max-width: min(100%, 480px);
201
245
  padding: 12px;