Update Nav, Styled, Hero

analuiza2102 · Mar 24, 2024 · a9f4762 · a9f4762
1 parent 386cca3
commit a9f4762
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 11 deletions.
diff --git a/src/Components/NavBar/NavBar.tsx b/src/Components/NavBar/NavBar.tsx
@@ -4,15 +4,13 @@ import { AppBar, MenuItem, Toolbar, styled} from "@mui/material"
 
 const NavBar = () =>{
 
-  const StyledToolbar = styled(Toolbar) (() => ({
-
-
+  const StyledToolbar = styled(Toolbar) (({theme}) => ({
     display: "flex",
     justifyContent: "space-evenly",
-
-
-
-    }))
+    alignItems: "center",
+    backgroundColor: theme.palette.background.default,
+    color: "white",
+  }))
 
 
     return (

diff --git a/src/Components/StyledButton/StyledButton.tsx b/src/Components/StyledButton/StyledButton.tsx
@@ -2,10 +2,12 @@ import { styled } from '@mui/system';
 
 interface StyledButtonProps {
     children: React.ReactNode;
+    onClick?: () => void;
+
 }
 
 
-const StyledButton: React.FC<StyledButtonProps> = ({children}) =>{
+const StyledButton: React.FC<StyledButtonProps> = ({children, onClick}) =>{
 
     const StyledButton = styled("button") (({ theme}) => ({
         backgroundColor: "transparent",
@@ -26,7 +28,7 @@ const StyledButton: React.FC<StyledButtonProps> = ({children}) =>{
         }))
     return (
       <>
-        <StyledButton>{children}
+        <StyledButton onClick={onClick} >{children}
         </StyledButton>
       </>
     )

diff --git a/src/Pages/Home/Sections/Hero/Hero.tsx b/src/Pages/Home/Sections/Hero/Hero.tsx
@@ -62,14 +62,14 @@ const Hero = () =>{
                         <Grid container display={"Flex"} justifyContent="center" spacing={3} pt={4}> 
 
                             <Grid item xs={12} md={4} display={"Flex"} justifyContent="center" >
-                            <StyledButton >
+                            <StyledButton onClick={console.log }>
                                 <EmailIcon/> 
                                 <Typography> Contact me </Typography>
                             </StyledButton>
                             </Grid>
 
                             <Grid item xs={12} md={4} display={"Flex"} justifyContent="center"> 
-                                    <StyledButton> 
+                                    <StyledButton onClick={console.log }> 
                                         <FileDownloadIcon/>
                                         <Typography> Download CV </Typography>
                                         </StyledButton>