mirror of
https://github.com/khoj-ai/khoj.git
synced 2024-12-18 18:47:11 +00:00
Improve mobile header, reduce title bar padding and add conv title
This commit is contained in:
parent
321eeeaed7
commit
1ec1eff57e
3 changed files with 8 additions and 8 deletions
|
@ -386,7 +386,7 @@ export default function Chat() {
|
||||||
<title>
|
<title>
|
||||||
{`${defaultTitle}${!!title && title !== defaultTitle ? `: ${title}` : ""}`}
|
{`${defaultTitle}${!!title && title !== defaultTitle ? `: ${title}` : ""}`}
|
||||||
</title>
|
</title>
|
||||||
<div>
|
<div className={isMobileWidth ? "h-1" : "h-auto"}>
|
||||||
<SidePanel
|
<SidePanel
|
||||||
conversationId={conversationId}
|
conversationId={conversationId}
|
||||||
uploadedFiles={[]}
|
uploadedFiles={[]}
|
||||||
|
@ -395,9 +395,9 @@ export default function Chat() {
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.chatBox}>
|
<div className={styles.chatBox}>
|
||||||
<div className={styles.chatBoxBody}>
|
<div className={styles.chatBoxBody}>
|
||||||
{!isMobileWidth && conversationId && (
|
{conversationId && (
|
||||||
<div
|
<div
|
||||||
className={`${styles.chatTitleWrapper} text-nowrap text-ellipsis overflow-hidden max-w-screen-md grid items-top font-bold mr-8 pt-6 col-auto h-fit`}
|
className={`${styles.chatTitleWrapper} text-nowrap text-ellipsis overflow-hidden max-w-screen-md grid items-top font-bold mx-2 md:mr-8 md:pt-6 col-auto h-fit`}
|
||||||
>
|
>
|
||||||
{title && (
|
{title && (
|
||||||
<h2
|
<h2
|
||||||
|
@ -409,7 +409,7 @@ export default function Chat() {
|
||||||
<ChatSessionActionMenu
|
<ChatSessionActionMenu
|
||||||
conversationId={conversationId}
|
conversationId={conversationId}
|
||||||
setTitle={setTitle}
|
setTitle={setTitle}
|
||||||
sizing="md"
|
sizing={isMobileWidth ? "sm" : "md"}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
|
@ -52,7 +52,7 @@ div.settingsMenuOptions {
|
||||||
grid-auto-flow: row;
|
grid-auto-flow: row;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
background-color: var(--background-color);
|
background-color: var(--background-color);
|
||||||
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
|
||||||
top: 64px;
|
top: 64px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
|
@ -69,6 +69,6 @@ div.settingsMenuOptions {
|
||||||
}
|
}
|
||||||
|
|
||||||
div.titleBar {
|
div.titleBar {
|
||||||
padding: 8px;
|
padding: 4px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -965,7 +965,7 @@ export default function SidePanel(props: SidePanelProps) {
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<DrawerTrigger>
|
<DrawerTrigger>
|
||||||
<Sidebar className="h-8 w-8 mx-2" weight="thin" />
|
<Sidebar className="h-6 w-6 mx-2" weight="thin" />
|
||||||
</DrawerTrigger>
|
</DrawerTrigger>
|
||||||
<DrawerContent>
|
<DrawerContent>
|
||||||
<DrawerHeader>
|
<DrawerHeader>
|
||||||
|
@ -1037,7 +1037,7 @@ export default function SidePanel(props: SidePanelProps) {
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{props.isMobileWidth && (
|
{props.isMobileWidth && (
|
||||||
<Link href="/" className="content-center">
|
<Link href="/" className="content-center h-fit self-center">
|
||||||
<KhojLogoType />
|
<KhojLogoType />
|
||||||
</Link>
|
</Link>
|
||||||
)}
|
)}
|
||||||
|
|
Loading…
Reference in a new issue