aside settings btn fixed

This commit was merged in pull request #8.
This commit is contained in:
victorAnumudu
2025-04-08 18:12:08 +01:00
parent 92688000ff
commit 18fc4505dc
9 changed files with 140 additions and 130 deletions
@@ -8,7 +8,7 @@ export default function RightAsideBar() {
let [active, setActive] = useState('orders')
const handleActiveMenu = ({target:{name}}) => {
const handleActiveMenu = (name) => {
let lowerStr = name.toLowerCase()
setActive(lowerStr)
}
@@ -17,13 +17,13 @@ export default function RightAsideBar() {
<div className='w-full h-full flex flex-col gap-8'>
{/* Menu */}
<div className='grid grid-cols-3 gap-8'>
<button name='orders' onClick={(e) => handleActiveMenu(e)} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'orders' && 'scale-[1.2]'}`}>
<button name='orders' onClick={() => handleActiveMenu('orders')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'orders' && 'scale-[1.2]'}`}>
<Icons name='dashboard' className='text-3xl' />
</button>
<button name='tickets' onClick={(e) => handleActiveMenu(e)} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'tickets' && 'scale-[1.2]'}`}>
<button name='tickets' onClick={() => handleActiveMenu('tickets')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'tickets' && 'scale-[1.2]'}`}>
<Icons name='settings' className='text-3xl' />
</button>
<button name='tasks' onClick={(e) => handleActiveMenu(e)} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'tasks' && 'scale-[1.2]'}`}>
<button name='tasks' onClick={() => handleActiveMenu('tasks')} className={`flex justify-center items-center px-2 py-3 large:px-4 large:py-5 rounded-md shadow-round_white bg-[#0E172E] text-white-body hover:scale-[1.1] ${active == 'tasks' && 'scale-[1.2]'}`}>
<Icons name='dashboard' className='text-3xl' />
</button>
</div>