Allow show more figcaption

src/components/media.jsx

@@ -48,6 +48,8 @@ const AltBadge = (props) => {
   );
 };
 
+const MEDIA_CAPTION_LIMIT = 140;
+
 function Media({ media, to, showOriginal, autoAnimate, onClick = () => {} }) {
   const {
     blurhash,
@@ -371,11 +373,17 @@ function Media({ media, to, showOriginal, autoAnimate, onClick = () => {} }) {
         </Parent>
         {showInlineDesc && (
           <figcaption
+            class={`media-caption media-caption-${
+              description.length <= MEDIA_CAPTION_LIMIT ? 'short' : 'long'
+            }`}
             onClick={(e) => {
               e.preventDefault();
               e.stopPropagation();
               states.showMediaAlt = description;
             }}
+            title={
+              description.length > MEDIA_CAPTION_LIMIT ? description : undefined
+            }
           >
             {description}
           </figcaption>

src/components/status.css

@@ -714,16 +714,19 @@
       padding: 0 4px;
       font-size: 90%;
       color: var(--text-insignificant-color);
+      line-height: 1.2;
+      cursor: pointer;
+
+      &.media-caption-long {
         overflow: hidden;
         white-space: normal;
         display: -webkit-box;
         display: box;
         -webkit-box-orient: vertical;
         box-orient: vertical;
-      -webkit-line-clamp: 2;
+        -webkit-line-clamp: 3;
-      line-clamp: 2;
+        line-clamp: 3;
-      line-height: 1.2;
+      }
-      cursor: pointer;
     }
   }