From 9dc8be4f8410f897fc34819f01778f740aba2494 Mon Sep 17 00:00:00 2001
From: DIYgod <i@diygod.me>
Date: Tue, 16 Apr 2024 14:25:06 +0800
Subject: [PATCH] feat: dynamic width for entry column

---
 src/renderer/src/components/entry-column/social-media-item.tsx | 2 +-
 src/renderer/src/pages/index.tsx                               | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/renderer/src/components/entry-column/social-media-item.tsx b/src/renderer/src/components/entry-column/social-media-item.tsx
index f070bde10b..c99cd503d4 100644
--- a/src/renderer/src/components/entry-column/social-media-item.tsx
+++ b/src/renderer/src/components/entry-column/social-media-item.tsx
@@ -12,7 +12,7 @@ export function SocialMediaItem({
         className="w-5 h-5 mr-2 rounded-sm shrink-0"
       />
       <div>
-        <div className="line-clamp-5 text-sm flex-1 -mt-0.5 leading-tight text-[13px]">
+        <div className="line-clamp-5 text-sm flex-1 -mt-0.5 text-[13px]">
           <div className='space-x-1'>
             <span className='font-medium'>{entry.author}</span>
             <span className="text-zinc-500">·</span>
diff --git a/src/renderer/src/pages/index.tsx b/src/renderer/src/pages/index.tsx
index aa1681f756..e628b6b8bc 100644
--- a/src/renderer/src/pages/index.tsx
+++ b/src/renderer/src/pages/index.tsx
@@ -2,6 +2,7 @@ import { FeedColumn } from '@renderer/components/feed-column'
 import { EntryColumn } from '@renderer/components/entry-column'
 import { useState } from 'react'
 import { ActivedList } from '@renderer/lib/types'
+import { cn } from '@renderer/lib/utils'
 
 export function Component() {
   const [activedList, setActivedList] = useState<ActivedList>(null)
@@ -12,7 +13,7 @@ export function Component() {
       <div className="w-64 pt-10 border-r shrink-0 flex flex-col bg-[#E1E0DF]" onClick={() => setActivedList(null)}>
         <FeedColumn activedList={activedList} setActivedList={setActivedList} />
       </div>
-      <div className="w-[340px] pt-10 border-r shrink-0 h-full overflow-y-auto">
+      <div className={cn("pt-10 border-r shrink-0 h-full overflow-y-auto", activedList?.type === "Social Media" ? "flex-1 min-w-96" : "w-[340px]")}>
         <EntryColumn activedList={activedList} activedEntry={activedEntry} setActivedEntry={setActivedEntry} />
       </div>
       <div className="flex-1 pt-10 px-4">Three</div>