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

compose: Increase click target area around banner close button. 

Using padding instead of margin allows a wider area around
the button where the user can click from to still functionally
click the button.
This commit is contained in:
evykassirer 2022-12-12 14:10:06 -08:00 committed by Tim Abbott
parent 27b703f617
commit aaa8b90271
2 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
static/styles/compose.css
View File

@ -279,7 +279,6 @@
.compose_banner {
margin-bottom: 20px;
border-radius: 5px;
padding-right: 11px;
border: 1px solid;
display: flex;
align-items: center;
@ -307,14 +306,18 @@
margin-bottom: 4.5px;
height: 32px;
white-space: nowrap;
/* Extra margin to ensure the layout is identical when there is no
close button. */
&.right_edge {
margin-right: 10px;
}
}
.compose_banner_close_button {
font-size: 17px;
text-decoration: none;
margin-left: 10px;
margin-top: 12px;
margin-bottom: 12px;
padding: 12px 10px;
}
&.warning {

2
static/templates/compose_banner/compose_banner.hbs
View File

@ -9,7 +9,7 @@
<div class="banner_content">{{> @partial-block}}</div>
{{/if}}
{{#if button_text}}
<button class="compose_banner_action_button" >{{button_text}}</button>
<button class="compose_banner_action_button{{#if hide_close_button}} right_edge{{/if}}" >{{button_text}}</button>
{{/if}}
{{#if hide_close_button}}
{{!-- hide_close_button is null by default, and false if explicitly set as false. --}}