chight/Web-Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: adjusting height of header to reduce extra white space below search bar

Browse Source
This commit is contained in:
vkuchenik
2026-11-12 09:53:08 -08:00
parent ebc3f38b0c
commit d7ecbc6f65
2 changed files with 8 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/App.jsx
+1 -1
View File
@@ -74,7 +74,7 @@ function AppFoundation() {
return ( return (
<> <>
<DialogPopup dialog={dialog}/> <DialogPopup dialog={dialog}/>
<Grid css={styles} templateRows="1fr 11fr" templateColumns="auto 1fr"> <Grid css={styles} templateRows="1fr 13fr" templateColumns="auto 1fr">
<GridItem rowSpan={2} colSpan={1}> <GridItem rowSpan={2} colSpan={1}>
<Sidebar/> <Sidebar/>
</GridItem> </GridItem>
client/src/components/layout/Header.jsx
+7 -4
View File
@@ -1,7 +1,8 @@
import {useSlotRecipe, Text, Flex} from "@chakra-ui/react" import {useSlotRecipe, Text, Flex, Input, InputGroup} from "@chakra-ui/react"
import UserAvatarMenu from "./UserAvatarMenu.jsx"; import UserAvatarMenu from "./UserAvatarMenu.jsx";
import useAuthStore from "@/store/authStore"; import useAuthStore from "@/store/authStore";
import {SearchBar} from "@/components/dashboard/SearchBar.jsx"; import {SearchBar} from "@/components/dashboard/SearchBar.jsx";
import {Search} from "lucide-react";
// Import the asset properly so Vite can bundle it for any server // Import the asset properly so Vite can bundle it for any server
// import defaultAvatar from "@/assets/user_profile.svg"; // import defaultAvatar from "@/assets/user_profile.svg";
@@ -20,9 +21,11 @@ export default function Header() {
return ( return (
<Flex css={styles.root}> <Flex css={styles.root}>
<Flex css={styles.search_bar}> <InputGroup startElement={<Search />} css={styles.search_bar}>
<SearchBar placeholder="Enter a volcano to search"/> <Input
</Flex> placeholder="Enter a volcano to search"
/>
</InputGroup>
{/* User Profile Section */} {/* User Profile Section */}
<Flex css={styles.user_info}> <Flex css={styles.user_info}>