From b8c9059562be81260326761d99c7617d3e584f8c Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sun, 29 Jan 2023 15:55:15 +0800
Subject: [PATCH] Quick fix for "See post" messing up the top controls div in
 small screens

---
 src/app.css                    | 7 +++++++
 src/components/media-modal.jsx | 4 ++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/app.css b/src/app.css
index 54b16d93..7ab348d0 100644
--- a/src/app.css
+++ b/src/app.css
@@ -849,7 +849,14 @@ button.carousel-dot:is(.active, [disabled].active) {
 
 /* CAROUSEL + STATUS PAGE COMBO */
 
+.media-post-link .button-label {
+  display: none;
+}
+
 @media (min-width: calc(40em + 350px)) {
+  .media-post-link .button-label {
+    display: inline;
+  }
   #modal-container > div,
   .status-deck {
     transition: all 0.3s ease-in-out;
diff --git a/src/components/media-modal.jsx b/src/components/media-modal.jsx
index 0f757643..9d246152 100644
--- a/src/components/media-modal.jsx
+++ b/src/components/media-modal.jsx
@@ -165,7 +165,7 @@ function MediaModal({
           {!isStatusLocation && (
             <Link
               to={`/s/${statusID}`}
-              class="button carousel-button plain3"
+              class="button carousel-button media-post-link plain3"
               onClick={() => {
                 // if small screen (not media query min-width 40em + 350px), run onClose
                 if (
@@ -175,7 +175,7 @@ function MediaModal({
                 }
               }}
             >
-              See post &raquo;
+              <span class="button-label">See post </span>&raquo;
             </Link>
           )}{' '}
           <a