From 7be5153cc86c16046c49c1dd40809f64eb02ccf5 Mon Sep 17 00:00:00 2001
From: DarkPhoenix2704 <anbarasun123@gmail.com>
Date: Wed, 2 Oct 2024 05:54:25 +0000
Subject: [PATCH] fix: updated changelog

---
 .../nc-gui/components/feed/Changelog/Item.vue | 32 +++++++++++++++----
 .../components/feed/Changelog/index.vue       |  2 +-
 2 files changed, 26 insertions(+), 8 deletions(-)

diff --git a/packages/nc-gui/components/feed/Changelog/Item.vue b/packages/nc-gui/components/feed/Changelog/Item.vue
index ddba39da58..7f3bae3dce 100644
--- a/packages/nc-gui/components/feed/Changelog/Item.vue
+++ b/packages/nc-gui/components/feed/Changelog/Item.vue
@@ -51,7 +51,8 @@ const renderedText = computedAsync(async () => {
 
 <template>
   <div class="block relative">
-    <div class="relative bg-white">
+    <div class="vertical-line"></div>
+    <div class="relative border-1 border-nc-gray-medium rounded-xl pb-6 changelog-item bg-white">
       <div class="aside">
         <div class="aside-divider">
           <div class="aside-divider-dot mt-8"></div>
@@ -127,6 +128,17 @@ const renderedText = computedAsync(async () => {
   width: fit-content;
 }
 
+.vertical-line {
+  @apply ml-47.5;
+  height: 24px;
+  width: 2px;
+  background-color: #e7e7e9;
+}
+
+.changelog-item {
+  box-shadow: 0px 2px 4px -2px rgba(51, 102, 255, 0.08), 0px 4px 4px -2px rgba(51, 102, 255, 0.04);
+}
+
 .content {
   @apply !pl-52;
 
@@ -135,16 +147,22 @@ const renderedText = computedAsync(async () => {
   }
 
   :deep(.prose) {
-    img {
-      @apply !rounded-lg;
+    a {
+      @apply text-gray-900;
     }
 
     h1 {
-      @apply !text-3xl !font-bold;
+      @apply text-2xl text-nc-content-gray-emphasis leading-9 mb-0;
+      font-weight: 700;
     }
-
     p {
-      @apply leading-5;
+      @apply text-nc-content-gray-emphasis leading-6;
+      font-size: 14px !important;
+    }
+
+    li {
+      @apply text-nc-content-gray-emphasis leading-6;
+      font-size: 14px !important;
     }
   }
 }
@@ -153,7 +171,7 @@ const renderedText = computedAsync(async () => {
   @apply absolute left-0 top-0 bottom-0 w-52;
 
   .aside-inner {
-    @apply sticky top-0 pt-5;
+    @apply sticky top-0 pt-5 pb-4;
   }
 
   .aside-divider {
diff --git a/packages/nc-gui/components/feed/Changelog/index.vue b/packages/nc-gui/components/feed/Changelog/index.vue
index 62fb0bccf7..0a3a14e070 100644
--- a/packages/nc-gui/components/feed/Changelog/index.vue
+++ b/packages/nc-gui/components/feed/Changelog/index.vue
@@ -12,7 +12,7 @@ const { isLoading } = useInfiniteScroll(
       loadMore: true,
     })
   },
-  { distance: 1, interval: 2000 },
+  { distance: 4 },
 )
 </script>