From ae5cb096f91e9f8948acc3c4b36adae9defdb264 Mon Sep 17 00:00:00 2001 From: Jason Zimdars Date: Wed, 17 Dec 2025 20:06:38 -0600 Subject: [PATCH] Let's just use the class we already have --- app/assets/stylesheets/comments.css | 122 ++++++++++----------- app/views/cards/comments/_comment.html.erb | 4 +- 2 files changed, 63 insertions(+), 63 deletions(-) diff --git a/app/assets/stylesheets/comments.css b/app/assets/stylesheets/comments.css index 5b368bafa..1d070a992 100644 --- a/app/assets/stylesheets/comments.css +++ b/app/assets/stylesheets/comments.css @@ -35,6 +35,65 @@ .house-md-content { padding: var(--comment-padding-block) 0 0; } + + .comment--system & { + --comment-padding-block: var(--block-space-half); + + max-inline-size: var(--comment-max); + text-align: center; + + &::before { + /* Make up space for lack of avatar */ + content: ""; + display: flex; + inline-size: calc(var(--comment-padding-inline) * 0.75); + } + + .comment__avatar { + display: none; + } + + .comment__author { + a { + margin: 0 auto; + } + + h3 { + margin-inline: auto; + } + + strong { + display: none; + } + } + + .comment__body { + padding: 0; + text-align: center; + } + + .comment__content { + --stripe-color: var(--color-ink-lightest); + + background-image: repeating-linear-gradient( + 45deg in srgb, + var(--color-canvas) 0 1px, + var(--stripe-color) 1px 10px); + padding-inline: var(--comment-padding-inline); + + .comments--system-expanded .comment--system & { + --stripe-color: color-mix(in srgb, var(--card-color) 10%, var(--color-canvas)); + } + + .comment__history { + background-color: var(--stripe-color); + } + } + + .reactions { + display: none !important; + } + } } .comment__author { @@ -94,65 +153,6 @@ } .comment--system { - --comment-padding-block: var(--block-space-half); - - max-inline-size: var(--comment-max); - text-align: center; - - &::before { - /* Make up space for lack of avatar */ - content: ""; - display: flex; - inline-size: calc(var(--comment-padding-inline) * 0.75); - } - - .comment__avatar { - display: none; - } - - .comment__author { - a { - margin: 0 auto; - } - - h3 { - margin-inline: auto; - } - - strong { - display: none; - } - } - - .comment__body { - padding: 0; - text-align: center; - } - - .comment__content { - --stripe-color: var(--color-ink-lightest); - - background-image: repeating-linear-gradient( - 45deg in srgb, - var(--color-canvas) 0 1px, - var(--stripe-color) 1px 10px); - padding-inline: var(--comment-padding-inline); - - .comments--system-expanded .comment--system & { - --stripe-color: color-mix(in srgb, var(--card-color) 10%, var(--color-canvas)); - } - - .comment__history { - background-color: var(--stripe-color); - } - } - - .reactions { - display: none !important; - } - } - - .comment-wrapper--system { display: none; transition: var(--dialog-duration) allow-discrete; transition-property: display; @@ -163,7 +163,7 @@ } /* Show the last system comment */ - :nth-last-child(1 of .comment-wrapper--system) { + :nth-last-child(1 of .comment--system) { display: contents; .comment__history { @@ -172,7 +172,7 @@ } /* Hide the "Show history" button if there's only one system comment */ - :nth-child(1 of .comment-wrapper--system) { + :nth-child(1 of .comment--system) { .comment__history { display: none; } diff --git a/app/views/cards/comments/_comment.html.erb b/app/views/cards/comments/_comment.html.erb index c7f0a2480..2f8a120a0 100644 --- a/app/views/cards/comments/_comment.html.erb +++ b/app/views/cards/comments/_comment.html.erb @@ -1,8 +1,8 @@ <% cache comment do %> <%# Helper Dependency Updated: avatar_image_tag 2025-12-15 %> - <%= turbo_frame_tag comment, :container, class: ["comment-wrapper", { "comment-wrapper--system": comment.creator.system? }] do %> + <%= turbo_frame_tag comment, :container, class: ["comment--system": comment.creator.system?] do %> <%# Cache bump 2025-12-14: action text attachment rendering changed for lightbox -%> -
"> +