This repository has been archived on 2024-10-29. You can view files and clone it, but cannot push or open issues or pull requests.
website/components/design/IconLink/IconLink.tsx

38 lines
936 B
TypeScript

import Link from 'next/link'
import classNames from 'clsx'
export interface IconLinkProps {
selected?: boolean
href: string
title?: string
className?: string
}
export const IconLink: React.FC<React.PropsWithChildren<IconLinkProps>> = (
props
) => {
const { children, selected, href, title, className } = props
return (
<Link href={href}>
<a className='group relative flex w-full justify-center' title={title}>
<div
className={classNames('group flex w-full justify-center', className)}
>
{children}
<div className='absolute left-0 flex h-12 w-3 items-center'>
<span
className={classNames(
'absolute w-4/12 rounded-r-lg bg-green-700 group-hover:h-5',
{
'h-full': selected
}
)}
></span>
</div>
</div>
</a>
</Link>
)
}