Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
25
0
Fork 0
Code Issues Pull Requests Projects Releases Activity
b889637f8d
xmpp.chapril.org-conversejs/css/converse-muc-embedded.css

65 lines
2.4 KiB
CSS
Raw Normal View History

Style the ::placeholder text to make it lighter.
2017-03-19 16:59:48 +01:00
/*
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
Color scheme helpers:
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
Updated color-scheme and fix conversejs icon offset
2017-06-15 11:02:20 +02:00
http://paletton.com/#uid=70a0u0kkNs+b4JOgryLpxqpsbkI
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
*/
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded {
CSS tweaks for the embedded demo
2017-02-03 00:16:15 +01:00
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
bottom: auto;
right: auto;
position: relative;
width: 100%; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded *, #conversejs.converse-embedded *:before, #conversejs.converse-embedded *:after {
CSS tweaks for the embedded demo
2017-02-03 00:16:15 +01:00
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }
More work on the "add chatroom" modal. Working now.
2018-02-22 15:51:44 +01:00
#conversejs.converse-embedded form.converse-centered-form {
CSS fixes. Move styles related to embedded chats to `css/converse-muc-embedded.css`
2017-02-13 12:46:28 +01:00
position: absolute;
top: 30%;
transform: translateY(-50%); }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
width: auto; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .flyout {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
bottom: auto;
display: block;
position: relative; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatbox {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
float: none; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatbox .box-flyout {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
box-shadow: none; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatbox .chat-title {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
padding: 0.3em;
Some css tweaks
2017-02-28 08:32:00 +01:00
font-size: 120%; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatbox-btn {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
display: none; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
min-width: auto;
CSS tweaks for the embedded demo
2017-02-03 00:16:15 +01:00
width: 100%;
Various style improvements related to embedded chats.
2017-02-03 13:26:14 +01:00
height: 55vh; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .chat-body {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
height: -webkit-calc(100% - 55px);
height: calc(100% - 55px); }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .occupants-heading {
Some css tweaks
2017-02-28 08:32:00 +01:00
font-size: 120%; }
Render chat head, content and message form as flex items.
2018-03-06 23:49:39 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .chat-content .chat-message {
margin: 0.5em;
font-size: 120%; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .sendXMPPMessage .chat-textarea {
Various style improvements related to embedded chats.
2017-02-03 13:26:14 +01:00
padding: 0.5em;
font-size: 110%; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .chatroom-form-container {
Various style improvements related to embedded chats.
2017-02-03 13:26:14 +01:00
font-size: 180%;
float: left;
height: 100%;
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
position: relative; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .chatroom-form-container input {
Various style improvements related to embedded chats.
2017-02-03 13:26:14 +01:00
font-size: 60%; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .occupants .occupant-list {
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
padding-left: 0.3em; }
Make `converse-muc-embedded` a core plugin. 1. Add a new `view_mode` value: `embedded`. This value is used to determine wether the `converse-muc-embedded` plugin is active or not. 2. Remove the need for the #converse-embedded-chat element. Instead we reuse the #conversejs element and embed inside that. 3. Removed the need to manually blacklist core plugins This is now done automatically if `view_mode` is set to `embedded`. Perhaps eventually we don't blacklist at all and instead use the `enable` plugin method. For some that probably won't work, like `converse-chatview`, which we still need to be active.
2018-02-09 16:33:48 +01:00
#conversejs.converse-embedded .chatroom .box-flyout .occupants .occupant-list li.occupant {
Various style improvements related to embedded chats.
2017-02-03 13:26:14 +01:00
font-size: 120%; }
Add initial demo of embedded MUC chat
2017-01-16 22:15:07 +01:00
/*# sourceMappingURL=converse-muc-embedded.css.map */
Reference in New Issue Copy Permalink