Main Menu Updated

- Main Menu updated to include dividers and subtext
- Heading of menu updated to fix padding
This commit is contained in:
Dogma
2024-04-15 22:07:58 +10:00
parent 8a3db4083f
commit 413285f03d
2 changed files with 10 additions and 3 deletions

View File

@@ -11,7 +11,7 @@ export function Menu(props: {
children?: JSX.Element | JSX.Element[],
}) {
return <div data-open={props.open} className="w-[430px] absolute top-[62px] left-16 z-ui-0 h-screen overflow-y-auto transition-transform data-[open='false']:-translate-x-full bg-gray-200 dark:bg-olympus-700" tabIndex={-1}>
<h5 className="w-full inline-flex items-center pb-3 p-4 shadow-lg font-semibold text-gray-800 dark:text-gray-400">
<h5 className="w-full inline-flex items-center py-3 pb-2 px-5 shadow-lg font-semibold text-gray-800 dark:text-gray-400">
{props.showBackButton && <FontAwesomeIcon onClick={props.onBack ?? (() => { })} icon={faArrowLeft} className="mr-1 cursor-pointer p-2 rounded-md dark:hover:bg-gray-700 dark:text-gray-500 dark:hover:text-white"/>} {props.title}
<FontAwesomeIcon onClick={props.onClose} icon={faClose} className="flex text-lg items-center cursor-pointer justify-center ml-auto p-2 rounded-md hover:bg-gray-200 dark:hover:bg-gray-700 dark:hover:text-white dark:text-gray-500 "/>
</h5>