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