diff --git a/qortal-ui-plugins/plugins/core/components/ChatPage.js b/qortal-ui-plugins/plugins/core/components/ChatPage.js
index 5f2a0837..c8ebf65c 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatPage.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatPage.js
@@ -59,11 +59,11 @@ class ChatPage extends LitElement {
editedMessageObj: { type: Object },
iframeHeight: { type: Number },
chatMessageSize: { type: Number},
- imageFile: {type: Object},
- isUploadingImage: {type: Boolean},
+ imageFile: { type: Object },
+ isUploadingImage: { type: Boolean },
caption: { type: String },
- chatEditor: {type: Object},
- chatEditorNewChat: {type: Object}
+ chatEditor: { type: Object },
+ chatEditorNewChat: { type: Object }
}
}
@@ -144,7 +144,6 @@ class ChatPage extends LitElement {
width: 92%;
}
-
.senderName {
margin: 0;
color: var(--mdc-theme-primary);
@@ -234,8 +233,8 @@ class ChatPage extends LitElement {
overflow: hidden;
justify-content: center;
background: white;
- padding: 5px;
- border-radius: 1px;
+ padding: 5px;
+ border-radius: 1px;
}
.chatbar-caption {
@@ -435,7 +434,16 @@ class ChatPage extends LitElement {
.dialog-container {
position: relative;
display: flex;
+ align-items: center;
flex-direction: column;
+ padding: 0 10px;
+ gap: 10px;
+ height: 100%;
+ }
+
+ .dialog-container-loader {
+ position: relative;
+ display: flex;
align-items: center;
padding: 0 10px;
gap: 10px;
@@ -523,29 +531,21 @@ class ChatPage extends LitElement {
${this.imageFile && html`
`}
-
-
${this.isDeletingImage ? diff --git a/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js b/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js index 0ef263ef..753c5230 100644 --- a/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js +++ b/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js @@ -400,26 +400,33 @@ export const chatStyles = css` .image-container { display: flex; } + .message-data-level { height: 21px; width: 21px; overflow: hidden; } + .defaultSize { - width:45vh; - height:40vh + width: 45vh; + height: 40vh; } + .image-delete-icon { margin-left: 5px; height: 20px; - cursor: pointer; - visibility: hidden; - transition: .2s all; - opacity: .8 + cursor: pointer; + visibility: hidden; + transition: .2s all; + opacity: 0.8; + color: rgb(228, 222, 222); + padding-left: 7px; } + .image-delete-icon:hover { - opacity: 1 + opacity: 1; } + .message-parent:hover .image-delete-icon { visibility: visible; } diff --git a/qortal-ui-plugins/plugins/core/components/ChatScroller.js b/qortal-ui-plugins/plugins/core/components/ChatScroller.js index 2945e0a9..448ce883 100644 --- a/qortal-ui-plugins/plugins/core/components/ChatScroller.js +++ b/qortal-ui-plugins/plugins/core/components/ChatScroller.js @@ -132,13 +132,10 @@ class ChatScroller extends LitElement { this.upObserverElement = this.shadowRoot.getElementById('upObserver'); this.downObserverElement = this.shadowRoot.getElementById('downObserver'); // Intialize Observers - this.upElementObserver() - this.downElementObserver() - await this.getUpdateComplete() - - this.viewElement.scrollTop = this.viewElement.scrollHeight + 50 - - + this.upElementObserver(); + this.downElementObserver(); + await this.getUpdateComplete(); + this.viewElement.scrollTop = this.viewElement.scrollHeight + 50; } _getOldMessage(_scrollElement) { @@ -417,7 +414,10 @@ class MessageTemplate extends LitElement {