Tweak dialog styles a bit

This commit is contained in:
Danila Fedorin 2022-08-28 19:07:14 -07:00
parent 3858441c89
commit 5869d99db1
2 changed files with 15 additions and 8 deletions

View File

@ -278,19 +278,14 @@ figure {
.dialog { .dialog {
.message { .message {
@include bordered-block;
display: block;
padding: 0.75rem;
max-width: 0.8*$container-width; max-width: 0.8*$container-width;
margin-top: 0.5rem; margin-top: 0.5rem;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
text-align: left;
.message-sender { .message-sender {
width: 4rem; width: 4rem;
margin: 0.5rem; margin: 0.75rem;
.feather { .feather {
width: 2rem; width: 2rem;
@ -298,6 +293,12 @@ figure {
} }
} }
.message-text {
@include bordered-block;
display: block;
padding: 0.75rem;
}
&.side-answer { &.side-answer {
margin-left: auto; margin-left: auto;
flex-direction: row-reverse; flex-direction: row-reverse;

View File

@ -1,4 +1,10 @@
<span class="message side-{{ .Get 0 }}"> <span class="message side-{{ .Get 0 }}">
<span class="message-sender">{{ partial "icon.html" "user" }}</span> <span class="message-sender">
<span>{{ .Inner }}</span> {{ if (eq (.Get 1) "reader") }}
{{ partial "icon.html" "moon" }}
{{ else }}
{{ partial "icon.html" "sun" }}
{{ end }}
</span>
<span class="message-text">{{ .Inner }}</span>
</span> </span>