Fixes #2137: Show back arrow on mobile

This commit is contained in:
JC Brand 2020-10-23 21:36:25 +02:00
parent 4252a17f62
commit 476bcfe7cc
3 changed files with 27 additions and 3 deletions

View File

@ -618,8 +618,9 @@
.chatbox { .chatbox {
.box-flyout { .box-flyout {
.chatbox-navback { .chatbox-navback {
margin: auto 0;
margin-right: 1em;
display: flex; display: flex;
padding-right: 1em;
.fa-arrow-left { .fa-arrow-left {
&:before { &:before {
color: white; color: white;

View File

@ -89,8 +89,9 @@
.chatbox-title__text { .chatbox-title__text {
display: var(--heading-display); display: var(--heading-display);
font-weight: var(--chatroom-head-title-font-weight); font-weight: var(--chatroom-head-title-font-weight);
padding-right: var(--chatroom-head-title-padding-right);
margin: auto 0; margin: auto 0;
padding-right: var(--chatroom-head-title-padding-right);
white-space: nowrap;
.chatroom-jid { .chatroom-jid {
font-size: var(--font-size-small); font-size: var(--font-size-small);
} }
@ -520,3 +521,25 @@
} }
} }
} }
@include media-breakpoint-down(sm) {
#conversejs.converse-mobile,
#conversejs.converse-overlayed,
#conversejs.converse-fullscreen {
.chatbox {
.box-flyout {
.chat-head-chatroom {
.chatbox-navback {
margin-right: 0 !important;
.fa-arrow-left {
&:before {
color: var(--chatroom-head-color);
}
}
}
}
}
}
}
}

View File

@ -17,7 +17,7 @@ export default (o) => {
const show_subject = (subject && !o.subject_hidden); const show_subject = (subject && !o.subject_hidden);
return html` return html`
<div class="chatbox-title ${ show_subject ? '' : "chatbox-title--no-desc"}"> <div class="chatbox-title ${ show_subject ? '' : "chatbox-title--no-desc"}">
${ (o._converse.standalone) ? html`<div class="chatbox-navback"><i class="fa fa-arrow-left"></i></div>` : '' } ${ (!o._converse.api.settings.get("singleton")) ? html`<div class="chatbox-navback"><i class="fa fa-arrow-left"></i></div>` : '' }
<div class="chatbox-title__text" title="${ (o._converse.locked_muc_domain !== 'hidden') ? o.jid : '' }">${ o.title } <div class="chatbox-title__text" title="${ (o._converse.locked_muc_domain !== 'hidden') ? o.jid : '' }">${ o.title }
${ (o.bookmarked) ? html`<i class="fa fa-bookmark chatbox-title__text--bookmarked" title="${i18n_bookmarked}"></i>` : '' } ${ (o.bookmarked) ? html`<i class="fa fa-bookmark chatbox-title__text--bookmarked" title="${i18n_bookmarked}"></i>` : '' }
</div> </div>