klbr/khoj
1
0
Fork 0
mirror of https://github.com/khoaliber/khoj.git synced 2026-03-02 21:19:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Set home, chat page height so footer, header visible w/o scroll on phone

Browse Source 
Set dynamic view height of page to 100%
This commit is contained in:
Debanjum Singh Solanky
2024-08-03 13:05:29 +05:30
parent 687a881ad2
commit 5b17fa5dda
4 changed files with 5 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/interface/web/app/chat/chat.module.css
View File

@@ -1,5 +1,5 @@
div.main {
height: 100vh;
height: 100dvh;
color: hsla(var(--foreground));
}
@@ -120,5 +120,4 @@ div.agentIndicator {
gap: 0;
grid-template-columns: 1fr;
}
}

2
src/interface/web/app/components/chatInputArea/chatInputArea.tsx
View File

@@ -359,7 +359,7 @@ export default function ChatInputArea(props: ChatInputProps) {
</Popover>
</div>
}
<div className={`${styles.actualInputArea} flex items-center justify-between dark:bg-neutral-700`}>
<div className={`${styles.actualInputArea} items-center justify-between dark:bg-neutral-700`}>
<input
type="file"
multiple={true}

7
src/interface/web/app/page.module.css
View File

@@ -1,5 +1,5 @@
div.main {
height: 100vh;
height: 100dvh;
color: hsla(var(--foreground));
}
@@ -15,7 +15,6 @@ div.inputBox {
border: 1px solid var(--border-color);
border-radius: 16px;
margin-bottom: 20px;
gap: 12px;
align-content: center;
}
@@ -86,13 +85,11 @@ div.homeGreetings {
grid-template-rows: 1fr 2fr;
}
div.sidePanel {
position: fixed;
height: 100%;
}
@media screen and (max-width: 768px) {
div.inputBox {
margin-bottom: 0px;
@@ -123,6 +120,6 @@ div.sidePanel {
}
div.homeGreetings {
grid-template-rows: auto;
grid-template-rows: auto 1fr;
}
}

2
src/interface/web/app/page.tsx
View File

@@ -244,7 +244,7 @@ function ChatBodyData(props: ChatBodyDataProps) {
props.isMobileWidth &&
<>
<div className={`${styles.inputBox} w-full shadow-md dark:bg-neutral-700 bg-background align-middle items-center justify-center pb-3 px-1`}>
<div className="flex gap-2 items-center justify-left pt-2 pb-4 px-10">
<div className="flex gap-2 items-center justify-left pt-1 pb-2 px-10">
{agentIcons.map((icon, index) => (
<Card
key={`${index}-${agents[index].slug}`}