mobile header styled + refactoring + our strory section on company
This commit is contained in:
@@ -0,0 +1,37 @@
|
||||
import { Tab } from "../../../types/tab";
|
||||
|
||||
interface NavbarTabProps {
|
||||
tab: Tab;
|
||||
isSelected: boolean;
|
||||
onClick: (tab: Tab) => void;
|
||||
}
|
||||
|
||||
const NavbarTabDesktop = ({
|
||||
tab,
|
||||
onClick,
|
||||
isSelected = false,
|
||||
}: NavbarTabProps) => {
|
||||
return (
|
||||
<button
|
||||
className="px-4 text-[#73787C] hover:text-black relative w-fit"
|
||||
onClick={() => onClick(tab)}
|
||||
>
|
||||
<div
|
||||
className={`py-[10px] border-b transition-all duration-300 ${
|
||||
isSelected
|
||||
? "border-b-[#00BED7]"
|
||||
: "border-b-transparent hover:border-b-[#E2E2DC] active:border-b-[#00BED7]"
|
||||
}`}
|
||||
>
|
||||
{tab.value}
|
||||
</div>
|
||||
{tab.count !== 0 && (
|
||||
<div className="absolute top-0 right-0 w-4 h-4 bg-[#00BED7] rounded-full text-white text-[10px] flex items-center justify-center">
|
||||
{tab.count}
|
||||
</div>
|
||||
)}
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
export default NavbarTabDesktop;
|
||||
Reference in New Issue
Block a user