[FIX] mail: close thread window button isn't clickable easily

Before this commit, the close button on the thread window was
too small to click on it. The padding of the button wasn't over
the all available area.

After this commit, the padding of the close button is higher and
so the user can target it more easily on a small screen.
We had to reduce the padding of the parent.

Step to reproduce:
- Open the "Discuss" app
- Go to the "Channels" tab
- Open a channel
- Try to tap on the close button on the top left window

Task ID : 2033828

closes odoo/odoo#34977

Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com>
This commit is contained in:
Romeo Fragomeli
2019-07-18 13:00:28 +00:00
committed by Adrien Dieudonne
parent 2136ea5646
commit 37edde1773
2 changed files with 6 additions and 3 deletions
@@ -39,8 +39,9 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
padding: 8px;
@include media-breakpoint-down(sm) {
align-items: center;
height: $o-mail-chat-header-height;
padding-top: 12px;
padding: 0;
border-radius: 0px;
.o_thread_window_title {
font-size: 16px;
@@ -48,7 +49,9 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
}
.o_thread_window_close {
font-size: 17px;
$o-close-font-size: 17px;
padding: (($o-mail-chat-header-height - $o-close-font-size) / 2);
font-size: $o-close-font-size;
color: white;
}
}
@@ -66,7 +66,7 @@
-->
<t t-name="mail.AbstractThreadWindow.HeaderContent">
<span t-if="widget.isMobile()">
<a href="#" class="o_thread_window_close fa fa-1x fa-arrow-left mr4" aria-label="Close chat window" title="Close chat window"/>
<a href="#" class="o_thread_window_close fa fa-1x fa-arrow-left" aria-label="Close chat window" title="Close chat window"/>
</span>
<span class="o_thread_window_title">
<t t-if="status" t-call="mail.UserStatus"/>