File size: 822 Bytes
3e5a169 21b8785 3e5a169 21b8785 a2297a7 29a0119 a2297a7 5e8d5e4 3e5a169 21b8785 3e5a169 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<script lang="ts">
interface Props {
isCollapsed: boolean;
onClick: () => void;
classNames: string;
}
let { isCollapsed, classNames, onClick }: Props = $props();
</script>
<button
onclick={onClick}
title={isCollapsed ? "Expand sidebar" : "Collapse sidebar"}
class="{classNames} group flex h-16 w-6 flex-col items-center justify-center -space-y-1 outline-none *:h-3 *:w-1 *:rounded-full *:hover:bg-gray-300 dark:*:hover:bg-gray-600 max-md:hidden {!isCollapsed
? '*:bg-gray-400 dark:*:bg-gray-500'
: '*:bg-gray-400 dark:*:bg-gray-500'}"
name="sidebar-toggle"
aria-label="Toggle sidebar navigation"
>
<div class={!isCollapsed ? "group-hover:rotate-[20deg]" : "group-hover:-rotate-[20deg]"}></div>
<div class={!isCollapsed ? "group-hover:-rotate-[20deg]" : "group-hover:rotate-[20deg]"}></div>
</button>
|