CSS tweaks for the embedded demo
This commit is contained in:
parent
da23015ced
commit
78b945ed7b
@ -5,10 +5,17 @@
|
||||
*/
|
||||
/* $font-path: "../fonticons/fonts/" !default; */
|
||||
#converse-embedded-chat {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
bottom: auto;
|
||||
right: auto;
|
||||
position: relative;
|
||||
width: 100%; }
|
||||
#converse-embedded-chat *, #converse-embedded-chat *:before, #converse-embedded-chat *:after {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; }
|
||||
#converse-embedded-chat .chatroom {
|
||||
width: auto; }
|
||||
#converse-embedded-chat .flyout {
|
||||
@ -26,10 +33,13 @@
|
||||
display: none; }
|
||||
#converse-embedded-chat .chatroom .box-flyout {
|
||||
min-width: auto;
|
||||
width: 100%; }
|
||||
width: 100%;
|
||||
height: 90vh; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chat-body {
|
||||
height: -webkit-calc(100% - 55px);
|
||||
height: calc(100% - 55px); }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chat-content {
|
||||
height: calc(100% - 97px); }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .chatroom-form-container {
|
||||
height: auto;
|
||||
position: relative; }
|
||||
|
@ -1656,6 +1656,7 @@
|
||||
resize: none; }
|
||||
#converse-embedded-chat .chatbox form.sendXMPPMessage .chat-toolbar,
|
||||
#conversejs .chatbox form.sendXMPPMessage .chat-toolbar {
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
@ -1664,7 +1665,10 @@
|
||||
background-color: #FFF5EE; }
|
||||
#converse-embedded-chat .chatbox form.sendXMPPMessage .chat-toolbar a,
|
||||
#conversejs .chatbox form.sendXMPPMessage .chat-toolbar a {
|
||||
color: #2A9D8F; }
|
||||
font-size: 14px;
|
||||
color: #2A9D8F;
|
||||
text-decoration: none;
|
||||
text-shadow: none; }
|
||||
#converse-embedded-chat .chatbox form.sendXMPPMessage .chat-toolbar .chat-toolbar-text,
|
||||
#conversejs .chatbox form.sendXMPPMessage .chat-toolbar .chat-toolbar-text {
|
||||
font-size: 12px;
|
||||
@ -1720,6 +1724,9 @@
|
||||
#converse-embedded-chat .chatbox form.sendXMPPMessage .chat-toolbar ul li a:hover,
|
||||
#conversejs .chatbox form.sendXMPPMessage .chat-toolbar ul li a:hover {
|
||||
color: #8f2831; }
|
||||
#converse-embedded-chat .chatbox form.sendXMPPMessage .chat-toolbar li,
|
||||
#conversejs .chatbox form.sendXMPPMessage .chat-toolbar li {
|
||||
margin-left: 0; }
|
||||
#converse-embedded-chat .chatbox form.sendXMPPMessage .chat-toolbar .toggle-smiley,
|
||||
#conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-smiley {
|
||||
color: #2A9D8F;
|
||||
@ -2346,7 +2353,7 @@
|
||||
border: 0;
|
||||
color: #818479;
|
||||
font-size: 14px;
|
||||
height: 289px;
|
||||
height: 100%;
|
||||
height: -webkit-calc(100% - 55px);
|
||||
height: calc(100% - 55px);
|
||||
overflow-y: auto;
|
||||
|
@ -256,6 +256,7 @@
|
||||
resize: none;
|
||||
}
|
||||
.chat-toolbar {
|
||||
box-sizing: border-box;
|
||||
font-size: $font-size;
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
@ -263,7 +264,10 @@
|
||||
display: block;
|
||||
background-color: $toolbar-color;
|
||||
a {
|
||||
font-size: $font-size;
|
||||
color: $link-color;
|
||||
text-decoration: none;
|
||||
text-shadow: none;
|
||||
}
|
||||
.chat-toolbar-text {
|
||||
font-size: 12px;
|
||||
@ -315,6 +319,9 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
li {
|
||||
margin-left: 0;
|
||||
}
|
||||
.toggle-smiley {
|
||||
color: $link-color;
|
||||
padding-left: 5px;
|
||||
|
@ -1,6 +1,12 @@
|
||||
@import "bourbon";
|
||||
@import "variables";
|
||||
#converse-embedded-chat {
|
||||
|
||||
@include box-sizing(border-box);
|
||||
*, *:before, *:after {
|
||||
@include box-sizing(border-box);
|
||||
}
|
||||
|
||||
bottom: auto;
|
||||
right: auto;
|
||||
position: relative;
|
||||
@ -32,9 +38,13 @@
|
||||
.box-flyout {
|
||||
min-width: auto;
|
||||
width: 100%;
|
||||
height: 90vh;
|
||||
.chat-body {
|
||||
@include calc(height, '100% - #{$chat-head-height}');
|
||||
}
|
||||
.chat-content {
|
||||
height: calc(100% - #{$toolbar-height + $chat-textarea-height +2px});
|
||||
}
|
||||
.chatroom-body {
|
||||
.chatroom-form-container {
|
||||
height: auto;
|
||||
|
Loading…
Reference in New Issue
Block a user