Merge branch 'master' into calls

nkonev · Jan 10, 2024 · b1eb0a5 · b1eb0a5
2 parents 1745559 + d435688
commit b1eb0a5
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 11 deletions.
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
@@ -721,6 +721,11 @@ export default {
 <style lang="scss">
 @use './styles/settings';
 
+// removes extraneous scroll at right side of the screen on Chrome
+html {
+  overflow-y: unset !important;
+}
+
 .search-icon {
   opacity: settings.$list-item-icon-opacity;
 }

diff --git a/frontend/src/BlogApp.vue b/frontend/src/BlogApp.vue
@@ -128,6 +128,11 @@ export default {
 <style lang="stylus">
 @import "constants.styl"
 
+// removes extraneous scroll at right side of the screen on Chrome
+html {
+  overflow-y: unset !important;
+}
+
 .colored-link {
     color: $linkColor;
     text-decoration none

diff --git a/frontend/src/ChatVideo.vue b/frontend/src/ChatVideo.vue
@@ -75,7 +75,11 @@ export default {
       app.use(vuetify);
       app.use(pinia);
       const containerEl = document.createElement("div");
-      containerEl.className = 'video-container-wrapper';
+      if (this.videoIsOnTop) {
+        containerEl.className = 'video-component-wrapper-position-top';
+      } else {
+        containerEl.className = 'video-component-wrapper-position-side';
+      }
 
       if (position == first) {
         this.insertChildAtIndex(this.videoContainerDiv, containerEl, 0);
@@ -365,9 +369,9 @@ export default {
     },
     getOnScreenPosition(publication) {
       if (publication.source == 'screen_share') {
-        return second
+        return first
       }
-      return first
+      return second
     },
     refreshLocalMicrophoneAppBarButtons() {
       const onlyOneLocalComponentWithAudio = this.onlyOneLocalTrackWithMicrophone(this.room.localParticipant.identity);
@@ -596,7 +600,7 @@ export default {
 </style>
 
 <style lang="stylus">
-.video-container-wrapper {
+.video-component-wrapper-position-top {
   display contents
 }
 

diff --git a/frontend/src/ChatView.vue b/frontend/src/ChatView.vue
@@ -1,6 +1,6 @@
 <template>
     <splitpanes class="default-theme" :dbl-click-splitter="false" :style="heightWithoutAppBar">
-      <pane size="25" v-if="!isMobile()">
+      <pane size="25" v-if="!isMobile() && !isVideoRoute()">
         <ChatList :embedded="true"/>
       </pane>
       <pane>
@@ -11,7 +11,7 @@
                 <ChatVideo :chatDto="chatDto" :videoIsOnTop="videoIsOnTop()" />
               </pane>
 
-              <pane style="width: 100%" :class="isMobile() ? 'message-pane-mobile' : ''" :size="messageListSize">
+              <pane style="width: 100%" :class="messageListPaneClass()" :size="messageListSize">
                   <v-tooltip
                     v-if="broadcastMessage"
                     :model-value="showTooltip"
@@ -21,7 +21,7 @@
                     <span v-html="broadcastMessage"></span>
                   </v-tooltip>
 
-                  <div v-if="pinnedPromoted" :key="pinnedPromotedKey" :class="!isMobile() ? 'pinned-promoted' : ['pinned-promoted', 'pinned-promoted-mobile']" :title="$vuetify.locale.t('$vuetify.pinned_message')">
+                  <div v-if="pinnedPromoted" :key="pinnedPromotedKey" class="pinned-promoted" :title="$vuetify.locale.t('$vuetify.pinned_message')">
                     <v-alert
                       closable
                       color="red-lighten-4"
@@ -506,6 +506,14 @@ export default {
         })
       }
     },
+    messageListPaneClass() {
+      const classes = [];
+      classes.push('message-pane');
+      if (this.isMobile()) {
+        classes.push('message-pane-mobile');
+      }
+      return classes;
+    },
   },
   watch: {
     '$route': {
@@ -602,12 +610,11 @@ export default {
 @import "pinned.styl"
 
 .pinned-promoted {
-  position: fixed
+  position: absolute
   z-index: 4;
-  margin-right: 284px;
 }
-.pinned-promoted-mobile {
-    margin-right: unset;
+.message-pane {
+  position: relative
 }
 .message-pane-mobile {
     align-items: unset;