mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Packages Projects Releases Wiki Activity

Merge pull request #575 from vector-im/bwindels/composer-layout-improvements

Browse source 
Composer layout improvements
This commit is contained in:
Bruno Windels 2021-11-05 19:24:34 +01:00 committed by GitHub
parent 222c616148 23494ab630
commit 2dccd36a6d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/platform/web/ui/css/themes/element/theme.css
View file

@ -502,7 +502,7 @@ a {
} }
.MessageComposer_input, .MessageComposer_replyPreview { .MessageComposer_input, .MessageComposer_replyPreview {
padding: 8px 16px; padding: 8px;
} }
.MessageComposer_replyPreview > .replying { .MessageComposer_replyPreview > .replying {
@ -547,7 +547,7 @@ a {
padding: 14px; padding: 14px;
box-sizing: border-box; box-sizing: border-box;
overflow: hidden; overflow: hidden;
max-height: 113px; max-height: 113px; /* 5 lines */
} }
.MessageComposer_input > button.send { .MessageComposer_input > button.send {
@ -563,6 +563,8 @@ a {
background-image: url('icons/send.svg'); background-image: url('icons/send.svg');
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
align-self: end;
margin-bottom: 8px;
} }
.MessageComposer_input > button.sendFile { .MessageComposer_input > button.sendFile {
@ -579,8 +581,12 @@ a {
background-position: center; background-position: center;
} }
.MessageComposer_input > button.send:disabled { .MessageComposer.MessageComposer_canSend button.sendFile {
background-color: #E3E8F0; display: none;
}
.MessageComposer:not(.MessageComposer_canSend) button.send {
display: none;
} }
.SettingsBody { .SettingsBody {

6
src/platform/web/ui/session/room/MessageComposer.js
View file

@ -69,11 +69,13 @@ export class MessageComposer extends TemplateView {
t.button({ t.button({
className: "send", className: "send",
title: vm.i18n`Send`, title: vm.i18n`Send`,
disabled: vm => !vm.canSend,
onClick: () => this._trySend(), onClick: () => this._trySend(),
}, vm.i18n`Send`), }, vm.i18n`Send`),
]); ]);
return t.div({ className: "MessageComposer" }, [replyPreview, input]); return t.div({ className: {
MessageComposer: true,
MessageComposer_canSend: vm => vm.canSend
} }, [replyPreview, input]);
} }
unmount() { unmount() {