fix: Constant Logo and Header

hotungkhanh · Oct 17, 2024 · 646f83c · 646f83c
1 parent 2257ec4
commit 646f83c
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 8 deletions.
diff --git a/frontend/src/components/Header.tsx b/frontend/src/components/Header.tsx
@@ -7,22 +7,28 @@ import VIT_Logo from '../assets/logo.png';
  */
 export default function Header() {
     return (
-      <Box sx={{ height: "17vh", margin: "0" }}>
+      <Box sx={{ height: "130px", margin: "0" }}>
         <CssBaseline />
         <AppBar
           position="fixed"
           sx={{
             zIndex: (theme) => theme.zIndex.drawer + 1,
-            height: "17vh",
+            height: "130px",
             padding: "20px",
             backgroundColor: "#F5F5f5",
-            boxShadow: "none",
+            boxShadow: "none"
           }}
         >
           <img
             src={VIT_Logo}
             alt="logo.exe"
-            style={{ width: "15%", height: "auto", objectFit: "cover" }}
+            style={{width: "230px",
+                  height: "auto",
+    // objectFit: "contain",
+    // maxHeight: "100%",
+    // maxWidth: "100%",
+    // alignSelf: "flex-start", // Aligns left in a flex container
+    }}
           />
         </AppBar>
       </Box>

diff --git a/frontend/src/components/ModSiderbar.tsx b/frontend/src/components/ModSiderbar.tsx
@@ -45,7 +45,7 @@ export default function ModSidebar({ marginTop, width }: SidebarProps) {
         variant="permanent"
         anchor="left"
       >
-        <Box sx={{ height: marginTop + "vh"}} />
+        <Box sx={{ height: marginTop + "px"}} />
         <List>
           {campusSolutions && campusSolutions.length > 0 ? (
             campusSolutions.map((solution) => {

diff --git a/frontend/src/components/Sidebar.tsx b/frontend/src/components/Sidebar.tsx
@@ -40,7 +40,7 @@ export default function Sidebar({ marginTop, width }: SidebarProps) {
       variant="permanent"
       anchor="left"
     >
-      <Box sx={{height: marginTop + "vh"}} />
+      <Box sx={{height: marginTop + "px"}} />
       <List>
         <ListItem key="Room" disablePadding>
           <ListItemButton component={Link} to="room">

diff --git a/frontend/src/pages/SemesterInfo.tsx b/frontend/src/pages/SemesterInfo.tsx
@@ -16,7 +16,7 @@ export default function SemesterInfo() {
   return (
     <div>
       <Header />
-      <Sidebar width={240} marginTop={17}/>
+      <Sidebar width={240} marginTop={130}/>
 
       {/* Spreadsheet */}
       <div style={{ marginLeft: 300 + "px", overflow: "hidden" }}>

diff --git a/frontend/src/pages/TimetableMod.tsx b/frontend/src/pages/TimetableMod.tsx
@@ -41,7 +41,7 @@ export default function TimetableMod() {
   return (
     <div>
         <Header />
-        <ModSidebar width={240} marginTop={17} />
+        <ModSidebar width={240} marginTop={130} />
 
         <div
           style={{