diff --git a/src/assets/css/chat.scss b/src/assets/css/chat.scss index c326916..30a5554 100644 --- a/src/assets/css/chat.scss +++ b/src/assets/css/chat.scss @@ -120,6 +120,21 @@ $chat-text-size: 0.7pt; } } } + + .op-button { + position:absolute; + right:-30px; + top:0; + .v-icon { + color: #cccccc; + &:hover { + color: #888888; + } + } + } + .messageOut .op-button { + right:70%; + } } .messageJoin { @@ -139,6 +154,9 @@ $chat-text-size: 0.7pt; border-radius: 10px 10px 0 10px; padding: 8px; } + .audio-bubble { + overflow: scroll; + } .bubble.image-bubble { padding: 0px; overflow: hidden; @@ -179,6 +197,7 @@ $chat-text-size: 0.7pt; } .audio-bubble { margin-left: 40px; + overflow: scroll; } .bubble.image-bubble { padding: 0px; @@ -248,14 +267,21 @@ $chat-text-size: 0.7pt; margin: 20px; } -.messageOperations { +.message-operations-strut { + position: relative; + height: 0px; + z-index: 1; +} + +.message-operations { position: absolute; - bottom: 10px; + width: auto; + background-color: #ffe2e2; &.incoming { - left: -20px; + right: 30%; } &.outgoing { - right: 20px; + left: 30%; } } diff --git a/src/components/Chat.vue b/src/components/Chat.vue index f7cc318..c0d5c00 100644 --- a/src/components/Chat.vue +++ b/src/components/Chat.vue @@ -6,17 +6,32 @@ ref="chatContainer" style="overflow-x: hidden; overflow-y: auto" v-on:scroll="onScroll" + @click.prevent="closeContextMenuIfOpen" > +
+