From f7d787f798ba3a0b71179e54ad9fcaab3932f3b3 Mon Sep 17 00:00:00 2001
From: VT Social <admin@vt.social>
Date: Wed, 10 Jul 2024 09:47:33 +0000
Subject: [PATCH] th: quotes: Show left bar in indicator

Makes the quote/reply distinction clearer
---
 .../glitch/features/compose/components/reply_indicator.jsx   | 2 +-
 app/javascript/flavours/glitch/styles/components.scss        | 5 +++++
 .../mastodon/features/compose/components/reply_indicator.jsx | 2 +-
 app/javascript/styles/mastodon/components.scss               | 5 +++++
 4 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx b/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx
index 76d6b5a4dc..e4c5f08871 100644
--- a/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/reply_indicator.jsx
@@ -23,7 +23,7 @@ export const ReplyIndicator = () => {
   const content = { __html: status.get('contentHtml') };
 
   return (
-    <div className='reply-indicator'>
+    <div className={'reply-indicator' + (quoteId ? ' reply-indicator__quote' : '')}>
       {inReplyToId && (<div className='reply-indicator__line' />)}
 
       <Permalink href={account.get('url')} to={`/@${account.get('acct')}`} className='detailed-status__display-avatar'>
diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components.scss
index 49a81cc1c9..973bb7237f 100644
--- a/app/javascript/flavours/glitch/styles/components.scss
+++ b/app/javascript/flavours/glitch/styles/components.scss
@@ -1194,6 +1194,11 @@ body > [data-popper-placement] {
   }
 }
 
+.reply-indicator__quote {
+  padding-inline-start: 10px;
+  border-inline-start: 3px solid $darker-text-color;
+}
+
 .edit-indicator {
   border-radius: 4px 4px 0 0;
   background: lighten($ui-base-color, 4%);
diff --git a/app/javascript/mastodon/features/compose/components/reply_indicator.jsx b/app/javascript/mastodon/features/compose/components/reply_indicator.jsx
index 03b89e8802..6cc1a28c04 100644
--- a/app/javascript/mastodon/features/compose/components/reply_indicator.jsx
+++ b/app/javascript/mastodon/features/compose/components/reply_indicator.jsx
@@ -24,7 +24,7 @@ export const ReplyIndicator = () => {
   const content = { __html: status.get('contentHtml') };
 
   return (
-    <div className='reply-indicator'>
+    <div className={'reply-indicator' + (quoteId ? ' reply-indicator__quote' : '')}>
       {inReplyToId && (<div className='reply-indicator__line' />)}
 
       <Link to={`/@${account.get('acct')}`} className='detailed-status__display-avatar'>
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 8c7b7e52ae..853b0856fd 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -1141,6 +1141,11 @@ body > [data-popper-placement] {
   }
 }
 
+.reply-indicator__quote {
+  padding-inline-start: 10px;
+  border-inline-start: 3px solid $darker-text-color;
+}
+
 .edit-indicator {
   border-radius: 4px 4px 0 0;
   background: lighten($ui-base-color, 4%);