compose: Replace hrefs with "tabindex=0" for all buttons.

For all buttons in the compose box, `href="#"` is replaced by "tabindex=0" so that the buttons are still focusable. This change also fixes a bug that caused the Formatting button to redirect to All messages.
zulip · Jul 30, 2020 · 9c317b0 · 9c317b0
1 parent 9d768b7
commit 9c317b0
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/templates/zerver/app/compose.html b/templates/zerver/app/compose.html
@@ -95,14 +95,14 @@
                                 <div class="drag"></div>
                                 <div id="below-compose-content">
                                     <input type="file" id="file_input" class="notvisible pull-left" multiple />
-                                    <a class="message-control-button fa fa-smile-o" aria-label="{{_('Add emoji')}}" id="emoji_map" href="#" title="{{ _('Add emoji') }}"></a>
-                                    <a class="message-control-button fa fa-font" aria-label="{{ _('Formatting') }}" href="#" title="{{ _('Formatting') }}" data-overlay-trigger="message-formatting"></a>
+                                    <a class="message-control-button fa fa-smile-o" aria-label="{{_('Add emoji')}}" id="emoji_map" tabindex=0 title="{{ _('Add emoji') }}"></a>
+                                    <a class="message-control-button fa fa-font" aria-label="{{ _('Formatting') }}" tabindex=0 title="{{ _('Formatting') }}" data-overlay-trigger="message-formatting"></a>
                                     {% if max_file_upload_size_mib > 0 %}
-                                    <a class="message-control-button fa fa-paperclip notdisplayed" aria-label="{{ _('Attach files') }}" id="attach_files" href="#" title="{{ _('Attach files') }}"></a>
+                                    <a class="message-control-button fa fa-paperclip notdisplayed" aria-label="{{ _('Attach files') }}" id="attach_files" tabindex=0 title="{{ _('Attach files') }}"></a>
                                     {% endif %}
-                                    <a class="message-control-button fa fa-video-camera video_link" aria-label="{{ _('Add video call') }}" href="#" title="{{ _('Add video call') }}"></a>
-                                    <a id="undo_markdown_preview" class="message-control-button fa fa-edit" aria-label="{{ _('Write') }}" href="#" style="display:none;" title="{{ _('Write') }}"></a>
-                                    <a id="markdown_preview" class="message-control-button fa fa-eye" aria-label="{{ _('Preview') }}" href="#" title="{{ _('Preview') }}"></a>
+                                    <a class="message-control-button fa fa-video-camera video_link" aria-label="{{ _('Add video call') }}" tabindex=0 title="{{ _('Add video call') }}"></a>
+                                    <a id="undo_markdown_preview" class="message-control-button fa fa-edit" aria-label="{{ _('Write') }}" tabindex=0 style="display:none;" title="{{ _('Write') }}"></a>
+                                    <a id="markdown_preview" class="message-control-button fa fa-eye" aria-label="{{ _('Preview') }}" tabindex=0 title="{{ _('Preview') }}"></a>
                                     <a class="drafts-link" href="#drafts" title="{{ _('Drafts') }} (d)">{{ _('Drafts') }}</a>
                                     <span id="sending-indicator"></span>
                                     <div id="send_controls" class="new-style">