diff --git a/css/converse.css b/css/converse.css index 88c16ad04..8e822e1ce 100644 --- a/css/converse.css +++ b/css/converse.css @@ -1185,23 +1185,6 @@ #converse-embedded-chat .emoticon, #conversejs .emoticon { font-size: 14px; } - #converse-embedded-chat .left, - #conversejs .left { - float: left; } - #converse-embedded-chat .right, - #conversejs .right { - float: right; } - #converse-embedded-chat .centered, - #conversejs .centered { - text-align: center; - display: block; - margin: 5em auto; } - #converse-embedded-chat .hor_centered, - #conversejs .hor_centered { - text-align: center; - display: block; - margin: 0 auto; - clear: both; } @keyframes fadein { 0% { opacity: 0; } @@ -1265,12 +1248,30 @@ animation: spin 2s infinite, linear; display: block; text-align: center; - margin: 5px; } + margin: 1em; } #converse-embedded-chat .spinner:before, #conversejs .spinner:before { font-size: 24px; font-family: 'Converse-js' !important; content: "\231b"; } + #converse-embedded-chat .left, + #conversejs .left { + float: left; } + #converse-embedded-chat .right, + #conversejs .right { + float: right; } + #converse-embedded-chat .centered, + #conversejs .centered { + text-align: center; + display: block; + margin: 0; + padding: 50% 0; } + #converse-embedded-chat .hor_centered, + #conversejs .hor_centered { + text-align: center; + display: block; + margin: 0 auto; + clear: both; } #converse-embedded-chat .button-group, #converse-embedded-chat .input-button-group, #conversejs .button-group, diff --git a/sass/_chatrooms.scss b/sass/_chatrooms.scss index 25ff2fc60..cc360360a 100644 --- a/sass/_chatrooms.scss +++ b/sass/_chatrooms.scss @@ -41,6 +41,10 @@ @media screen and (max-width: $mobile-portrait-length) { width: $mobile-chat-width; } + + .spinner { + } + .box-flyout { min-width: $chatroom-width; width: $chatroom-width; diff --git a/sass/_core.scss b/sass/_core.scss index 1b663e168..25bdb2da6 100644 --- a/sass/_core.scss +++ b/sass/_core.scss @@ -42,23 +42,6 @@ .emoticon { font-size: $font-size; } - .left { - float: left; - } - .right { - float: right; - } - .centered { - text-align: center; - display: block; - margin: 5em auto; - } - .hor_centered { - text-align: center; - display: block; - margin: 0 auto; - clear: both; - } @keyframes fadein { 0% { opacity: 0 } @@ -99,13 +82,31 @@ @include animation(spin 2s infinite, linear); display: block; text-align: center; - margin: 5px; + margin: 1em; &:before { font-size: 24px; font-family: 'Converse-js' !important; content: "\231b"; } } + .left { + float: left; + } + .right { + float: right; + } + .centered { + text-align: center; + display: block; + margin: 0; + padding: 50% 0; + } + .hor_centered { + text-align: center; + display: block; + margin: 0 auto; + clear: both; + } .button-group, .input-button-group {