Merge pull request #6658 from matrix-org/gsouquet/threaded-messaging-2349

res/css/views/messages/_MessageActionBar.scss

@@ -92,6 +92,10 @@ limitations under the License.
     mask-image: url('$(res)/img/element-icons/room/message-bar/reply.svg');
 }
 
+.mx_MessageActionBar_threadButton::after {
+    mask-image: url('$(res)/img/element-icons/message/thread.svg');
+}
+
 .mx_MessageActionBar_editButton::after {
     mask-image: url('$(res)/img/element-icons/room/message-bar/edit.svg');
 }

res/css/views/right_panel/_RoomSummaryCard.scss

@@ -232,6 +232,10 @@ limitations under the License.
     mask-image: url('$(res)/img/element-icons/room/files.svg');
 }
 
+.mx_RoomSummaryCard_icon_threads::before {
+    mask-image: url('$(res)/img/element-icons/message/thread.svg');
+}
+
 .mx_RoomSummaryCard_icon_share::before {
     mask-image: url('$(res)/img/element-icons/room/share.svg');
 }

res/css/views/rooms/_EventTile.scss

@@ -643,6 +643,7 @@ $hover-select-border: 4px;
 
     // Remove some of the default tile padding so that the error is centered
     margin-right: 0;
+
     .mx_EventTile_line {
         padding-left: 0;
         margin-right: 0;
@@ -674,3 +675,62 @@ $hover-select-border: 4px;
         margin-right: 0;
     }
 }
+
+.mx_ThreadInfo:hover {
+    cursor: pointer;
+}
+
+.mx_ThreadView {
+    display: flex;
+    flex-direction: column;
+
+    .mx_ScrollPanel {
+        margin-top: 20px;
+
+        .mx_RoomView_MessageList {
+            padding: 0;
+        }
+    }
+
+    .mx_EventTile_senderDetails {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        margin-bottom: 6px;
+
+        a {
+            flex: 1;
+            min-width: none;
+            max-width: 100%;
+            display: flex;
+            align-items: center;
+
+            .mx_SenderProfile {
+                flex: 1;
+            }
+        }
+    }
+
+    .mx_ThreadView_List {
+        flex: 1;
+        overflow: scroll;
+    }
+
+    .mx_EventTile_roomName {
+        display: none;
+    }
+
+    .mx_EventTile_line {
+        padding-left: 0 !important;
+        order: 10 !important;
+    }
+
+    .mx_EventTile {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        margin-top: 0;
+        padding-bottom: 5px;
+        margin-bottom: 5px;
+    }
+}

res/css/views/rooms/_MessageComposer.scss

@@ -340,3 +340,19 @@ limitations under the License.
         height: 50px;
     }
 }
+
+/**
+ * Unstable compact mode
+ */
+
+.mx_MessageComposer.mx_MessageComposer--compact {
+    margin-right: 0;
+
+    .mx_MessageComposer_wrapper {
+        padding: 0;
+    }
+
+    .mx_MessageComposer_button:last-child {
+        margin-right: 0;
+    }
+}