gabehf/Koito
1
0
Fork 0
mirror of https://github.com/gabehf/Koito.git synced 2026-03-14 01:46:09 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: version v0.0.2

Browse source
This commit is contained in:
Gabe Farrell 2025-06-14 19:14:30 -04:00
parent 0dceaf017a
commit 7ff317756f
36 changed files with 336 additions and 160 deletions
Download patch file Download diff file Expand all files Collapse all files

36
client/app/components/sidebar/Sidebar.tsx
View file

@ -1,22 +1,36 @@
import { ExternalLink, Home, Info } from "lucide-react";
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 flex-col justify-between h-screen border-r-1 border-(--color-bg-tertiary) p-1 py-10 sticky left-0 top-0 bg-(--color-bg)">
<div className="flex flex-col gap-4">
<SidebarItem space={10} to="/" name="Home" onClick={() => {}} modal={<></>}><Home size={iconSize} /></SidebarItem>
<SidebarSearch size={iconSize} />
</div>
<div className="flex flex-col gap-4">
<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 className="overflow-x-hidden w-full sm:w-auto">
<div className="z-50 flex sm:flex-col justify-between 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 sticky top-0 sm:left-0 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>
</div>
);
}
}