Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
zulip/static/templates/compose_control_buttons.hbs

16 lines
1.3 KiB
Handlebars
Raw Normal View History

compose: Move overflowing buttons to a popover. We don't hide popover on click for formatting buttons, emoji picker and time picker. Emoji and time picker popovers need a reference to be displayed, hence we don't hide them. Not hiding formatting buttons is based on past discussion. The current instance of compose popover is stored locally so that we can access it across different modules. The basic approach for hiding / displaying a button is based on width and is executed at `sm` breakpoint as per our `css_variables.js`. Used handlebars and `hide/show-sm` css class to make this work. This avoids using too much JS to hide/display elements.
2021-11-23 19:01:36 +01:00
<div class="compose_control_buttons_container order-1">
<input type="file" class="file_input notvisible pull-left" multiple />
{{#if file_upload_enabled }}
<a role="button" class="compose_control_button compose_upload_file fa fa-paperclip notdisplayed" aria-label="{{t 'Upload files' }}" tabindex=0 data-tippy-content="{{t 'Upload files' }}"></a>
{{/if}}
<a role="button" class="markdown_preview compose_control_button fa fa-eye" aria-label="{{t 'Preview' }}" tabindex=0 data-tippy-content="{{t 'Preview' }}"></a>
<a role="button" class="undo_markdown_preview compose_control_button fa fa-edit" aria-label="{{t 'Write' }}" tabindex=0 style="display:none;" data-tippy-content="{{t 'Write' }}"></a>
<a role="button" class="compose_control_button fa fa-video-camera video_link" aria-label="{{t 'Add video call' }}" tabindex=0 data-tippy-content="{{t 'Add video call' }}"></a>
<div class="{{#if message_id}}hide-lg{{else}}hide-sm{{/if}}">
{{> compose_control_buttons_in_popover}}
</div>
<div class="compose_control_menu_wrapper">
<a class="compose_control_button zulip-icon zulip-icon-ellipsis-v-solid hide {{#if message_id}}show-lg{{else}}show-sm{{/if}} compose_control_menu" tabindex=0 data-tippy-content="Compose actions"></a>
compose: Never hide send button. `Press Enter to send` used to hide `Send` button, we remove that behaviour. We show the current state of `Enter` hotkey action via text below `Send` button which can toggle behaviour on click.
2021-11-25 10:00:04 +01:00
</div>
compose: Refactor bottom part of compose box. * We use flexbox instead of `position: relative` to align elements. * Increase clickable area of icons using more padding. * Increase space between elements. * Fix mobile compose box icon alignment.
2021-11-12 06:29:37 +01:00
</div>