Pull back comment decoration
This commit is contained in:
@@ -1,9 +1,9 @@
|
||||
.comments {
|
||||
--avatar-size: 2.33em;
|
||||
--comment-padding-block: 1.2em;
|
||||
--comment-padding-inline: 1.5em;
|
||||
--comment-padding-block: 1lh;
|
||||
--comment-padding-inline: 2ch;
|
||||
|
||||
max-inline-size: 70ch;
|
||||
max-inline-size: 80ch;
|
||||
row-gap: var(--comment-padding-block);
|
||||
|
||||
> :first-child {
|
||||
@@ -39,7 +39,6 @@
|
||||
padding: var(--comment-padding-block) var(--comment-padding-inline);
|
||||
|
||||
.comment--mine & {
|
||||
background-color: var(--color-selected);
|
||||
margin-inline: var(--avatar-size) 0;
|
||||
}
|
||||
|
||||
@@ -74,7 +73,7 @@
|
||||
|
||||
.event-summary {
|
||||
font-weight: 600;
|
||||
gap: 0.5ch;
|
||||
margin-block: calc(var(--comment-padding-block) * -1);
|
||||
padding: calc(var(--comment-padding-block) * 0.5) var(--comment-padding-inline);
|
||||
gap: 0.5ch;
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<%= avatar_tag comment.creator, loading: :lazy %>
|
||||
</figure>
|
||||
|
||||
<div class="comment__content flex flex-column full-width fill-shade border-radius">
|
||||
<div class="comment__content flex flex-column full-width">
|
||||
<div class="comment__author flex align-center gap-half">
|
||||
<strong><%= comment.creator.name %></strong>
|
||||
<%= link_to bucket_bubble_path(comment.bubble.bucket, comment.bubble, anchor: "comment_#{comment.id}"), class: "txt-undecorated" do %>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<div class="comment flex align-start full-width comment--mine">
|
||||
<figure class="comment__avatar avatar fill-black txt-reversed flex-item-no-shrink"><strong><%= Current.user.initials %></strong></figure>
|
||||
|
||||
<div class="comment__content flex flex-column full-width fill-shade border-radius">
|
||||
<div class="comment__content flex flex-column full-width">
|
||||
<div class="comment__author flex align-center gap-half">
|
||||
<strong><%= Current.user.name %></strong>
|
||||
</div>
|
||||
|
||||
@@ -1,3 +1,3 @@
|
||||
<div class="event-summary flex-inline flex-wrap align-start fill-white border-radius center position-relative" data-controller="event-summary">
|
||||
<div class="event-summary flex flex-wrap align-start center" data-controller="event-summary">
|
||||
<%= event_summary.body %>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user