mirror of https://github.com/gabehf/Koito.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
56 lines
1.6 KiB
56 lines
1.6 KiB
import { ExternalLink, Home, Info } from "lucide-react";
|
|
import SidebarSearch from "./SidebarSearch";
|
|
import SidebarItem from "./SidebarItem";
|
|
import SidebarSettings from "./SidebarSettings";
|
|
|
|
export default function Sidebar() {
|
|
const iconSize = 20;
|
|
|
|
return (
|
|
<div className="
|
|
z-50
|
|
flex
|
|
sm:flex-col
|
|
justify-between
|
|
sm:fixed
|
|
sm:top-0
|
|
sm:left-0
|
|
sm:h-screen
|
|
h-auto
|
|
sm:w-auto
|
|
w-full
|
|
border-b
|
|
sm:border-b-0
|
|
sm:border-r
|
|
border-(--color-bg-tertiary)
|
|
pt-2
|
|
sm:py-10
|
|
sm:px-1
|
|
px-4
|
|
bg-(--color-bg)
|
|
">
|
|
<div className="flex gap-4 sm:flex-col">
|
|
<SidebarItem space={10} to="/" name="Home" onClick={() => {}} modal={<></>}>
|
|
<Home size={iconSize} />
|
|
</SidebarItem>
|
|
<SidebarSearch size={iconSize} />
|
|
</div>
|
|
<div className="flex gap-4 sm:flex-col">
|
|
<SidebarItem
|
|
icon
|
|
keyHint={<ExternalLink size={14} />}
|
|
space={22}
|
|
externalLink
|
|
to="https://koito.io"
|
|
name="About"
|
|
onClick={() => {}}
|
|
modal={<></>}
|
|
>
|
|
<Info size={iconSize} />
|
|
</SidebarItem>
|
|
<SidebarSettings size={iconSize} />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|