2 * Converse.js (Web-based XMPP instant messaging client)
3 * http://conversejs.org
5 * Copyright (c) 2012-2014, JC Brand <jc@opkode.com>
6 * Licensed under the Mozilla Public License
9 * Converse.js (Web-based XMPP instant messaging client)
10 * http://conversejs.org
12 * Copyright (c) 2012-2014, JC Brand <jc@opkode.com>
13 * Licensed under the Mozilla Public License
16 font-family: 'Converse-js';
17 src: url("../fonticons/fonts/icomoon.eot?-mnoxh0");
18 src: url("../fonticons/fonts/icomoon.eot?#iefix-mnoxh0") format("embedded-opentype"), url("../fonticons/fonts/icomoon.woff?-mnoxh0") format("woff"), url("../fonticons/fonts/icomoon.ttf?-mnoxh0") format("truetype"), url("../fonticons/fonts/icomoon.svg?-mnoxh0#icomoon") format("svg");
22 font-family: 'Converse-js';
29 /* Better Font Rendering =========== */
30 -webkit-font-smoothing: antialiased;
31 -moz-osx-font-smoothing: grayscale; }
33 .icon-conversejs:before {
48 -webkit-box-sizing: border-box;
49 -moz-box-sizing: border-box;
50 box-sizing: border-box;
52 /* status dropdown styles */ }
53 #conversejs ::selection {
54 background-color: #E1E6E5; }
55 #conversejs ::-moz-selection {
56 background-color: #E1E6E5; }
57 #conversejs *, #conversejs *:before, #conversejs *:after {
58 -webkit-box-sizing: border-box;
59 -moz-box-sizing: border-box;
60 box-sizing: border-box; }
61 @media screen and (max-width: 480px) {
67 #conversejs a, #conversejs a:visited {
68 text-decoration: none;
73 #conversejs div, #conversejs span, #conversejs h1, #conversejs h2, #conversejs h3, #conversejs h4, #conversejs h5, #conversejs h6, #conversejs p, #conversejs blockquote,
74 #conversejs pre, #conversejs a, #conversejs em, #conversejs img, #conversejs strong, #conversejs dl, #conversejs dt, #conversejs dd, #conversejs ol, #conversejs ul, #conversejs li,
75 #conversejs fieldset, #conversejs form, #conversejs label, #conversejs legend, #conversejs table, #conversejs caption, #conversejs tbody,
76 #conversejs tfoot, #conversejs thead, #conversejs tr, #conversejs th, #conversejs td, #conversejs article, #conversejs aside, #conversejs canvas, #conversejs details,
77 #conversejs embed, #conversejs figure, #conversejs figcaption, #conversejs footer, #conversejs header, #conversejs hgroup, #conversejs menu,
78 #conversejs nav, #conversejs output, #conversejs ruby, #conversejs section, #conversejs summary, #conversejs time, #conversejs mark, #conversejs audio, #conversejs video {
83 vertical-align: baseline; }
85 #conversejs input[type=submit], #conversejs input[type=button],
86 #conversejs input[type=text], #conversejs input[type=password],
91 #conversejs input[type=text] {
95 #conversejs ol, #conversejs ul {
99 #conversejs ul, #conversejs ol, #conversejs dl {
102 #conversejs [data-icon]:before {
103 content: attr(data-icon);
104 font-family: 'Converse-js';
105 font-variant: normal;
109 text-transform: none;
110 /* Better Font Rendering =========== */
111 -webkit-font-smoothing: antialiased;
112 -moz-osx-font-smoothing: grayscale; }
113 #conversejs [class^="icon-"], #conversejs [class*=" icon-"] {
114 background-position: 14px 14px;
115 background-image: none;
116 font-family: 'Converse-js', sans-serif;
118 font-variant: normal;
124 text-transform: none;
125 /* Better Font Rendering =========== */
126 -webkit-font-smoothing: antialiased;
127 -moz-osx-font-smoothing: grayscale; }
128 #conversejs .icon-address-book:before {
130 #conversejs .icon-angry:before {
132 #conversejs .icon-attachment:before {
134 #conversejs .icon-away:before {
136 #conversejs .icon-blocked:before {
138 #conversejs .icon-bold:before {
140 #conversejs .icon-bubbles-2:before {
142 #conversejs .icon-bubbles-3:before {
144 #conversejs .icon-bubbles:before {
146 #conversejs .icon-camera-2:before {
148 #conversejs .icon-camera:before {
150 #conversejs .icon-cancel-circle:before {
152 #conversejs .icon-checkbox-checked:before {
154 #conversejs .icon-checkbox-partial:before {
156 #conversejs .icon-checkbox-unchecked:before {
158 #conversejs .icon-checkmark:before {
160 #conversejs .icon-close:before {
162 #conversejs .icon-closed:before {
164 #conversejs .icon-cog:before {
166 #conversejs .icon-cogs:before {
168 #conversejs .icon-confused:before {
170 #conversejs .icon-cool:before {
172 #conversejs .icon-dnd:before {
174 #conversejs .icon-envelop:before {
176 #conversejs .icon-evil:before {
178 #conversejs .icon-eye-blocked:before {
180 #conversejs .icon-eye:before {
182 #conversejs .icon-globe:before {
184 #conversejs .icon-grin:before {
186 #conversejs .icon-happy:before {
188 #conversejs .icon-headphones:before {
190 #conversejs .icon-heart:before {
192 #conversejs .icon-hide-users:before {
194 #conversejs .icon-home:before {
196 #conversejs .icon-image:before {
198 #conversejs .icon-info:before {
200 #conversejs .icon-italic:before {
202 #conversejs .icon-key-2:before {
204 #conversejs .icon-key:before {
206 #conversejs .icon-lock-2:before {
208 #conversejs .icon-lock:before {
210 #conversejs .icon-logout:before {
212 #conversejs .icon-minus:before {
214 #conversejs .icon-music:before {
216 #conversejs .icon-new-tab:before {
218 #conversejs .icon-newspaper:before {
220 #conversejs .icon-notebook:before {
222 #conversejs .icon-notification:before {
224 #conversejs .icon-online:before {
226 #conversejs .icon-chat:before {
228 #conversejs .icon-opened:before {
230 #conversejs .icon-pencil:before {
232 #conversejs .icon-phone-hang-up:before {
234 #conversejs .icon-phone:before {
236 #conversejs .icon-play:before {
238 #conversejs .icon-plus:before {
240 #conversejs .icon-pushpin:before {
242 #conversejs .icon-quotes-left:before {
244 #conversejs .icon-radio-checked:before {
246 #conversejs .icon-radio-unchecked:before {
248 #conversejs .icon-remove:before {
250 #conversejs .icon-room-info:before {
252 #conversejs .icon-sad:before {
254 #conversejs .icon-search:before {
256 #conversejs .icon-shocked:before {
258 #conversejs .icon-show-users:before {
260 #conversejs .icon-smiley:before {
262 #conversejs .icon-spell-check:before {
264 #conversejs .icon-spinner:before {
266 #conversejs .icon-strikethrough:before {
268 #conversejs .icon-thumbs-up:before {
270 #conversejs .icon-tongue:before {
272 #conversejs .icon-underline:before {
274 #conversejs .icon-unlocked:before {
276 #conversejs .icon-user:before {
278 #conversejs .icon-users:before {
280 #conversejs .icon-volume-decrease:before {
282 #conversejs .icon-volume-high:before {
284 #conversejs .icon-volume-increase:before {
286 #conversejs .icon-volume-low:before {
288 #conversejs .icon-volume-medium:before {
290 #conversejs .icon-volume-mute-2:before {
292 #conversejs .icon-volume-mute:before {
294 #conversejs .icon-warning:before {
296 #conversejs .icon-wink:before {
298 #conversejs .icon-wondering:before {
300 #conversejs .icon-wrench:before {
302 #conversejs .icon-xa:before {
304 #conversejs .icon-unavailable:before,
305 #conversejs .icon-offline:before {
307 #conversejs .icon-youtube:before {
309 #conversejs .icon-zoom-in:before {
311 #conversejs .icon-zoom-out:before {
313 #conversejs .no-text-select {
314 -webkit-touch-callout: none;
315 -webkit-user-select: none;
316 -moz-user-select: none;
317 -ms-user-select: none;
319 #conversejs .emoticon {
325 #conversejs .hidden {
327 #conversejs .locked {
328 padding-right: 22px; }
329 @-webkit-keyframes spin {
331 -webkit-transform: rotate(0deg); }
333 -webkit-transform: rotate(359deg); } }
334 @-moz-keyframes spin {
336 -moz-transform: rotate(0deg); }
338 -moz-transform: rotate(359deg); } }
341 -webkit-transform: rotate(0deg);
342 -moz-transform: rotate(0deg);
343 -ms-transform: rotate(0deg);
344 -o-transform: rotate(0deg);
345 transform: rotate(0deg); }
347 -webkit-transform: rotate(359deg);
348 -moz-transform: rotate(359deg);
349 -ms-transform: rotate(359deg);
350 -o-transform: rotate(359deg);
351 transform: rotate(359deg); } }
352 #conversejs .spinner:before {
354 font-family: 'Converse-js' !important;
356 #conversejs .spinner {
357 -webkit-animation: spin 2s infinite, linear;
358 -moz-animation: spin 2s infinite, linear;
359 animation: spin 2s infinite, linear;
363 #conversejs .centered {
367 #conversejs .hor_centered {
372 #conversejs .toggle-controlbox,
373 #conversejs #minimized-chats {
374 border-top-left-radius: 4px;
375 border-top-right-radius: 4px;
379 #conversejs .toggle-controlbox {
380 background-color: #555;
383 padding: 10px 8px 0 8px; }
384 #conversejs .toggle-controlbox span {
386 #conversejs .button-group,
387 #conversejs .input-button-group {
389 #conversejs .button-group {
391 #conversejs .input-button-group button,
392 #conversejs .input-button-group input {
393 display: table-cell; }
394 #conversejs #minimized-chats {
400 #conversejs #minimized-chats #toggle-minimized-chats {
401 border-top-left-radius: 4px;
402 border-top-right-radius: 4px;
403 background-color: #CCC;
409 text-align: center; }
410 #conversejs #minimized-chats .unread-message-count,
411 #conversejs #minimized-chats .chat-head-message-count {
413 background-color: #f6f6f6;
414 background-image: -webkit-linear-gradient(#f6f6f6 5%, #808080 100%);
415 background-image: linear-gradient(#f6f6f6 5%, #808080 100%);
417 text-shadow: 1px 1px 0 #FAFAFA;
426 #conversejs #minimized-chats .box-flyout {
432 #conversejs #minimized-chats .box-flyout .chat-head {
435 padding: 3px 0 0 5px;
437 box-shadow: 1px 3px 5px 3px rgba(0, 0, 0, 0.4);
440 #conversejs .chat-body {
441 background-color: white;
442 border-bottom-right-radius: 4px;
443 border-bottom-left-radius: 4px;
445 height: -webkit-calc(100% - 44px);
446 height: calc(100% - 44px);
448 #conversejs .chat-body p {
453 #conversejs .tt-highlight {
454 background-color: #00230F; }
455 #conversejs .tt-suggestion p {
457 text-shadow: rgba(0, 0, 0, 0.51) 0 -1px 0;
460 #conversejs .tt-suggestion p:hover {
461 background-color: #00230F; }
462 #conversejs .tt-suggestion p:hover .tt-highlight {
463 background-color: #00230F;
464 background: #27774A; }
465 #conversejs .tt-dropdown-menu {
471 text-overflow: ellipsis;
473 border-bottom-right-radius: 4px;
474 border-bottom-left-radius: 4px; }
475 #conversejs .chat-blink {
476 background-color: #176679;
477 border-right: 1px solid #176679;
478 border-left: 1px solid #176679; }
479 #conversejs .chat-content {
486 background-color: #ffffff;
489 height: calc(100% - 89px); }
490 #conversejs .chat-info {
492 #conversejs .chat-error {
495 #conversejs .chat-error,
496 #conversejs .chat-info,
497 #conversejs .chat-message {
499 #conversejs .chat-message-room,
500 #conversejs .chat-message-them,
501 #conversejs .chat-message-me {
505 text-overflow: ellipsis;
507 display: inline-block;
509 padding-right: 3px; }
510 #conversejs .chat-message-content {
511 word-wrap: break-word; }
512 #conversejs .chat-message-room,
513 #conversejs .chat-message-them {
515 #conversejs .chat-message-me {
517 #conversejs .chat-event,
518 #conversejs .chat-date,
519 #conversejs .chat-info {
521 #conversejs li.chat-info {
522 padding-left: 10px; }
523 #conversejs .chat-date {
524 display: inline-block;
526 #conversejs .not-implemented {
530 #conversejs .mentioned {
532 #conversejs .delayed .chat-message-them {
534 #conversejs .delayed .chat-message-me {
538 #conversejs input.error {
539 border: 1px solid red; }
540 #conversejs .reg-feedback {
542 #conversejs .reg-feedback,
543 #conversejs #converse-login .conn-feedback {
547 #conversejs .chat-message-error {
550 font-weight: normal; }
551 #conversejs a.restore-chat,
552 #conversejs .chat-title {
553 padding: 1px 0 1px 5px;
559 text-overflow: ellipsis;
561 text-shadow: rgba(0, 0, 0, 0.51) 0 -1px 0; }
562 #conversejs a.restore-chat:visited {
564 #conversejs .chat-title a {
567 text-overflow: ellipsis;
568 white-space: nowrap; }
569 #conversejs .chat-head-chatbox,
570 #conversejs .chat-head-chatroom {
574 #conversejs .chat-head-chatroom {
575 background-color: #555; }
576 #conversejs .chat-head-chatbox {
577 background-color: #555; }
578 #conversejs .user-custom-message,
579 #conversejs .chatroom-topic {
585 text-overflow: ellipsis;
588 padding: 1px 0 1px 5px; }
589 #conversejs .activated {
590 display: block !important; }
591 #conversejs a.subscribe-to-user {
594 #conversejs dl.add-converse-contact {
595 margin: 0 0.5em 0.75em 0.5em; }
596 #conversejs .fancy-dropdown {
597 border: 1px solid #EEE;
600 #conversejs .fancy-dropdown .choose-xmpp-status {
602 #conversejs .fancy-dropdown .choose-xmpp-status span {
606 #conversejs .fancy-dropdown .choose-xmpp-status,
607 #conversejs .fancy-dropdown .toggle-xmpp-contact-form {
608 text-shadow: 0 1px 0 #ffffff;
610 text-overflow: ellipsis;
613 #conversejs .fancy-dropdown .toggle-xmpp-contact-form span {
615 #conversejs #fancy-xmpp-status-select a.change-xmpp-status-message {
622 #conversejs ul#found-users {
623 padding: 10px 0 5px 5px;
625 #conversejs form.search-xmpp-contact {
628 padding: 0 0 5px 5px; }
629 #conversejs form.search-xmpp-contact input {
631 #conversejs a.configure-chatroom-button,
632 #conversejs a.toggle-chatbox-button,
633 #conversejs a.close-chatbox-button {
635 border: 1px solid #888;
638 display: inline-block;
646 text-decoration: none; }
647 #conversejs a.configure-chatroom-button:active,
648 #conversejs a.toggle-chatbox-button:active,
649 #conversejs a.close-chatbox-button:active {
652 #conversejs .chatroom-form-container {
656 border-bottom-right-radius: 4px;
657 border-bottom-left-radius: 4px; }
658 #conversejs .chatroom-form {
660 #conversejs .chatroom-form .instructions {
663 #conversejs .chatroom-form input {
666 text-align: center; }
667 #conversejs .chatroom-form legend {
670 margin: 10px 0 15px 0; }
671 #conversejs .chatroom-form label {
676 #conversejs .chatroom-form label label input, #conversejs .chatroom-form label label select {
678 #conversejs .requesting-xmpp-contact .request-actions {
681 #conversejs #converse-roster {
687 height: calc(100% - 50px - 20px);
689 /* (jQ addClass:) if input has value: */
690 /* (jQ addClass:) if mouse is over the 'x' input area*/ }
691 #conversejs #converse-roster.no-contact-requests {
692 height: calc(100% - 25px - 20px); }
693 #conversejs #converse-roster .filter-type {
698 margin: 0 0 0.5em -1px;
701 #conversejs #converse-roster .roster-filter {
703 background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg==) no-repeat right -20px center;
704 border: 1px solid #999;
707 margin: 0 0 0.5em 7px;
711 #conversejs #converse-roster .roster-filter.x {
712 background-position: right 3px center; }
713 #conversejs #converse-roster .roster-filter.onX {
715 #conversejs #converse-roster .roster-contacts {
718 max-height: calc(100% - 44px);
721 padding-bottom: 15px; }
722 #conversejs #converse-roster .group-toggle {
726 #conversejs #converse-roster dt {
728 #conversejs #converse-roster dd {
730 padding: 4px 2px 0 4px;
732 #conversejs #converse-roster dd a, #conversejs #converse-roster dd span {
733 text-shadow: 0 1px 0 #FAFAFA;
734 display: inline-block;
737 text-overflow: ellipsis;
739 #conversejs #converse-roster dd span {
740 padding: 0 5px 0 0; }
741 #conversejs #converse-roster dd a.decline-xmpp-request {
743 #conversejs #converse-roster dd a.remove-xmpp-contact {
749 #conversejs #converse-roster dd:hover a.remove-xmpp-contact {
750 display: inline-block; }
751 #conversejs #converse-roster dd.odd {
752 background-color: #DCEAC5;
753 /* Make this difference */ }
754 #conversejs #converse-roster dd.current-xmpp-contact span {
758 #conversejs #converse-roster dd a.open-chat {
760 #conversejs #converse-roster span.pending-contact-name {
762 #conversejs #converse-roster span.req-contact-name {
765 #conversejs #available-chatrooms {
767 #conversejs #available-chatrooms dt,
768 #conversejs #converse-roster dt {
773 text-shadow: 0 1px 0 #FAFAFA; }
774 #conversejs .room-info {
777 font-weight: normal; }
778 #conversejs li.room-info {
781 #conversejs div.room-info {
784 #conversejs p.room-info {
788 white-space: normal; }
789 #conversejs a.room-info {
793 #conversejs a.open-room {
796 text-overflow: ellipsis;
797 overflow-x: hidden; }
798 #conversejs dd.available-chatroom {
805 padding: 0.25em 0.5em;
806 text-overflow: ellipsis;
807 text-shadow: 0 1px 0 #FAFAFA;
808 white-space: nowrap; }
809 #conversejs dd.available-chatroom a.open-room {
811 #conversejs dd.available-chatroom:hover {
812 background-color: #E1E6E5; }
813 #conversejs dd.available-chatroom:hover .room-info {
816 #conversejs #converse-roster dd {
823 text-shadow: 0 1px 0 #FAFAFA; }
824 #conversejs .roster-group:hover,
825 #conversejs #converse-roster dd:hover {
826 background-color: #E1E6E5; }
827 #conversejs .chatbox,
828 #conversejs .chatroom {
833 @media screen and (max-width: 480px) {
834 #conversejs .chatbox,
835 #conversejs .chatroom {
837 #conversejs .chatbox {
839 @media screen and (max-width: 480px) {
840 #conversejs .chatbox {
842 #conversejs .chatbox .box-flyout {
845 @media screen and (max-width: 480px) {
846 #conversejs .chatbox .box-flyout {
848 #conversejs .chatbox .dropdown a {
850 display: inline-block;
852 #conversejs .chatbox .dropdown li {
855 #conversejs .chatbox .dropdown dd ul {
861 border: 1px solid #E5E9E8;
864 background-color: #EEE; }
865 #conversejs .chatbox .dropdown dd ul li:hover {
866 background-color: #E1E6E5; }
867 #conversejs .chatbox .dropdown dd.search-xmpp ul {
868 box-shadow: 1px 4px 10px 1px rgba(0, 0, 0, 0.4); }
869 #conversejs .chatbox .dropdown dd.search-xmpp ul li:hover {
870 background-color: #EEE; }
871 #conversejs .chatbox .dropdown dt a span {
874 padding: 4px 7px 0 5px; }
875 #conversejs .chatroom {
877 #conversejs .chatroom .box-flyout {
879 @media screen and (max-width: 480px) {
880 #conversejs .chatroom {
882 #conversejs .chatroom .box-flyout {
884 #conversejs .chatroom label {
887 #conversejs .chatroom .participant-list {
889 #conversejs .chatroom .participant-list li {
896 text-overflow: ellipsis;
897 white-space: nowrap; }
898 #conversejs .chatroom .participant-list li.moderator {
900 #conversejs .chatroom .chat-textarea {
901 border-bottom-right-radius: 0; }
902 #conversejs .chatroom .chat-area {
906 #conversejs .chatroom .invited-contact {
907 margin: -1px 0 0 -1px;
909 border: 1px solid #999; }
910 #conversejs .chatroom .invited-contact.tt-input {
911 background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkBCjE0uzKkOgAAAidJREFUKM+N0k+IEnEUB/D3cyscdagkWpHV0WGWREXm0AgOGkSJ07kh2UXYU5cOewm6Bp0KXG/tpSCv6hyEFQIhMEaE3yERYfwTOoqKGLQxDAbqYadLgu7J7/XxeY/3ez8EACDLsgljfMfj8ZxUKhXXYDAAnueBoqgyAMipVOovXAuSZdnUaDQeDofDs16vFyUIAjRNUwmCoG02G1AUdZ5IJN7GYrHfm3AvEAjcnUwmX0ajUdRqtV74fL6sruufKYoa6bp+fzabPUMI7ZfL5eImNHk8npNerxc1m80XHMe98fv9H3K5XDkSibxjWfb1arWaYoyPMMbCFqxUKi6CIODw8LDmdDq7oigaAACiKK5omv7KcdylpmlIkiTHFlRVFTRNUxVFqa/ROqIoGoqi5A3DgFartfU4Jp7ngSAI2uVyPZIk6dZmUZKk2w6H4xghBPF4HK7vWLbZbDCdTp+rqvpUkiS0RvV6/bTf7x8wDHMViURqm/AGAMgURZ232+1X1Wr102KxuEwmk3lZlo/7/f7BcrkkSZKs2e12tHXH/x/gHsY4jTE+0jQNGYYBCCFgGOaKJMkfjUaDZximGQ6HXzSbzZ+ZTMbY6oIxFgqFgqPT6YAgCMBxXM1ut6N0Op0fj8chi8XyjWXZ98Fg8DuCHZLNZh+USqWP8/n8idvt/hUKhV7u7QK9Xu8fmqanAJBQVXUfAGY7TQQAKBaLN8fjsdDtdh/run72Dzhf7XLe2UevAAAAAElFTkSuQmCC) no-repeat right 3px center; }
912 #conversejs .chatroom .participants {
914 background-color: white;
917 border-left: 1px solid #AAA;
918 border-bottom-right-radius: 4px;
921 #conversejs .chatroom .participants label {
926 #conversejs .chatroom-form,
927 #conversejs .controlbox-pane {
928 background-color: white;
929 border-bottom-left-radius: 4px;
930 border-bottom-right-radius: 4px;
938 height: -webkit-calc(100% - 44px);
939 height: calc(100% - 44px); }
940 #conversejs .controlbox-pane {
942 overflow-x: hidden; }
943 #conversejs .controlbox-pane dd {
946 #conversejs .controlbox-pane dd.odd {
947 background-color: #DCEAC5; }
948 #conversejs #converse-register {
950 #conversejs #converse-register .title {
952 #conversejs #converse-register .info {
957 #conversejs #converse-register .form-errors {
960 #conversejs #converse-register .provider-title {
962 #conversejs #converse-register .provider-score {
964 margin-bottom: 8px; }
965 #conversejs #converse-register .form-help .url {
968 #conversejs #converse-register .input-group {
972 #conversejs #converse-register .input-group span {
974 text-overflow: ellipsis;
976 #conversejs #converse-register .input-group span, #conversejs #converse-register .input-group input[name=username] {
979 #conversejs #converse-register .instructions {
982 #conversejs #converse-register .instructions:hover {
984 #conversejs #converse-register, #conversejs #converse-login {
985 margin: 2em 1em 1em 1em;
987 #conversejs #converse-register .login-submit, #conversejs #converse-register .submit, #conversejs #converse-login .login-submit, #conversejs #converse-login .submit {
991 #conversejs #converse-register .submit, #conversejs #converse-login .submit {
993 #conversejs #converse-register .login-anon, #conversejs #converse-login .login-anon {
995 white-space: normal; }
996 #conversejs #converse-register .cancel-submit, #conversejs #converse-register .save-submit, #conversejs #converse-login .cancel-submit, #conversejs #converse-login .save-submit {
998 margin: 5px 3px 5px 3px; }
999 #conversejs #converse-register .cancel, #conversejs #converse-register .cancel-submit, #conversejs #converse-login .cancel, #conversejs #converse-login .cancel-submit {
1001 #conversejs #converse-register .save-submit, #conversejs #converse-login .save-submit {
1003 #conversejs #converse-register input, #conversejs #converse-login input {
1006 margin: 5px 0 10px 0;
1007 padding-left: 0.5em; }
1008 #conversejs .form-help {
1012 #conversejs .form-help:hover {
1014 #conversejs .chatroom-form label,
1015 #conversejs .controlbox-pane label,
1016 #conversejs #converse-register label,
1017 #conversejs #converse-login label {
1022 #conversejs form.add-chatroom {
1025 #conversejs form.add-chatroom input[type=button],
1026 #conversejs form.add-chatroom input[type=submit],
1027 #conversejs form.add-chatroom input[type=text] {
1031 #conversejs form.add-chatroom span.spinner,
1032 #conversejs form.add-chatroom input[type=button],
1033 #conversejs form.add-chatroom input[type=submit] {
1035 display: table-cell;
1037 #conversejs form.add-chatroom input[type=submit] {
1039 #conversejs select#select-xmpp-status {
1041 margin-right: 0.5em; }
1042 #conversejs .chat-head {
1043 border-top-left-radius: 4px;
1044 border-top-right-radius: 4px;
1049 #conversejs .chat-head.controlbox-head {
1050 background-color: #555;
1051 border-top-left-radius: 4px;
1052 border-top-right-radius: 4px;
1056 padding: 6px 6px 6px 0; }
1057 #conversejs .chat-head .avatar {
1059 #conversejs .chat-head #controlbox-tabs {
1064 list-style-type: none;
1066 #conversejs .chat-head #controlbox-tabs a.current,
1067 #conversejs .chat-head #controlbox-tabs a.current:hover {
1073 #conversejs .chat-head #controlbox-tabs li {
1077 text-shadow: white 0 1px 0;
1079 #conversejs .chat-head #controlbox-tabs li a {
1080 background-color: white;
1081 border-bottom: 1px solid #CCC;
1082 border-top-left-radius: 4px;
1083 border-top-right-radius: 4px;
1084 box-shadow: inset 2px -2px 20px rgba(0, 0, 0, 0.3);
1092 text-decoration: none; }
1093 #conversejs .chat-head #controlbox-tabs li a:hover {
1095 #conversejs div#chatrooms {
1097 #conversejs form.sendXMPPMessage {
1098 -moz-background-clip: padding;
1099 -moz-border-radius: 4px;
1100 -webkit-background-clip: padding-box;
1101 -webkit-border-radius: 4px;
1102 background-clip: padding-box;
1105 border-top-left-radius: 0;
1106 border-top-right-radius: 0;
1107 border-top: 1px solid #BBB;
1114 @media screen and (max-width: 480px) {
1115 #conversejs form.sendXMPPMessage {
1117 #conversejs form.sendXMPPMessage .chat-textarea {
1118 border-bottom-left-radius: 4px;
1119 border-bottom-right-radius: 4px;
1125 #conversejs .chat-toolbar {
1131 background-color: #EEE; }
1132 #conversejs .chat-toolbar a {
1134 #conversejs .chat-toolbar .unencrypted a,
1135 #conversejs .chat-toolbar .unencrypted {
1137 #conversejs .chat-toolbar .unverified a,
1138 #conversejs .chat-toolbar .unverified {
1140 #conversejs .chat-toolbar .private a,
1141 #conversejs .chat-toolbar .private {
1143 #conversejs .chat-toolbar .toggle-participants,
1144 #conversejs .chat-toolbar .toggle-clear,
1145 #conversejs .chat-toolbar .toggle-otr {
1147 #conversejs .chat-toolbar li {
1148 display: inline-block;
1150 padding: 0 3px 0 3px;
1153 #conversejs .chat-toolbar li:hover {
1155 #conversejs .chat-toolbar ul {
1158 box-shadow: -1px -1px 2px 0 rgba(0, 0, 0, 0.4);
1164 #conversejs .chat-toolbar ul li {
1167 position: relative; }
1168 #conversejs .chat-toolbar ul li a:hover {
1170 #conversejs .chat-toolbar .toggle-smiley {
1172 padding-left: 5px; }
1173 #conversejs .chat-toolbar .toggle-smiley ul li {
1177 #conversejs .chat-toolbar .toggle-smiley ul li:hover {
1178 background-color: #E1E6E5; }
1179 #conversejs .chat-toolbar .toggle-otr ul li {
1181 background-color: white;
1184 #conversejs .chat-toolbar .toggle-otr ul li a {
1185 -moz-transition: background-color 0.2s ease-in-out;
1186 -webkit-transition: background-color 0.2s ease-in-out;
1187 transition: background-color 0.2s ease-in-out;
1190 text-decoration: none; }
1191 #conversejs .chat-toolbar .toggle-otr ul li:hover {
1192 background-color: #E1E6E5; }
1193 #conversejs .chat-toolbar-text {
1196 text-shadow: 0 1px 0 white; }
1197 #conversejs #set-custom-xmpp-status {
1200 #conversejs #set-custom-xmpp-status input {
1202 width: -webkit-calc(100% - 40px);
1203 width: calc(100% - 40px);
1204 padding: 0 0 0 0.5em; }
1205 #conversejs #set-custom-xmpp-status button {
1209 #conversejs .chat-textarea-chatbox-selected {
1210 border: 1px solid #578308;
1212 #conversejs .chat-textarea-chatroom-selected {
1213 border: 2px solid #436F64;
1215 #conversejs #controlbox {
1217 #conversejs #controlbox div.xmpp-status {
1219 #conversejs .chatbox .dropdown {
1220 background-color: #EEE; }
1221 #conversejs .chatbox .dropdown dd {
1222 position: relative; }
1223 #conversejs .chatbox .dropdown dd,
1224 #conversejs .dropdown dt,
1225 #conversejs .dropdown ul {
1228 #conversejs .add-xmpp-contact {
1231 #conversejs .add-xmpp-contact input {
1234 #conversejs .add-xmpp-contact button {
1236 #conversejs .xmpp-status-menu {
1238 box-shadow: 1px 4px 10px 1px rgba(0, 0, 0, 0.4); }
1239 #conversejs .xmpp-status-menu li {
1241 #conversejs .xmpp-status-menu li a {
1244 #conversejs .xmpp-status-menu li a.logout,
1245 #conversejs .xmpp-status-menu li a.logout span {
1247 #conversejs .set-xmpp-status {
1249 padding: 0.75em 0.5em 0.5em 0.5em; }
1250 #conversejs .set-xmpp-status .dropdown dd ul {
1252 #conversejs .minimized-chats-flyout,
1253 #conversejs .box-flyout {
1256 box-shadow: 1px 3px 5px 3px rgba(0, 0, 0, 0.4);
1259 position: absolute; }
1260 @media screen and (max-width: 480px) {
1261 #conversejs .minimized-chats-flyout,
1262 #conversejs .box-flyout {
1264 #conversejs .minimized-chats-flyout {
1267 box-shadow: 1px 3px 5px 3px rgba(0, 0, 0, 0.4);
1272 #conversejs .minimized-chats-flyout .chat-head-chatroom,
1273 #conversejs .minimized-chats-flyout .chat-head {
1277 margin-bottom: 1px; }
1278 #conversejs .minimized-chats-flyout.minimized {
1280 #conversejs .dragresize {
1284 background: transparent;
1291 /*# sourceMappingURL=converse.css.map */