Commit 95e648e7 authored by JC Brand's avatar JC Brand

Tweak margin and padding for messages

parent 076ace3f
...@@ -7350,7 +7350,7 @@ body.reset { ...@@ -7350,7 +7350,7 @@ body.reset {
line-height: 14px; line-height: 14px;
color: #3AA569; color: #3AA569;
font-size: 12px; font-size: 12px;
margin: 0.5em; } margin: 0.5em 0; }
#converse-embedded-chat .chatbox .chat-body .chat-info.badge, #converse-embedded-chat .chatbox .chat-body .chat-info.badge,
#conversejs .chatbox .chat-body .chat-info.badge { #conversejs .chatbox .chat-body .chat-info.badge {
color: white; } color: white; }
...@@ -7381,7 +7381,8 @@ body.reset { ...@@ -7381,7 +7381,8 @@ body.reset {
#converse-embedded-chat .chatbox .chat-body .chat-message, #converse-embedded-chat .chatbox .chat-body .chat-message,
#conversejs .chatbox .chat-body .chat-message { #conversejs .chatbox .chat-body .chat-message {
overflow: auto; overflow: auto;
margin: 0.3em; } margin: 0;
padding: 0.4em 0; }
#converse-embedded-chat .chatbox .chat-body .chat-message.onload, #converse-embedded-chat .chatbox .chat-body .chat-message.onload,
#conversejs .chatbox .chat-body .chat-message.onload { #conversejs .chatbox .chat-body .chat-message.onload {
animation: colorchange-chatmessage 1s; animation: colorchange-chatmessage 1s;
...@@ -7431,7 +7432,7 @@ body.reset { ...@@ -7431,7 +7432,7 @@ body.reset {
#converse-embedded-chat .chatbox .chat-content, #converse-embedded-chat .chatbox .chat-content,
#conversejs .chatbox .chat-content { #conversejs .chatbox .chat-content {
height: 100%; height: 100%;
padding: 0.5em; padding: 1em;
font-size: 13px; font-size: 13px;
color: #777; color: #777;
overflow-y: auto; overflow-y: auto;
...@@ -7442,6 +7443,9 @@ body.reset { ...@@ -7442,6 +7443,9 @@ body.reset {
#conversejs .chatbox .chat-content .toggle-spoiler:before { #conversejs .chatbox .chat-content .toggle-spoiler:before {
padding-right: 0.25em; padding-right: 0.25em;
whitespace: nowrap; } whitespace: nowrap; }
#converse-embedded-chat .chatbox .chat-content progress,
#conversejs .chatbox .chat-content progress {
width: 100%; }
#converse-embedded-chat .chatbox .chat-content-sendbutton, #converse-embedded-chat .chatbox .chat-content-sendbutton,
#conversejs .chatbox .chat-content-sendbutton { #conversejs .chatbox .chat-content-sendbutton {
height: calc(100% - 93px); } height: calc(100% - 93px); }
...@@ -7699,7 +7703,6 @@ body.reset { ...@@ -7699,7 +7703,6 @@ body.reset {
width: 250px; } width: 250px; }
#converse-embedded-chat .chatbox .chat-body .chat-message, #converse-embedded-chat .chatbox .chat-body .chat-message,
#conversejs:not(.fullscreen) .chatbox .chat-body .chat-message { #conversejs:not(.fullscreen) .chatbox .chat-body .chat-message {
padding: 0.3em;
line-height: 20px; } line-height: 20px; }
#converse-embedded-chat .chatbox .chat-body .chat-message .chat-msg-author, #converse-embedded-chat .chatbox .chat-body .chat-message .chat-msg-author,
#conversejs:not(.fullscreen) .chatbox .chat-body .chat-message .chat-msg-author { #conversejs:not(.fullscreen) .chatbox .chat-body .chat-message .chat-msg-author {
......
...@@ -7403,7 +7403,7 @@ body { ...@@ -7403,7 +7403,7 @@ body {
line-height: 20px; line-height: 20px;
color: #3AA569; color: #3AA569;
font-size: 14px; font-size: 14px;
margin: 0.5em; } margin: 0.5em 0; }
#converse-embedded-chat .chatbox .chat-body .chat-info.badge, #converse-embedded-chat .chatbox .chat-body .chat-info.badge,
#conversejs .chatbox .chat-body .chat-info.badge { #conversejs .chatbox .chat-body .chat-info.badge {
color: white; } color: white; }
...@@ -7434,7 +7434,8 @@ body { ...@@ -7434,7 +7434,8 @@ body {
#converse-embedded-chat .chatbox .chat-body .chat-message, #converse-embedded-chat .chatbox .chat-body .chat-message,
#conversejs .chatbox .chat-body .chat-message { #conversejs .chatbox .chat-body .chat-message {
overflow: auto; overflow: auto;
margin: 0.3em; } margin: 0;
padding: 0.4em 0; }
#converse-embedded-chat .chatbox .chat-body .chat-message.onload, #converse-embedded-chat .chatbox .chat-body .chat-message.onload,
#conversejs .chatbox .chat-body .chat-message.onload { #conversejs .chatbox .chat-body .chat-message.onload {
animation: colorchange-chatmessage 1s; animation: colorchange-chatmessage 1s;
...@@ -7484,7 +7485,7 @@ body { ...@@ -7484,7 +7485,7 @@ body {
#converse-embedded-chat .chatbox .chat-content, #converse-embedded-chat .chatbox .chat-content,
#conversejs .chatbox .chat-content { #conversejs .chatbox .chat-content {
height: 100%; height: 100%;
padding: 0.5em; padding: 1em;
font-size: 13px; font-size: 13px;
color: #777; color: #777;
overflow-y: auto; overflow-y: auto;
...@@ -7495,6 +7496,9 @@ body { ...@@ -7495,6 +7496,9 @@ body {
#conversejs .chatbox .chat-content .toggle-spoiler:before { #conversejs .chatbox .chat-content .toggle-spoiler:before {
padding-right: 0.25em; padding-right: 0.25em;
whitespace: nowrap; } whitespace: nowrap; }
#converse-embedded-chat .chatbox .chat-content progress,
#conversejs .chatbox .chat-content progress {
width: 100%; }
#converse-embedded-chat .chatbox .chat-content-sendbutton, #converse-embedded-chat .chatbox .chat-content-sendbutton,
#conversejs .chatbox .chat-content-sendbutton { #conversejs .chatbox .chat-content-sendbutton {
height: calc(100% - 93px); } height: calc(100% - 93px); }
...@@ -7773,8 +7777,7 @@ body { ...@@ -7773,8 +7777,7 @@ body {
border-top-right-radius: 4px; } border-top-right-radius: 4px; }
#conversejs.fullscreen .chatbox .chat-body .chat-message { #conversejs.fullscreen .chatbox .chat-body .chat-message {
line-height: 22px; line-height: 22px;
font-size: 14px; font-size: 14px; }
padding: 0.4em 0; }
#conversejs.fullscreen .chatbox .chat-body .chat-message .chat-msg-author { #conversejs.fullscreen .chatbox .chat-body .chat-message .chat-msg-author {
line-height: 22px; } line-height: 22px; }
#conversejs.fullscreen .chatbox .chat-body .chat-message .chat-msg-content { #conversejs.fullscreen .chatbox .chat-body .chat-message .chat-msg-content {
......
...@@ -178,7 +178,7 @@ ...@@ -178,7 +178,7 @@
line-height: $line-height-small; line-height: $line-height-small;
color: $chat-head-color; color: $chat-head-color;
font-size: $font-size-small; font-size: $font-size-small;
margin: 0.5em; margin: 0.5em 0;
&.badge { &.badge {
color: $chat-head-text-color; color: $chat-head-text-color;
} }
...@@ -209,7 +209,8 @@ ...@@ -209,7 +209,8 @@
} }
.chat-message { .chat-message {
overflow: auto; // Ensures that content stays inside overflow: auto; // Ensures that content stays inside
margin: 0.3em; margin: 0;
padding: 0.4em 0;
&.onload { &.onload {
animation: colorchange-chatmessage 1s; animation: colorchange-chatmessage 1s;
...@@ -267,7 +268,7 @@ ...@@ -267,7 +268,7 @@
} }
.chat-content { .chat-content {
height: 100%; height: 100%;
padding: 0.5em; padding: 1em;
font-size: 13px; font-size: 13px;
color: $text-color; color: $text-color;
overflow-y: auto; overflow-y: auto;
...@@ -279,6 +280,10 @@ ...@@ -279,6 +280,10 @@
padding-right: 0.25em; padding-right: 0.25em;
whitespace: nowrap; whitespace: nowrap;
} }
progress {
width: 100%
}
} }
.chat-content-sendbutton { .chat-content-sendbutton {
height: calc(100% - #{$chat-textarea-height + $send-button-height + 2*$send-button-margin}); height: calc(100% - #{$chat-textarea-height + $send-button-height + 2*$send-button-margin});
......
...@@ -23,7 +23,6 @@ ...@@ -23,7 +23,6 @@
.chat-body { .chat-body {
.chat-message { .chat-message {
padding: 0.3em;
line-height: $line-height-large; line-height: $line-height-large;
.chat-msg-author { .chat-msg-author {
line-height: $line-height-large; line-height: $line-height-large;
......
...@@ -50,7 +50,6 @@ ...@@ -50,7 +50,6 @@
.chat-message { .chat-message {
line-height: $line-height; line-height: $line-height;
font-size: $font-size-small; font-size: $font-size-small;
padding: 0.4em 0;
.chat-msg-author { .chat-msg-author {
line-height: $line-height; line-height: $line-height;
} }
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment