Fix emoji toolbar styling for embedded mode
This commit is contained in:
parent
adee252b28
commit
bacf9391c3
|
@ -8001,6 +8001,9 @@ body.reset {
|
||||||
#conversejs.converse-overlayed .chat-head .chatbox-buttons {
|
#conversejs.converse-overlayed .chat-head .chatbox-buttons {
|
||||||
flex: 0 0 33.3333333333%;
|
flex: 0 0 33.3333333333%;
|
||||||
max-width: 33.3333333333%; }
|
max-width: 33.3333333333%; }
|
||||||
|
#conversejs.converse-embedded .emoji-picker,
|
||||||
|
#conversejs.converse-overlayed .emoji-picker {
|
||||||
|
height: 200px; }
|
||||||
#conversejs.converse-embedded .chatbox,
|
#conversejs.converse-embedded .chatbox,
|
||||||
#conversejs.converse-overlayed .chatbox {
|
#conversejs.converse-overlayed .chatbox {
|
||||||
min-width: 250px !important;
|
min-width: 250px !important;
|
||||||
|
@ -8009,15 +8012,6 @@ body.reset {
|
||||||
#conversejs.converse-overlayed .chatbox .box-flyout {
|
#conversejs.converse-overlayed .chatbox .box-flyout {
|
||||||
min-width: 250px !important;
|
min-width: 250px !important;
|
||||||
width: 250px; }
|
width: 250px; }
|
||||||
#conversejs.converse-embedded .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu,
|
|
||||||
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu {
|
|
||||||
min-width: 235px; }
|
|
||||||
#conversejs.converse-embedded .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar,
|
|
||||||
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar {
|
|
||||||
width: 100%; }
|
|
||||||
#conversejs.converse-embedded .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar .emoji-category,
|
|
||||||
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar .emoji-category {
|
|
||||||
float: left; }
|
|
||||||
|
|
||||||
#conversejs.converse-overlayed .flyout {
|
#conversejs.converse-overlayed .flyout {
|
||||||
bottom: 1em; }
|
bottom: 1em; }
|
||||||
|
@ -8030,6 +8024,12 @@ body.reset {
|
||||||
max-height: 200px; }
|
max-height: 200px; }
|
||||||
#conversejs.converse-overlayed .emoji-picker {
|
#conversejs.converse-overlayed .emoji-picker {
|
||||||
height: 100px; }
|
height: 100px; }
|
||||||
|
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu {
|
||||||
|
min-width: 235px; }
|
||||||
|
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar {
|
||||||
|
width: 100%; }
|
||||||
|
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar .emoji-category {
|
||||||
|
float: left; }
|
||||||
|
|
||||||
@media (max-width: 767.98px) {
|
@media (max-width: 767.98px) {
|
||||||
#conversejs.converse-overlayed > .row {
|
#conversejs.converse-overlayed > .row {
|
||||||
|
|
|
@ -486,6 +486,10 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.emoji-picker {
|
||||||
|
height: $embedded-emoji-picker-height;
|
||||||
|
}
|
||||||
|
|
||||||
.chatbox {
|
.chatbox {
|
||||||
min-width: $overlayed-chat-width!important;
|
min-width: $overlayed-chat-width!important;
|
||||||
width: $overlayed-chat-width;
|
width: $overlayed-chat-width;
|
||||||
|
@ -495,26 +499,6 @@
|
||||||
width: $overlayed-chat-width;
|
width: $overlayed-chat-width;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.chatbox {
|
|
||||||
form.sendXMPPMessage {
|
|
||||||
.chat-toolbar {
|
|
||||||
li {
|
|
||||||
.toolbar-menu {
|
|
||||||
min-width: 235px;
|
|
||||||
|
|
||||||
ul {
|
|
||||||
&.emoji-toolbar {
|
|
||||||
width: 100%;
|
|
||||||
.emoji-category {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#conversejs.converse-overlayed {
|
#conversejs.converse-overlayed {
|
||||||
|
@ -534,6 +518,25 @@
|
||||||
.emoji-picker {
|
.emoji-picker {
|
||||||
height: $overlayed-emoji-picker-height;
|
height: $overlayed-emoji-picker-height;
|
||||||
}
|
}
|
||||||
|
.chatbox {
|
||||||
|
form.sendXMPPMessage {
|
||||||
|
.chat-toolbar {
|
||||||
|
li {
|
||||||
|
.toolbar-menu {
|
||||||
|
min-width: 235px;
|
||||||
|
ul {
|
||||||
|
&.emoji-toolbar {
|
||||||
|
width: 100%;
|
||||||
|
.emoji-category {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include media-breakpoint-down(sm) {
|
@include media-breakpoint-down(sm) {
|
||||||
|
|
|
@ -145,6 +145,8 @@ $line-height-huge: 27px !default;
|
||||||
|
|
||||||
$occupants-padding: 1em;
|
$occupants-padding: 1em;
|
||||||
|
|
||||||
|
$embedded-emoji-picker-height: 200px !default;
|
||||||
|
|
||||||
$fullpage-chat-head-height: 62px !default;
|
$fullpage-chat-head-height: 62px !default;
|
||||||
$fullpage-chat-height: 100vh;
|
$fullpage-chat-height: 100vh;
|
||||||
$fullpage-chat-width: 100%;
|
$fullpage-chat-width: 100%;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user