Merge branch 'more-audio-layout' into 'dev'

Fix playback bug on first load

See merge request keanuapp/keanuapp-weblite!140

src/assets/css/chat.scss

@@ -896,6 +896,26 @@ body {
   }
 }
 
+.with-right-label {
+  display: flex;
+  flex-wrap: nowrap;
+  flex-direction: row;
+  text-align: start;
+  & > * {
+    flex: 1 1 auto;
+  }
+  & > *:last-child {
+    flex: 0 0 auto;
+  }
+  .option-title {
+    color: #000;
+    font-size: 16 * $chat-text-size;
+  }
+  .option-text {
+    font-size: 13 * $chat-text-size;
+  }
+}
+
 .header-button-left {
   position: absolute;
   top: 0px;
@@ -1111,6 +1131,21 @@ body {
     border: 1px solid #808080 !important;
     position: relative;
   }
+
+  .options {
+    display: flex;
+    width: 100%;
+    justify-content: flex-end;
+    color: black;
+    font-size: 14 * $chat-text-size;
+    font-weight: bold;
+    margin-left: 10px;
+    [dir="rtl"] & {
+      margin-left: initial;
+      margin-right: 10px;
+    }
+    text-transform: none !important;
+  }
 }
 
 .room-link .v-input__slot::before {
@@ -1236,6 +1271,27 @@ body {
     flex: 1 0 auto;
     padding: 20px;
   }
+  .typing-users {
+    flex: 1 0 52px;
+    min-height: 52px;
+    padding: 20px;
+    overflow-x: auto;
+    overflow-y: hidden;
+    max-width: 100%;
+    display: flex;
+    .typing-user {
+      width: 32px !important;
+      height: 32px !important;
+      margin-left: -8px !important;
+    }
+    .list-enter-active, .list-leave-active {
+      transition: all 1s;
+    }
+    .list-enter, .list-leave-to /* .list-leave-active below version 2.1.8 */ {
+      opacity: 0;
+      transform: translateY(24px);
+    }
+  }
   .load-later {
     flex: 1 0 auto;
     padding: 20px;