Wrap the emoji categories in overlay view

Otherwise we get an unwanted horizontal scrollbar
This commit is contained in:
JC Brand 2018-10-26 12:27:18 +02:00
parent 53b3f2d0d6
commit 9d8fe35e55
2 changed files with 17 additions and 4 deletions

View File

@ -9569,12 +9569,15 @@ 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 { #conversejs.converse-overlayed .chatbox .sendXMPPMessage .chat-toolbar li .toolbar-menu {
min-width: 235px; } min-width: 235px; }
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar { #conversejs.converse-overlayed .chatbox .sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar {
width: 100%; } width: 100%; }
#conversejs.converse-overlayed .chatbox form.sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar .emoji-category { #conversejs.converse-overlayed .chatbox .sendXMPPMessage .chat-toolbar li .toolbar-menu ul.emoji-toolbar .emoji-category {
float: left; } float: left; }
#conversejs.converse-overlayed .chatbox .sendXMPPMessage .chat-toolbar li.toggle-smiley .emoji-toolbar .emoji-category-picker ul {
flex-wrap: wrap;
justify-content: flex-start; }
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
#conversejs.converse-overlayed > .row { #conversejs.converse-overlayed > .row {

View File

@ -527,7 +527,7 @@
height: $overlayed-emoji-picker-height; height: $overlayed-emoji-picker-height;
} }
.chatbox { .chatbox {
form.sendXMPPMessage { .sendXMPPMessage {
.chat-toolbar { .chat-toolbar {
li { li {
.toolbar-menu { .toolbar-menu {
@ -541,6 +541,16 @@
} }
} }
} }
&.toggle-smiley {
.emoji-toolbar {
.emoji-category-picker {
ul {
flex-wrap: wrap;
justify-content: flex-start;
}
}
}
}
} }
} }
} }