From 90b89c006f48b3b57432a59f1d11542b95971355 Mon Sep 17 00:00:00 2001
From: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
Date: Tue, 29 Apr 2025 13:48:55 -0300
Subject: [PATCH] fix: Enhance Folder Sidebar Readability - increase Font Sizes
 and Adjust Layout Dimensions (#7832)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🔧 (get-started-progress.tsx): Increase height of GetStartedProgress component for better visibility
🔧 (get-started-progress.tsx): Adjust text size for better readability and consistency
🔧 (get-started-progress.tsx): Update text size for certain elements to improve UI consistency
🔧 (index.tsx): Adjust text size for better readability and consistency in SideBarFoldersButtonsComponent
---
 .../components/get-started-progress.tsx                | 10 +++++-----
 .../components/sideBarFolderButtons/index.tsx          |  6 +++---
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/components/get-started-progress.tsx b/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/components/get-started-progress.tsx
index b05ef9d4d..28c44c574 100644
--- a/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/components/get-started-progress.tsx
+++ b/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/components/get-started-progress.tsx
@@ -82,7 +82,7 @@ export const GetStartedProgress: FC<{
   };
 
   return (
-    <div className="mt-3 h-[168px] w-full">
+    <div className="mt-3 h-[180px] w-full">
       <div className="mb-2 flex items-center justify-between">
         <span className="text-sm font-semibold">
           {percentageGetStarted >= 100 ? (
@@ -110,7 +110,7 @@ export const GetStartedProgress: FC<{
           />
         </div>
         <span
-          className="text-xs text-muted-foreground"
+          className="text-sm text-muted-foreground"
           data-testid="get_started_progress_percentage"
         >
           {percentageGetStarted}%
@@ -151,7 +151,7 @@ export const GetStartedProgress: FC<{
             )}
             <span
               className={cn(
-                "text-xs",
+                "text-sm",
                 isGithubStarredChild && "text-muted-foreground line-through",
               )}
             >
@@ -193,7 +193,7 @@ export const GetStartedProgress: FC<{
             )}
             <span
               className={cn(
-                "text-xs",
+                "text-sm",
                 isDiscordJoinedChild && "text-muted-foreground line-through",
               )}
             >
@@ -223,7 +223,7 @@ export const GetStartedProgress: FC<{
                 )}
               />
             </span>
-            <span className={cn("text-xs", hasFlows && "line-through")}>
+            <span className={cn("text-sm", hasFlows && "line-through")}>
               Create a flow
             </span>
           </div>
diff --git a/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/index.tsx b/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/index.tsx
index de66478e7..45e038b44 100644
--- a/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/index.tsx
+++ b/src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/index.tsx
@@ -413,7 +413,7 @@ const SideBarFoldersButtonsComponent = ({
                                   handleKeyDown={handleKeyDown}
                                 />
                               ) : (
-                                <span className="block w-0 grow truncate text-xs opacity-100">
+                                <span className="text-smopacity-100 block w-0 grow truncate">
                                   {item.name}
                                 </span>
                               )}
@@ -459,7 +459,7 @@ const SideBarFoldersButtonsComponent = ({
               >
                 <SidebarMenuButton
                   size="md"
-                  className="text-xs"
+                  className="text-sm"
                   onClick={() => {
                     window.open("/store", "_blank");
                   }}
@@ -473,7 +473,7 @@ const SideBarFoldersButtonsComponent = ({
               isActive={checkPathFiles}
               onClick={() => handleFilesClick?.()}
               size="md"
-              className="text-xs"
+              className="text-sm"
             >
               <ForwardedIconComponent name="File" className="h-4 w-4" />
               My Files