VDMDI/CT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update layout styles to support multiple panes

Browse Source
This commit is contained in:
marlon-erler
2024-07-22 13:29:08 +02:00
parent e8ab217be3
commit 343bd7ef01
5 changed files with 200 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/View/ChatPages/messagePage.tsx
+27 -25
View File
@@ -33,31 +33,33 @@ export function MessagePage(chatViewModel: ChatViewModel) {
return (
<div id="message-page">
<div class="toolbar">
<span subscribe:innerText={chatViewModel.primaryChannel}></span>
</div>
<div class="content">
{messageContainer}
<div id="composer">
<div class="content-width-constraint">
<div class="input-width-constraint">
<input
bind:value={chatViewModel.composingMessage}
on:enter={chatViewModel.sendMessage}
placeholder={
translations.chatPage.message.composerInputPlaceholder
}
></input>
<button
class="primary"
aria-label={
translations.chatPage.message.sendMessageButtonAudioLabel
}
on:click={chatViewModel.sendMessage}
toggle:disabled={chatViewModel.cannotSendMessage}
>
<span class="icon">send</span>
</button>
<div class="pane">
<div class="toolbar">
<span subscribe:innerText={chatViewModel.primaryChannel}></span>
</div>
<div class="content">
{messageContainer}
<div id="composer">
<div class="content-width-constraint">
<div class="input-width-constraint">
<input
bind:value={chatViewModel.composingMessage}
on:enter={chatViewModel.sendMessage}
placeholder={
translations.chatPage.message.composerInputPlaceholder
}
></input>
<button
class="primary"
aria-label={
translations.chatPage.message.sendMessageButtonAudioLabel
}
on:click={chatViewModel.sendMessage}
toggle:disabled={chatViewModel.cannotSendMessage}
>
<span class="icon">send</span>
</button>
</div>
</div>
</div>
</div>