@chat21/chat21-web-widget 5.1.24-rc2 → 5.1.25-rc1

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 CHANGED
@@ -6,6 +6,9 @@
6
6
  ### **Copyrigth**:
7
7
  *Tiledesk SRL*
8
8
 
9
+ # 5.1.25-rc1
10
+ - **bug fixed**: attachment buttons in messages now respect the container max width and wrap/break long labels instead of being clipped
11
+
9
12
  # 5.1.24-rc2
10
13
  - **bug fixed**: minor fix in marked pipe to avoid rendering html tags
11
14
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@chat21/chat21-web-widget",
3
3
  "author": "Tiledesk SRL",
4
- "version": "5.1.24-rc2",
4
+ "version": "5.1.25-rc1",
5
5
  "license": "MIT",
6
6
  "homepage": "https://www.tiledesk.com",
7
7
  "repository": {
@@ -22,11 +22,10 @@
22
22
  font-family: var(--font-family);
23
23
  font-size: var(--buttonFontSize);
24
24
  color: var(--buttonTextColor);
25
- overflow: hidden;
26
- -o-text-overflow: ellipsis;
27
- text-overflow: ellipsis;
28
- white-space: nowrap;
29
- word-wrap: break-word;
25
+ max-width: 100%;
26
+ white-space: normal;
27
+ overflow-wrap: anywhere;
28
+ word-break: break-word;
30
29
  -webkit-font-smoothing: antialiased;
31
30
  line-height: 16px;
32
31
  font-weight: 500;
@@ -23,11 +23,11 @@
23
23
  font-family: var(--font-family);
24
24
  font-size: var(--buttonFontSize);
25
25
  color: var(--buttonTextColor);
26
- overflow: hidden;
27
- -o-text-overflow: ellipsis;
28
- text-overflow: ellipsis;
29
- white-space: nowrap;
30
- word-wrap: break-word;
26
+ max-width: 100%;
27
+ padding-right: 40px;
28
+ white-space: normal;
29
+ overflow-wrap: anywhere;
30
+ word-break: break-word;
31
31
  -webkit-font-smoothing: antialiased;
32
32
  line-height: 16px;
33
33
  font-weight: 500;
@@ -42,15 +42,18 @@
42
42
  transition: background-color .6s ease;
43
43
  .icon-button-action {
44
44
  position: absolute;
45
- top: -1px;
46
- right: 1px;
45
+ top: 50%;
46
+ right: 8px;
47
+ transform: translateY(-50%);
47
48
  svg {
48
49
  fill: var(--textColor);
49
50
  }
50
51
  }
51
52
  .icon-button-action-self{
52
53
  position: absolute;
53
- right: 1px;
54
+ top: 50%;
55
+ right: 8px;
56
+ transform: translateY(-50%);
54
57
  svg {
55
58
  fill: var(--textColor);
56
59
  }
@@ -23,11 +23,10 @@
23
23
  font-family: var(--font-family);
24
24
  font-size: var(--buttonFontSize);
25
25
  color: var(--buttonTextColor);
26
- overflow: hidden;
27
- -o-text-overflow: ellipsis;
28
- text-overflow: ellipsis;
29
- // white-space: nowrap;
30
- word-wrap: break-word;
26
+ max-width: 100%;
27
+ white-space: normal;
28
+ overflow-wrap: anywhere;
29
+ word-break: break-word;
31
30
  // letter-spacing: -0.24px;
32
31
  -webkit-font-smoothing: antialiased;
33
32
  line-height: 16px;
@@ -4,9 +4,11 @@
4
4
  // margin-right: 16px; //align attachment-buttons to bubble sent message
5
5
  height: auto;
6
6
  // width: 85%;
7
- max-width: 95%;
7
+ width: 100%;
8
+ max-width: 100%;
8
9
  float: left;
9
10
  padding-left: calc(var(--avatar-width) + 10px);
11
+ box-sizing: border-box;
10
12
 
11
13
  .buttons-wrapper {
12
14
  margin-top: 0px;
@@ -16,6 +18,7 @@
16
18
  // justify-content: flex-end;
17
19
  justify-content: flex-start;
18
20
  width: 100%;
21
+ max-width: 100%;
19
22
  border: none;
20
23
  }
21
24
 
@@ -24,6 +27,8 @@
24
27
  // overflow: hidden;
25
28
  // text-overflow: ellipsis;
26
29
  // min-width: inherit;
30
+ max-width: 100%;
31
+ min-width: 0;
27
32
  .button-in-msg {
28
33
  padding: 8px 16px!important;
29
34
  }