compose: Allow 3-way compose box resizing with new fixed expanded state.

Apart from the normal (collapsed) and full screen sizes, a new expanded
state with the same size as the maximum a normal compose box can stretch
to when full (40% of the screen height) is now available. Now a user can
expand the compose box without it covering the full screen with a click.
The vertical resize icon in the bottom right corner of the compose box
is rendered useless so has been removed.

All three states can be cycled through by clicking the compose resize
button in the order: collapsed -> 40% of the screen -> full screen. When
a message naturally causes the compose box in its normal state to expand
up to 40% of the screen, clicking the resize button will take it to full
screen state.

Fixes: #29966.
This commit is contained in:
N-Shar-ma
2024-06-10 21:48:28 +05:30
committed by Tim Abbott
parent b432b269ee
commit 9bc1eb4bb9
8 changed files with 80 additions and 13 deletions

View File

@@ -78,6 +78,7 @@
</div>
</div>
<div class="composebox-buttons">
<button type="button" class="maximize-composebox-button zulip-icon zulip-icon-maximize-diagonal" aria-label="{{t 'Maximize compose box' }}" data-tippy-content="{{t 'Maximize compose box' }}"></button>
<button type="button" class="expand-composebox-button zulip-icon zulip-icon-expand-diagonal" aria-label="{{t 'Expand compose box' }}" data-tippy-content="{{t 'Expand compose box' }}"></button>
<button type="button" class="collapse-composebox-button zulip-icon zulip-icon-collapse-diagonal" aria-label="{{t 'Collapse compose box' }}" data-tippy-content="{{t 'Collapse compose box' }}"></button>
</div>