Siddhesh.More/rubix
1
0
Fork 0
mirror of https://github.com/WDI-Ideas/rubix.git synced 2026-04-29 04:45:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

updated navBar from dev branch

Browse Source
This commit is contained in:
rockyeverlast
2024-05-03 17:45:02 +05:30
parent 2e9afbb559
commit bcc9770eb4
5 changed files with 103 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
src/components/NavBar/NavBar.jsx
View File

@@ -30,6 +30,8 @@ import fintechIcon from "../../assets/images/Navicons/fintechIcon.png";
import adTech from "../../assets/images/Navicons/adTech.png";
import marTech from "../../assets/images/Navicons/marTech.png";
import healthTech from "../../assets/images/Navicons/healthTech.png";
import security from "../../assets/images/Navicons/security.png";
import telecom from "../../assets/images/Navicons/telecom.png";
const NavBar = () => {
const [isScrolled, setIsScrolled] = useState(false);
@@ -491,6 +493,8 @@ const NavBar = () => {
borderRadius={"10px"}
border={"none"}
padding={"1rem"}
width={"55%"}
margin={"0 auto"}
_focus={{
boxShadow: "none",
}}
@@ -498,76 +502,88 @@ const NavBar = () => {
onMouseLeave={() => setIsHoveredCases(false)}
>
<PopoverArrow backgroundColor={"#0D0B20"} shadow={"none"} />
<PopoverBody>
<Link
to="/fin-tech"
className="link"
style={
location.pathname === "/fin-tech" ? highlight : normal
}
>
<Box
display={"flex"}
alignItems={"center"}
gap={"1rem"}
marginBottom={"1rem"}
<Box
display={"flex"}
alignItems={"center"}
flexWrap={"wrap"}
justifyContent={"space-between"}
>
<PopoverBody width={"45%"}>
<Link
to="/fin-tech"
className="link"
style={
location.pathname === "/fin-tech"
? highlight
: normal
}
>
<Image src={fintechIcon} width={`${iconwidth}`} />
FinTech
</Box>
</Link>
</PopoverBody>
<Box
display={"flex"}
alignItems={"center"}
gap={"1rem"}
marginBottom={"1rem"}
>
<Image src={fintechIcon} width={`${iconwidth}`} />
FinTech
</Box>
</Link>
</PopoverBody>
<PopoverBody>
<Link
to="/ad-tech"
className="link"
style={
location.pathname === "/ad-tech" ? highlight : normal
}
>
<Box
display={"flex"}
alignItems={"center"}
gap={"1rem"}
marginBottom={"1rem"}
<PopoverBody width={"45%"}>
<Link
to="/ad-tech"
className="link"
style={
location.pathname === "/ad-tech"
? highlight
: normal
}
>
<Image src={adTech} width={`${iconwidth}`} />
AdTech
</Box>
</Link>
</PopoverBody>
<Box
display={"flex"}
alignItems={"center"}
gap={"1rem"}
marginBottom={"1rem"}
>
<Image src={adTech} width={`${iconwidth}`} />
AdTech
</Box>
</Link>
</PopoverBody>
<PopoverBody>
<Link
to="/mar-tech"
className="link"
style={
location.pathname === "/mar-tech" ? highlight : normal
}
>
<Box
display={"flex"}
alignItems={"center"}
gap={"1rem"}
marginBottom={"1rem"}
<PopoverBody width={"45%"}>
<Link
to="/mar-tech"
className="link"
style={
location.pathname === "/mar-tech"
? highlight
: normal
}
>
<Image src={marTech} width={`${iconwidth}`} />
MarTech
</Box>
</Link>
</PopoverBody>
<Box
display={"flex"}
alignItems={"center"}
gap={"1rem"}
marginBottom={"1rem"}
>
<Image src={marTech} width={`${iconwidth}`} />
MarTech
</Box>
</Link>
</PopoverBody>
<PopoverBody>
<Link
to="/health-tech"
className="link"
style={
location.pathname === "/health-tech"
? highlight
: normal
}
>
<PopoverBody width={"45%"}>
<Link
to="/health-tech"
className="link"
style={
location.pathname === "/health-tech"
? highlight
: normal
}
>
<Box
display={"flex"}
alignItems={"center"}
@@ -596,7 +612,7 @@ const NavBar = () => {
gap={"1rem"}
marginBottom={"1rem"}
>
<Image src={healthTech} width={`${iconwidth}`} />
<Image src={security} width={`${iconwidth}`} />
Identity and Security
</Box>
</Link>
@@ -618,7 +634,7 @@ const NavBar = () => {
gap={"1rem"}
marginBottom={"1rem"}
>
<Image src={healthTech} width={`${iconwidth}`} />
<Image src={telecom} width={`${iconwidth}`} />
Telecom
</Box>
</Link>