General/ReactWrenchStarter
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Mobile menu items

Browse Source
This commit is contained in:
Olu Amey
2023-01-26 06:42:40 -05:00
parent 4ee02e506a
commit 73af103173
1 changed files with 12 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Partials/MobileSideBar.jsx
+12 -62
View File
@@ -1,7 +1,7 @@
import React, { useContext } from "react";
import { NavLink } from "react-router-dom";
import logo from "../../assets/images/logo-2.svg";
import logo3 from "../../assets/images/logo-3.svg";
import logo from "../../assets/images/myfit-logo-2.png"; //logo-2.svg";
import logo3 from "../../assets/images/myfit-logo-2.png"; //logo-3.svg";
import DarkModeContext from "../Contexts/DarkModeContext";
import Icons from "../Helpers/Icons";
@@ -88,107 +88,57 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
</li>
<li className="item group">
<NavLink
to="/active-bids"
to="/reminders"
className="nav-item flex items-center justify-start space-x-3.5"
>
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
<Icons name="active-bids" />
</span>
<span className="item-content relative group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray font-medium active flex-1">
Active Bids
Reminders
<span className="absolute left-24 -top-1 text-sm flex justify-center items-center w-5 h-5 primary-gradient rounded-full text-white">
19
0
</span>
</span>
</NavLink>
</li>
<li className="item group">
<NavLink
to="/market-place"
to="/tracking"
className="nav-item flex items-center justify-start space-x-3.5"
>
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
<Icons name="market" />
</span>
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
Marketplace
<span className="absolute left-28 -top-1 text-sm flex justify-center items-center w-5 h-5 bg-purple rounded-full text-white">
09
</span>
Tracking
</span>
</NavLink>
</li>
<li className="item group">
<NavLink
to="/my-wallet"
to="/calendar"
className="nav-item flex items-center justify-start space-x-3.5"
>
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
<Icons name="wallet-two" />
</span>
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
My Wallet
Calendar
</span>
</NavLink>
</li>
<li className="item group">
<NavLink
to="/my-collection"
to="/resources"
className="nav-item flex items-center justify-start space-x-3.5"
>
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
<Icons name="star" />
</span>
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
My collections
</span>
</NavLink>
</li>
<li className="item group">
<NavLink
to="/sell"
className="nav-item flex items-center justify-start space-x-3.5"
>
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
<Icons name="shop-card" />
</span>
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
Sell
<span className="absolute left-10 -top-1 text-sm flex justify-center items-center w-5 h-5 bg-green-700 rounded-full text-white">
4k
</span>
</span>
</NavLink>
</li>
<li className="item group">
<NavLink
to="/saved"
className="nav-item flex items-center justify-start space-x-3.5"
>
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
<Icons name="heart" />
</span>
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
Saved
<span className="absolute left-14 -top-1 text-sm flex justify-center items-center w-5 h-5 bg-red-500 rounded-full text-white">
32
</span>
</span>
</NavLink>
</li>
<li className="item group">
<NavLink
to="/message"
className="nav-item flex items-center justify-start space-x-3.5"
>
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
<Icons name="message-two" />
</span>
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
Message
<span className="absolute left-20 -top-1 text-sm flex justify-center items-center w-5 h-5 bg-pink rounded-full text-white">
19
</span>
Resources
</span>
</NavLink>
</li>