Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
25
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Move CSS fixes before merge

Browse Source
This commit is contained in:
JC Brand 2021-02-08 10:16:39 +01:00
parent 3f24720633
commit 18e48be5c4
6 changed files with 31 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
sass/_autocomplete.scss
View File

@ -124,18 +124,16 @@
background: var(--completion-normal-color); background: var(--completion-normal-color);
color: inherit; color: inherit;
} }
}
converse-chats { #conversejs.converse-fullscreen {
&.converse-fullscreen { .suggestion-box__results--above {
.suggestion-box__results--above { bottom: 4.5em;
bottom: 4.5em; }
} }
}
#conversejs.converse-overlayed {
&.converse-overlayed { .suggestion-box__results--above {
.suggestion-box__results--above { bottom: 3.5em;
bottom: 3.5em;
}
}
} }
} }

14
sass/_chatbox.scss
View File

@ -184,7 +184,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
background-color: var(--chat-head-color); background-color: var(--chat-textarea-background-color);
border-bottom-left-radius: var(--chatbox-border-radius); border-bottom-left-radius: var(--chatbox-border-radius);
border-bottom-right-radius: var(--chatbox-border-radius); border-bottom-right-radius: var(--chatbox-border-radius);
@ -468,13 +468,11 @@
} }
@include media-breakpoint-down(sm) { @include media-breakpoint-down(sm) {
#conversejs { #conversejs.converse-overlayed {
converse-chats.converse-overlayed { > .row {
> .row { flex-direction: column;
flex-direction: column; &.no-gutters {
&.no-gutters { margin: -1em;
margin: -1em;
}
} }
} }
} }

4
sass/_controlbox.scss
View File

@ -95,7 +95,6 @@
} }
.box-flyout { .box-flyout {
margin-left: 0;
background-color: var(--controlbox-pane-background-color); background-color: var(--controlbox-pane-background-color);
} }
@ -576,6 +575,9 @@
} }
&.converse-fullscreen { &.converse-fullscreen {
#controlbox {
margin-left: -15px;
}
.controlbox-panes { .controlbox-panes {
padding-top: 2em; padding-top: 2em;
} }

14
sass/_roster.scss
View File

@ -9,6 +9,7 @@
// XXX: FIXME // XXX: FIXME
height: calc(100% - 70px); height: calc(100% - 70px);
/* Custom addition for CSP */ /* Custom addition for CSP */
#online-count { #online-count {
display: none; display: none;
@ -55,6 +56,15 @@
overflow-y: auto; overflow-y: auto;
color: var(--text-color); color: var(--text-color);
converse-roster-contact {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: flex;
justify-content: space-between;
}
.group-toggle { .group-toggle {
font-family: var(--heading-font); font-family: var(--heading-font);
display: block; display: block;
@ -133,9 +143,6 @@
} }
.contact-name { .contact-name {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 0; padding: 0;
margin: 0; margin: 0;
max-width: 85%; max-width: 85%;
@ -154,7 +161,6 @@
/* Make this difference */ /* Make this difference */
} }
a, span { a, span {
overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
} }

2
sass/_variables.scss
View File

@ -1,7 +1,7 @@
$mobile_landscape_height: 450px !default; $mobile_landscape_height: 450px !default;
$mobile_portrait_length: 480px !default; $mobile_portrait_length: 480px !default;
#conversejs, #conversejs-bg, .converse-fullscreen { #conversejs, #conversejs-bg, body.converse-fullscreen {
--subdued-color: #A8ABA1; --subdued-color: #A8ABA1;
--green: #3AA569; --green: #3AA569;

2
src/plugins/rosterview/templates/roster_item.js
View File

@ -7,7 +7,7 @@ export default (o) => {
const i18n_chat = __('Click to chat with %1$s (XMPP address: %2$s)', o.display_name, o.jid); const i18n_chat = __('Click to chat with %1$s (XMPP address: %2$s)', o.display_name, o.jid);
const i18n_remove = __('Click to remove %1$s as a contact', o.display_name); const i18n_remove = __('Click to remove %1$s as a contact', o.display_name);
return html` return html`
<a class="list-item-link cbox-list-item open-chat w-100 ${ o.num_unread ? 'unread-msgs' : '' }" title="${i18n_chat}" href="#" @click=${o.openChat}> <a class="list-item-link cbox-list-item open-chat ${ o.num_unread ? 'unread-msgs' : '' }" title="${i18n_chat}" href="#" @click=${o.openChat}>
${ renderAvatar(o.getAvatarData()) } ${ renderAvatar(o.getAvatarData()) }
<span class="${o.status_icon}" title="${o.desc_status}"></span> <span class="${o.status_icon}" title="${o.desc_status}"></span>
${ o.num_unread ? html`<span class="msgs-indicator">${ o.num_unread }</span>` : '' } ${ o.num_unread ? html`<span class="msgs-indicator">${ o.num_unread }</span>` : '' }