implement reply view

src/View/ChatPages/messagePage.css

@@ -28,6 +28,23 @@
     overflow: auto;
 }
 
+#message-page .reply-header {
+    width: 100%;
+    padding-left: var(--content-padding);
+    gap: var(--gap-in-controls);
+	
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    
+    background: var(--surface);
+}
+
+#message-page .reply-header span {
+    width: 100%;
+    flex: 1;
+}
+
 /* composer */
 #message-page #composer {
     display: flex;
@@ -259,6 +276,10 @@
     gap: 5px;
 }
 
+#message-page[reply-view] :is(.reply-link, .inline-reply) {
+    display: none;
+}
+
 .message-bubble > .message-reaction-row {
     padding: var(--gap-between-tiles);
     display: none !important;

src/View/ChatPages/messagePage.tsx

@@ -72,8 +72,10 @@ export function MessagePage(
         ViewController.setFocusWithDelay();
     });
 
+    const isInReplyView = React.createProxyState([messagePageViewModel.replyViewSelectedMessage], ()=>messagePageViewModel.replyViewSelectedMessage.value != undefined);
+
     return (
-        <div id="message-page">
+        <div id="message-page" toggle:reply-view={isInReplyView}>
             <div class="pane-wrapper">
                 <div class="pane">
                     <div class="toolbar">