md.asif5/osaka
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

sorted class name with headwind extension

Browse Source
This commit is contained in:
Md Asif
2024-10-05 00:07:06 +05:30
parent 267d463843
commit 9364a365ec
12 changed files with 81 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/MenuBar.jsx
View File

@@ -2,19 +2,16 @@ import { Link } from "react-router-dom";
import PropTypes from "prop-types";
import { useTranslation } from "react-i18next";
const SubMenu = ({ items }) => {
const {t} = useTranslation();
function SubMenu({ items }) {
const { t } = useTranslation();
return (
<div className="invisible opacity-0
absolute top-full left-0 border-t-3 border-primary dark:border-primary-dark bg-secondary -translate-y-6
dark:bg-secondary-dark rounded-2xl shadow-sm shadow-surface-variant-dark dark:shadow-primary z-50 group-hover:visible group-hover:translate-y-0 group-hover:opacity-100 transition-all duration-200"
>
<div className="absolute left-0 z-50 invisible transition-all duration-200 -translate-y-6 shadow-sm opacity-0 top-full border-t-3 border-primary dark:border-primary-dark bg-secondary dark:bg-secondary-dark rounded-2xl shadow-surface-variant-dark dark:shadow-primary group-hover:visible group-hover:translate-y-0 group-hover:opacity-100">
{items.map((subItem, index) => (
<div key={index} className="px-6 py-2 text-nowrap hover:bg-white dark:hover:bg-secondary-variant-dark cursor-pointer first:rounded-t-2xl second-last:rounded-b-2xl first:pt-4 last:pb-4">
<div key={index} className="px-6 py-2 cursor-pointer text-nowrap hover:bg-white dark:hover:bg-secondary-variant-dark first:rounded-t-2xl second-last:rounded-b-2xl first:pt-4 last:pb-4">
<Link to={subItem.path}>{t(subItem.name)}</Link>
</div>
))}
<svg className="absolute top-0 left-6 mt-[-13px] fill-primary dark:fill-primary-dark" width="16" height="13" viewBox="0 0 16 13" xmlns="http://www.w3.org/2000/svg">
<svg className="absolute top-0 left-6 mt-[-13px] fill-primary dark:fill-primary-dark" width="16" height="13" viewBox="0 0 16 13" xmlns="http://www.w3.org/2000/svg">
<path d="M6.26795 1C7.03775 -0.333332 8.96225 -0.333334 9.73205 0.999999L14.9282 10C15.698 11.3333 14.7358 13 13.1962 13H2.80385C1.26425 13 0.301996 11.3333 1.0718 10L6.26795 1Z" />
</svg>
</div>
@@ -22,11 +19,11 @@ const SubMenu = ({ items }) => {
};
function MenuBar({ menuItems }) {
const {t} = useTranslation();
const { t } = useTranslation();
return (
<div className="flex justify-between text-base pt-5 pb-2 font-body">
<div className="flex justify-between pt-5 pb-2 text-base font-body">
{menuItems.map((item, index) =>
<div key={index} className="group relative pb-3 cursor-pointer">
<div key={index} className="relative pb-3 cursor-pointer group">
{t(item.name)}
{item.submenu.length > 0 && <SubMenu items={item.submenu} />}
</div>