Pages added
This commit is contained in:
Olu Amey
@@ -165,133 +165,15 @@ export default function RightSideBar() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="chart-two bg-white dark:bg-dark-white rounded-2xl p-8 2xl:w-[268px] w-full 2xl:mb-10 flex flex-col justify-between border 2xl:border-none ">
|
||||
<div>
|
||||
{/* dropdown heading */}
|
||||
<div className="flex space-x-2 items-center mb-5 relative cursor-pointer">
|
||||
{/* icon area */}
|
||||
<div className="icon-area">
|
||||
{selectedRate === "LTC" ? (
|
||||
<LtcIco />
|
||||
) : selectedRate === "USD" ? (
|
||||
<Usdt />
|
||||
) : selectedRate === "BTC" ? (
|
||||
<BtcIco />
|
||||
) : (
|
||||
<EthIco />
|
||||
)}
|
||||
</div>
|
||||
{/* heading */}
|
||||
<div
|
||||
className="heading flex space-x-1 items-center"
|
||||
onClick={() => setRateStaticsDropdown(!rateStaticsDropdown)}
|
||||
>
|
||||
<span className="text-xl font-bold text-dark-gray dark:text-white">
|
||||
{selectedRate} rate
|
||||
</span>
|
||||
<span className="text-[#374557] dark:text-thin-light-gray">
|
||||
<svg
|
||||
width="14"
|
||||
height="7"
|
||||
viewBox="0 0 14 7"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="fill-current"
|
||||
>
|
||||
<path d="M13.7092 0.288658C13.6163 0.197192 13.5057 0.124593 13.3839 0.0750502C13.262 0.025507 13.1313 0 12.9993 0C12.8673 0 12.7366 0.025507 12.6148 0.0750502C12.4929 0.124593 12.3824 0.197192 12.2894 0.288658L7.70992 4.7581C7.61697 4.84956 7.50638 4.92216 7.38453 4.9717C7.26269 5.02125 7.132 5.04676 7 5.04676C6.868 5.04676 6.73731 5.02125 6.61547 4.9717C6.49362 4.92216 6.38303 4.84956 6.29008 4.7581L1.7106 0.288658C1.61765 0.197192 1.50706 0.124593 1.38521 0.0750502C1.26337 0.025507 1.13268 0 1.00068 0C0.868682 0 0.737991 0.025507 0.616146 0.0750502C0.4943 0.124593 0.383712 0.197192 0.29076 0.288658C0.10453 0.471497 0 0.718831 0 0.976639C0 1.23445 0.10453 1.48178 0.29076 1.66462L4.88024 6.14382C5.44268 6.69206 6.20509 7 7 7C7.79491 7 8.55732 6.69206 9.11976 6.14382L13.7092 1.66462C13.8955 1.48178 14 1.23445 14 0.976639C14 0.718831 13.8955 0.471497 13.7092 0.288658Z" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className={`rate-statics-dropdown w-[164px] h-[170px] bg-white dark:bg-dark-white py-3 px-5 absolute rounded ${
|
||||
rateStaticsDropdown ? "active" : ""
|
||||
}`}
|
||||
style={{ boxShadow: "0px 4px 87px 0px #0000002B" }}
|
||||
>
|
||||
<ul className="flex flex-col justify-between h-full">
|
||||
<li
|
||||
className="flex space-x-2.5 items-center cursor-pointer"
|
||||
onClick={() => rateDataSetHandler("ETH")}
|
||||
>
|
||||
<span>
|
||||
<EthIco />
|
||||
</span>
|
||||
<span className="text-thin-light-gray text-base tracking-wide">
|
||||
ETH Rate
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
className="flex space-x-2.5 items-center cursor-pointer"
|
||||
onClick={() => rateDataSetHandler("USD")}
|
||||
>
|
||||
<span>
|
||||
<Usdt />
|
||||
</span>
|
||||
<span className="text-thin-light-gray text-base tracking-wide">
|
||||
USDT Rate
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
className="flex space-x-2.5 items-center cursor-pointer"
|
||||
onClick={() => rateDataSetHandler("BTC")}
|
||||
>
|
||||
<span>
|
||||
<BtcIco />
|
||||
</span>
|
||||
<span className="text-thin-light-gray text-base tracking-wide">
|
||||
BTC Rate
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
className="flex space-x-2.5 items-center cursor-pointer"
|
||||
onClick={() => rateDataSetHandler("LTC")}
|
||||
>
|
||||
<span>
|
||||
<LtcIco />
|
||||
</span>
|
||||
<span className="text-thin-light-gray text-base tracking-wide">
|
||||
LTC Rate
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{/* details Money */}
|
||||
<div className="money-details mb-5">
|
||||
<p className="text-xl font-bold text-dark-gray dark:text-white">
|
||||
$7473.67 USD
|
||||
</p>
|
||||
<p className="text-sm text-light-green">+324.75 (11.5%)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="miniLineChart">
|
||||
<MiniLineChart height="122px" datasets={filterRateStatics} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* top-creator */}
|
||||
<div className="top-creator bg-white dark:bg-dark-white rounded-2xl p-8 2xl:w-[268px] w-full 2xl:mb-10 2xl:border-none border ">
|
||||
{/* heading */}
|
||||
<div className="heading flex justify-between items-center mb-3.5">
|
||||
<h3 className="text-xl font-bold text-dark-gray dark:text-white">
|
||||
Top creator
|
||||
Recent
|
||||
</h3>
|
||||
<div className="flex space-x-1 items-center">
|
||||
<span className="text-sm text-thin-light-gray">Weekly</span>
|
||||
<span className="text-[#374557] dark:text-thin-light-gray">
|
||||
<svg
|
||||
width="13"
|
||||
height="6"
|
||||
viewBox="0 0 13 6"
|
||||
className="fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
opacity="0.7"
|
||||
d="M12.4124 0.247421C12.3327 0.169022 12.2379 0.106794 12.1335 0.0643287C12.0291 0.0218632 11.917 0 11.8039 0C11.6908 0 11.5787 0.0218632 11.4743 0.0643287C11.3699 0.106794 11.2751 0.169022 11.1954 0.247421L7.27012 4.07837C7.19045 4.15677 7.09566 4.219 6.99122 4.26146C6.88678 4.30393 6.77476 4.32579 6.66162 4.32579C6.54848 4.32579 6.43646 4.30393 6.33202 4.26146C6.22758 4.219 6.13279 4.15677 6.05312 4.07837L2.12785 0.247421C2.04818 0.169022 1.95338 0.106794 1.84895 0.0643287C1.74451 0.0218632 1.63249 0 1.51935 0C1.40621 0 1.29419 0.0218632 1.18975 0.0643287C1.08531 0.106794 0.990517 0.169022 0.910844 0.247421C0.751218 0.404141 0.661621 0.616141 0.661621 0.837119C0.661621 1.0581 0.751218 1.2701 0.910844 1.42682L4.84468 5.26613C5.32677 5.73605 5.98027 6 6.66162 6C7.34297 6 7.99647 5.73605 8.47856 5.26613L12.4124 1.42682C12.572 1.2701 12.6616 1.0581 12.6616 0.837119C12.6616 0.616141 12.572 0.404141 12.4124 0.247421Z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="creator-list">
|
||||
@@ -442,10 +324,9 @@ export default function RightSideBar() {
|
||||
{/* heading */}
|
||||
<div className="heading flex justify-between items-center mb-3.5">
|
||||
<h3 className="text-xl font-bold text-dark-gray dark:text-white">
|
||||
Top Platform
|
||||
Quick Links
|
||||
</h3>
|
||||
<div>
|
||||
<span className="text-sm text-thin-light-gray">View all</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -115,7 +115,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/active-bids"
|
||||
to="/reminders"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
@@ -136,6 +136,29 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/tracking"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<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 dark:text-lighter-gray">
|
||||
<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 ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Tracking
|
||||
<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
|
||||
</span>
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/active-bids"
|
||||
@@ -152,56 +175,13 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Active Bids
|
||||
Calendar
|
||||
<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
|
||||
</span>
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/market-place"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<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 dark:text-lighter-gray">
|
||||
<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 ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
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>
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/my-wallet"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<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 dark:text-lighter-gray">
|
||||
<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 ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
My Wallet
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/my-collection"
|
||||
@@ -245,29 +225,6 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/saved"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<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 dark:text-lighter-gray">
|
||||
<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 ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
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"
|
||||
|
||||
Reference in New Issue
Block a user