From 814ea1c0164a39b6fb868a3bdfb171a6b0f536d9 Mon Sep 17 00:00:00 2001 From: Hanzalah Waheed Date: Wed, 1 Oct 2025 21:21:23 +0400 Subject: [PATCH 1/5] fix(ui): add text-32px for smaller than lg view for agent headings --- frontend/src/agents/AgentLogs.tsx | 2 +- frontend/src/agents/NewAgent.tsx | 2 +- frontend/src/agents/index.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/src/agents/AgentLogs.tsx b/frontend/src/agents/AgentLogs.tsx index 1766c620..979a701e 100644 --- a/frontend/src/agents/AgentLogs.tsx +++ b/frontend/src/agents/AgentLogs.tsx @@ -49,7 +49,7 @@ export default function AgentLogs() {

-

+

Agent Logs

diff --git a/frontend/src/agents/NewAgent.tsx b/frontend/src/agents/NewAgent.tsx index 7313cdfc..95b31606 100644 --- a/frontend/src/agents/NewAgent.tsx +++ b/frontend/src/agents/NewAgent.tsx @@ -527,7 +527,7 @@ export default function NewAgent({ mode }: { mode: 'new' | 'edit' | 'draft' }) {

-

+

{modeConfig[effectiveMode].heading}

diff --git a/frontend/src/agents/index.tsx b/frontend/src/agents/index.tsx index ffd0e320..14dd7423 100644 --- a/frontend/src/agents/index.tsx +++ b/frontend/src/agents/index.tsx @@ -111,7 +111,7 @@ function AgentsList() { }, [token]); return (
-

+

Agents

From 444b1a0b65cfe8773529426b6de91742dcb4d3c7 Mon Sep 17 00:00:00 2001 From: Hanzalah Waheed Date: Wed, 1 Oct 2025 23:16:24 +0400 Subject: [PATCH 2/5] feat(ui): add transition animation to navigation sidebar --- frontend/src/App.tsx | 6 +++--- frontend/src/Navigation.tsx | 25 +++++++++++++++---------- 2 files changed, 18 insertions(+), 13 deletions(-) diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 9c5de77f..9882ca9c 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -33,13 +33,13 @@ function MainLayout() { const [navOpen, setNavOpen] = useState(!(isMobile || isTablet)); return ( -

+
diff --git a/frontend/src/Navigation.tsx b/frontend/src/Navigation.tsx index aed38181..f3850da9 100644 --- a/frontend/src/Navigation.tsx +++ b/frontend/src/Navigation.tsx @@ -292,20 +292,26 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) { useDefaultDocument(); return ( <> - {!navOpen && ( -
+ {(isMobile || isTablet) && navOpen && ( +
setNavOpen(false)} + /> + )} + + { +
{queries?.length > 0 && ( @@ -313,6 +319,7 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) { onClick={() => { newChat(); }} + className="transition-transform duration-200 hover:scale-110" >
- )} + }
From 892312fc08251144409dd3f62f8894c232a3580b Mon Sep 17 00:00:00 2001 From: Hanzalah Waheed Date: Wed, 1 Oct 2025 23:33:48 +0400 Subject: [PATCH 3/5] fix: hover bg color change fixed using correct css var --- frontend/src/Navigation.tsx | 2 +- frontend/src/components/CopyButton.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/src/Navigation.tsx b/frontend/src/Navigation.tsx index f3850da9..73881248 100644 --- a/frontend/src/Navigation.tsx +++ b/frontend/src/Navigation.tsx @@ -352,7 +352,7 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) { }} > - DocsGPT Logo + DocsGPT Logo

DocsGPT
diff --git a/frontend/src/components/CopyButton.tsx b/frontend/src/components/CopyButton.tsx index e1640c27..7382fde8 100644 --- a/frontend/src/components/CopyButton.tsx +++ b/frontend/src/components/CopyButton.tsx @@ -27,7 +27,7 @@ const DEFAULT_COPIED_DURATION = 2000; const DEFAULT_BG_LIGHT = '#FFFFFF'; const DEFAULT_BG_DARK = 'transparent'; const DEFAULT_HOVER_BG_LIGHT = '#EEEEEE'; -const DEFAULT_HOVER_BG_DARK = '#4A4A4A'; +const DEFAULT_HOVER_BG_DARK = 'purple-taupe'; export default function CopyButton({ textToCopy, @@ -51,7 +51,7 @@ export default function CopyButton({ 'flex items-center justify-center rounded-full transition-colors duration-150 ease-in-out', padding, `bg-[${bgColorLight}] dark:bg-[${bgColorDark}]`, - `hover:bg-[${hoverBgColorLight}] dark:hover:bg-[${hoverBgColorDark}]`, + `hover:bg-[${hoverBgColorLight}] dark:hover:bg-${hoverBgColorDark}`, { 'bg-green-100 dark:bg-green-900 hover:bg-green-100 dark:hover:bg-green-900': isCopied, From 5b2738aec992667ed24bf9b8bc9dbe67f9224615 Mon Sep 17 00:00:00 2001 From: Hanzalah Waheed Date: Thu, 2 Oct 2025 13:44:05 +0400 Subject: [PATCH 4/5] fix (ui): is_copied true, disable hover state --- frontend/src/components/CopyButton.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/src/components/CopyButton.tsx b/frontend/src/components/CopyButton.tsx index 7382fde8..96a0a025 100644 --- a/frontend/src/components/CopyButton.tsx +++ b/frontend/src/components/CopyButton.tsx @@ -51,8 +51,9 @@ export default function CopyButton({ 'flex items-center justify-center rounded-full transition-colors duration-150 ease-in-out', padding, `bg-[${bgColorLight}] dark:bg-[${bgColorDark}]`, - `hover:bg-[${hoverBgColorLight}] dark:hover:bg-${hoverBgColorDark}`, { + [`hover:bg-[${hoverBgColorLight}] dark:hover:bg-${hoverBgColorDark}`]: + !isCopied, 'bg-green-100 dark:bg-green-900 hover:bg-green-100 dark:hover:bg-green-900': isCopied, }, From 17b9c359ca43447e9ed90f9528fdba861d2aa7d6 Mon Sep 17 00:00:00 2001 From: Hanzalah Waheed Date: Fri, 3 Oct 2025 00:22:36 +0400 Subject: [PATCH 5/5] fix: use hexcode for purple taupe and rm extra props --- frontend/src/components/CopyButton.tsx | 15 ++++----------- 1 file changed, 4 insertions(+), 11 deletions(-) diff --git a/frontend/src/components/CopyButton.tsx b/frontend/src/components/CopyButton.tsx index 96a0a025..823123b2 100644 --- a/frontend/src/components/CopyButton.tsx +++ b/frontend/src/components/CopyButton.tsx @@ -8,10 +8,6 @@ import CopyIcon from '../assets/copy.svg?react'; type CopyButtonProps = { textToCopy: string; - bgColorLight?: string; - bgColorDark?: string; - hoverBgColorLight?: string; - hoverBgColorDark?: string; iconSize?: string; padding?: string; showText?: boolean; @@ -27,14 +23,11 @@ const DEFAULT_COPIED_DURATION = 2000; const DEFAULT_BG_LIGHT = '#FFFFFF'; const DEFAULT_BG_DARK = 'transparent'; const DEFAULT_HOVER_BG_LIGHT = '#EEEEEE'; -const DEFAULT_HOVER_BG_DARK = 'purple-taupe'; +const DEFAULT_HOVER_BG_DARK = '#464152'; export default function CopyButton({ textToCopy, - bgColorLight = DEFAULT_BG_LIGHT, - bgColorDark = DEFAULT_BG_DARK, - hoverBgColorLight = DEFAULT_HOVER_BG_LIGHT, - hoverBgColorDark = DEFAULT_HOVER_BG_DARK, + iconSize = DEFAULT_ICON_SIZE, padding = DEFAULT_PADDING, showText = false, @@ -50,9 +43,9 @@ export default function CopyButton({ const iconWrapperClasses = clsx( 'flex items-center justify-center rounded-full transition-colors duration-150 ease-in-out', padding, - `bg-[${bgColorLight}] dark:bg-[${bgColorDark}]`, + `bg-[${DEFAULT_BG_LIGHT}] dark:bg-[${DEFAULT_BG_DARK}]`, { - [`hover:bg-[${hoverBgColorLight}] dark:hover:bg-${hoverBgColorDark}`]: + [`hover:bg-[${DEFAULT_HOVER_BG_LIGHT}] dark:hover:bg-[${DEFAULT_HOVER_BG_DARK}]`]: !isCopied, 'bg-green-100 dark:bg-green-900 hover:bg-green-100 dark:hover:bg-green-900': isCopied,