code/components/LinkList.jsx

21 lines
641 B
JavaScript

import { createSignal } from 'solid-js';
function LinkList({ link, text, subtext }) {
const [hoverState, setHoverState] = createSignal(false);
return (
<li
class="opacity-75 hover:opacity-100 transition duration-500 ease-in-out"
onMouseOver={() => setHoverState(true)}
onMouseOut={() => setHoverState(false)}
>
<a
href={link}
class="hover:underline-light-300 hover:text-blue-100"
>{text}</a>
<p class={hoverState() ? 'inline px-3' : 'hidden'} class="transition duration-500 ease-in-out hover:opacity-90 opacity-50"> {subtext}</p>
</li>
);
}
export default LinkList;