diff --git a/src/components/middleEllipsis.ts b/src/components/middleEllipsis.ts index 2a6afc9c..0f849626 100644 --- a/src/components/middleEllipsis.ts +++ b/src/components/middleEllipsis.ts @@ -116,7 +116,8 @@ function getTextWidth(text: string, font: string) { //context.font = font; const metrics = context.measureText(text); //console.log('getTextWidth perf:', performance.now() - perf); - return metrics.width; + //return metrics.width; + return Math.round(metrics.width); } export class MiddleEllipsisElement extends HTMLElement { diff --git a/src/lib/appManagers/appImManager.ts b/src/lib/appManagers/appImManager.ts index 37ccb1d0..e9159e44 100644 --- a/src/lib/appManagers/appImManager.ts +++ b/src/lib/appManagers/appImManager.ts @@ -1712,7 +1712,8 @@ export class AppImManager { bubbleContainer = bubble.firstElementChild as HTMLDivElement; bubbleContainer.innerHTML = ''; - bubbleContainer.style.marginBottom = ''; + //bubbleContainer.style.marginBottom = ''; + bubbleContainer.style.cssText = ''; if(bubble == this.firstUnreadBubble) { bubble.classList.add('is-first-unread'); diff --git a/src/scss/partials/_chatBubble.scss b/src/scss/partials/_chatBubble.scss index 41ecb898..79b3e800 100644 --- a/src/scss/partials/_chatBubble.scss +++ b/src/scss/partials/_chatBubble.scss @@ -1009,6 +1009,8 @@ $bubble-margin: .25rem; &.is-message-empty { .message { position: absolute; + /* position: relative; + width: max-content; */ bottom: .1rem; right: .2rem; border-radius: 12px; @@ -1024,6 +1026,7 @@ $bubble-margin: .25rem; padding: 0 2.5px; line-height: 20px; pointer-events: all; // show title + white-space: nowrap; .inner { display: none; @@ -1063,6 +1066,7 @@ $bubble-margin: .25rem; align-items: center; line-height: 1; padding: inherit; + white-space: nowrap; } }