From eed9e401a2fa799006226910eaf9742cfe29fb49 Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Sat, 3 Aug 2024 04:00:36 +0530
Subject: [PATCH] Improve alignment of title bar elements

---
 src/interface/web/app/components/logo/khogLogo.tsx        | 2 +-
 .../web/app/components/sidePanel/chatHistorySidePanel.tsx | 8 ++++----
 .../web/app/components/sidePanel/sidePanel.module.css     | 3 ++-
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/interface/web/app/components/logo/khogLogo.tsx b/src/interface/web/app/components/logo/khogLogo.tsx
index c2cdc8c1..fcdeb60c 100644
--- a/src/interface/web/app/components/logo/khogLogo.tsx
+++ b/src/interface/web/app/components/logo/khogLogo.tsx
@@ -1,6 +1,6 @@
 export function KhojLogoType() {
     return (
-        <svg width="52" height="auto" viewBox="0 0 442 198" className="fill-zinc-950 dark:fill-zinc-300" xmlns="http://www.w3.org/2000/svg">
+        <svg width="64" height="auto" viewBox="0 0 442 198" className="fill-zinc-950 dark:fill-zinc-300" xmlns="http://www.w3.org/2000/svg">
             <g clipPath="url(#clip0_45_75)">
                 <path d="M57.9394 93.0404L67.5396 49.1063C68.7987 49.5268 71.7365 51.9442 74.7267 51.9442C78.5039 51.9442 79.2383 47.4246 86.1631 45.7955C91.6715 44.4817 96.3404 45.4276 99.0684 47.6349C99.0684 47.6349 99.6979 53.6259 101.167 55.4127C102.531 57.0418 104.629 56.4637 104.629 56.4637C107.672 70.8106 114.072 100.661 115.279 105.233C116.8 110.961 110.924 114.114 108.669 119.369C106.413 124.625 94.242 126.884 87.0549 127.62C79.8679 128.356 59.723 119.632 57.9394 117.215C56.1557 114.797 55.3688 109.857 55.1065 105.18C54.8442 101.449 56.8902 95.5104 57.9394 93.0404Z" fill="#FAE80B" />
                 <path d="M57.9394 92.9879L62.2936 74.8046C63.5526 75.2251 66.9626 73.4383 71.4742 69.0764C74.1497 66.4488 79.8678 58.8812 86.0582 55.3601C90.5698 52.785 94.924 54.204 97.5995 56.4112C97.5995 56.4112 100.013 57.6199 102.846 57.6199C104.944 57.6199 104.629 56.4112 104.629 56.4112C107.672 70.7581 114.072 100.608 115.279 105.18C116.8 110.908 110.924 114.062 108.669 119.317C106.413 124.572 94.242 126.832 87.0549 127.568C79.8679 128.303 59.723 119.58 57.9394 117.162C56.1557 114.745 55.3688 109.805 55.1065 105.128C54.8442 101.449 56.8902 95.5104 57.9394 92.9879Z" fill="#FFCC09" />
diff --git a/src/interface/web/app/components/sidePanel/chatHistorySidePanel.tsx b/src/interface/web/app/components/sidePanel/chatHistorySidePanel.tsx
index 7322c12e..f21c6056 100644
--- a/src/interface/web/app/components/sidePanel/chatHistorySidePanel.tsx
+++ b/src/interface/web/app/components/sidePanel/chatHistorySidePanel.tsx
@@ -696,19 +696,19 @@ export default function SidePanel(props: SidePanelProps) {
                             </DrawerContent>
                         </Drawer>
                         :
-                        <div className={`flex justify-between flex-row ${enabled ? 'w-full' : 'w-fit'}`}>
+                        <div className={`grid grid-flow-col gap-4 w-fit`}>
                             <Link href='/' className="content-center">
                                 <KhojLogoType />
                             </Link>
-                            <div className={`${enabled ? 'flex items-center flex-row gap-2' : 'flex items-center'}`}>
-                                <Link className={`ml-4 mr-4`} href="/">
+                            <div className='grid grid-flow-col gap-2 items-center'>
+                                <Link className='mx-4' href="/">
                                     {enabled ? <NotePencil className="h-6 w-6" /> : <NotePencil className="h-6 w-6" color="gray" />}
                                 </Link>
                                 <button className={styles.button} onClick={() => setEnabled(!enabled)}>
                                     {enabled ? <Sidebar className="h-6 w-6" /> : <Sidebar className="h-6 w-6" color="gray" />}
                                 </button>
                             </div>
-                            <div className="fixed right-0 w-fit h-fit">
+                            <div className="fixed right-0 top-[0.9rem] w-fit h-fit">
                                 <NavMenu />
                             </div>
                         </div>
diff --git a/src/interface/web/app/components/sidePanel/sidePanel.module.css b/src/interface/web/app/components/sidePanel/sidePanel.module.css
index e984eb6a..74d5358e 100644
--- a/src/interface/web/app/components/sidePanel/sidePanel.module.css
+++ b/src/interface/web/app/components/sidePanel/sidePanel.module.css
@@ -143,7 +143,8 @@ div.modalSessionsList div.session {
 
     div.session.compressed {
         max-width: 100%;
-        grid-template-columns: minmax(auto, 300px) 1fr;
+        display: flex;
+        justify-content: space-between;
     }
 
     div.session {