diff options
author | greta <gretadoci@gmail.com> | 2022-05-17 14:20:47 +0300 |
---|---|---|
committer | greta <gretadoci@gmail.com> | 2022-05-24 12:04:25 +0300 |
commit | 8568ea4fbdf60f72f0c5fa44163148ee5fffcedb (patch) | |
tree | 0c69c6f3f7b2cb1f982f3515d60998c546269d88 /src | |
parent | 7cd477675d780570746d477491eaf292baaf2a90 (diff) |
Improve composer size on different screens
Signed-off-by: greta <gretadoci@gmail.com>
Diffstat (limited to 'src')
-rw-r--r-- | src/components/Composer.vue | 14 | ||||
-rw-r--r-- | src/components/ComposerAttachments.vue | 16 | ||||
-rw-r--r-- | src/components/NewMessageModal.vue | 4 |
3 files changed, 29 insertions, 5 deletions
diff --git a/src/components/Composer.vue b/src/components/Composer.vue index 140728452..badc133c0 100644 --- a/src/components/Composer.vue +++ b/src/components/Composer.vue @@ -116,7 +116,7 @@ }) }} </div> - <div class="composer-fields"> + <div class="composer-fields message-editor"> <!--@keypress="onBodyKeyPress"--> <TextEditor v-if="!encrypt && editorPlainText" @@ -1078,6 +1078,10 @@ export default { .message-composer { margin: 0; z-index: 100; + display: flex; + flex-direction: column; + height: 100%; + max-height: 100%; } .composer-actions { @@ -1126,8 +1130,14 @@ export default { border-radius: 0; } +// Make composer editor expand +.message-editor { + flex: 1 1 100%; + min-height: 0; +} + .message-body { - min-height: 570px; + height: 100%; width: 100%; margin: 0; border: none !important; diff --git a/src/components/ComposerAttachments.vue b/src/components/ComposerAttachments.vue index 00fc4b478..28ae5b997 100644 --- a/src/components/ComposerAttachments.vue +++ b/src/components/ComposerAttachments.vue @@ -228,9 +228,19 @@ export default { } </script> -<style scoped> -.new-message-attachments li { - padding: 10px; +<style scoped lang="scss"> + +.new-message-attachments { + ul { + display: flex; + flex-wrap: wrap; + // 2 and a half attachment height + max-height: 140px; + overflow: auto; + } + li { + padding: 10px; + } } .new-message-attachments-action { diff --git a/src/components/NewMessageModal.vue b/src/components/NewMessageModal.vue index a0fedab73..2daceab87 100644 --- a/src/components/NewMessageModal.vue +++ b/src/components/NewMessageModal.vue @@ -195,5 +195,9 @@ export default { ::v-deep .modal-wrapper .modal-container { overflow-y: auto !important; overflow-x: auto !important; + // from original Modal max-height + height: 90%; + // Max editor + modal height + max-height: 700px !important; } </style> |