From a9c96c905a3c241da6b40c70ba67a9feddb9a2e7 Mon Sep 17 00:00:00 2001
From: Scott Idem <stidem@gmail.com>
Date: Tue, 28 Jan 2025 16:25:07 -0500
Subject: [PATCH] Fade out long text

---
 .../idaa/(idaa)/bb/ae_idaa_comp__post_obj_li.svelte      | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/routes/idaa/(idaa)/bb/ae_idaa_comp__post_obj_li.svelte b/src/routes/idaa/(idaa)/bb/ae_idaa_comp__post_obj_li.svelte
index 883da3ed..5f0e5a8f 100644
--- a/src/routes/idaa/(idaa)/bb/ae_idaa_comp__post_obj_li.svelte
+++ b/src/routes/idaa/(idaa)/bb/ae_idaa_comp__post_obj_li.svelte
@@ -40,7 +40,14 @@ onMount(() => {
         </header>
 
         <!-- {#if idaa_post_obj.content}<pre class="post__content p-2 bg-white shadow-md rounded-lg text-wrap text-sm font-normal whitespace-pre-wrap reset_css">{@html idaa_post_obj.content}</pre>{/if} -->
-        {#if idaa_post_obj.content}<div class="post__content w-full p-2 bg-gray shadow-md rounded text-wrap text-sm font-normal reset_css">{@html idaa_post_obj.content}</div>{/if}
+        <!-- style="background: linear-gradient(to top, rgba(128, 128, 128, 0.5) 0, transparent 4em);" -->
+        {#if idaa_post_obj.content}
+            <div class="post__content w-full p-2 pb-8 bg-gray shadow-md rounded text-wrap text-sm font-normal reset_css overflow-hidden max-h-96 relative">
+                {@html idaa_post_obj.content}
+                <!-- Add an overlay to fade the content out when close to max height -->
+                <div class="post__content__fade w-full h-16 absolute bottom-0 left-0 bg-gradient-to-t from-white to-transparent"></div>
+            </div>
+        {/if}
 
         <div class="ae_options flex flex-row gap-2 items-center justify-center">
             <button