Open monaldmuck opened 8 months ago
import React, { useState } from 'react'; import { Link, useNavigate } from 'react-router-dom';
import { logo, sun } from '../assets'; import { navlinks } from '../constants';
const Icon = ({ styles, name, imgUrl, isActive, disabled, handleClick }) => ( <div className={w-[48px] h-[48px] rounded-[10px] ${isActive && isActive === name && 'bg-[#2c2f32]'} flex justify-center items-center ${!disabled && 'cursor-pointer'} ${styles}} onClick={handleClick}> {!isActive ? (
w-[48px] h-[48px] rounded-[10px] ${isActive && isActive === name && 'bg-[#2c2f32]'} flex justify-center items-center ${!disabled && 'cursor-pointer'} ${styles}
) : ( <img src={imgUrl} alt="fund_logo" className={`w-1/2 h-1/2 ${isActive !== name && 'grayscale'}`} /> )}
const Sidebar = () => { const navigate = useNavigate(); const [isActive, setIsActive] = useState('dashboard');
return (
) }
export default Sidebar
this is my sidebar code and the icons are jumbled and do not have a background \
import React, { useState } from 'react'; import { Link, useNavigate } from 'react-router-dom';
import { logo, sun } from '../assets'; import { navlinks } from '../constants';
const Icon = ({ styles, name, imgUrl, isActive, disabled, handleClick }) => ( <div className={
w-[48px] h-[48px] rounded-[10px] ${isActive && isActive === name && 'bg-[#2c2f32]'} flex justify-center items-center ${!disabled && 'cursor-pointer'} ${styles}} onClick={handleClick}> {!isActive ? (const Sidebar = () => { const navigate = useNavigate(); const [isActive, setIsActive] = useState('dashboard');
return (
) }
export default Sidebar
this is my sidebar code and the icons are jumbled and do not have a background \