left panel link component

This commit is contained in:
Guillaume Dorce 2023-09-10 18:02:30 +02:00
parent 4d0cfdbaea
commit 053f78ef27
1 changed files with 12 additions and 5 deletions

View File

@ -1,3 +1,4 @@
import type { ComponentChild } from "preact";
import { FaCog } from "react-icons/fa"; import { FaCog } from "react-icons/fa";
function User() { function User() {
@ -18,7 +19,7 @@ function Channels() {
<p className="flex-grow text-gray-500 font-medium text-xl"> <p className="flex-grow text-gray-500 font-medium text-xl">
Canaux Canaux
</p> </p>
<button className="px-2 py-1 transition-all text-gray-400 hover:text-gray-500 hover:bg-gray-100 text-xl border border-gray-300 rounded-sm">+</button> <button className="px-1 pb-1 leading-none transition-all text-gray-400 hover:text-gray-500 hover:bg-gray-100 text-xl border border-gray-300 rounded-md">+</button>
</div> </div>
<ul> <ul>
{channels.map((channel) => ( {channels.map((channel) => (
@ -37,18 +38,24 @@ function Channels() {
function UserPersonnalLinks() { function UserPersonnalLinks() {
return ( return (
<div className="flex flex-col border-b-2 border-b-gray-200 h-fit"> <div className="flex flex-col border-b-2 border-b-gray-200 h-fit">
<p className="text-xl hover:bg-gray-100 cursor-pointer px-4 py-2">Galerie personelle</p> <SectionLink>Galerie personelle</SectionLink>
</div> </div>
) )
} }
function SectionLink({children, className = ""}: {children: ComponentChild, className?: string}) {
return (
<p className={"text-xl hover:bg-gray-100 cursor-pointer px-4 py-2" + className}>{children}</p>
)
}
function SiteManagement() { function SiteManagement() {
return ( return (
<div className="flex flex-col"> <div className="flex flex-col">
<p className="text-xl text-gray-500 mb-1 p-4">Gestion du site</p> <p className="text-xl text-gray-500 mb-1 p-4">Gestion du site</p>
<p className="text-xl hover:bg-gray-100 cursor-pointer px-4 py-2">Membres</p> <SectionLink>Membres</SectionLink>
<p className="text-xl hover:bg-gray-100 cursor-pointer px-4 py-2">Pages</p> <SectionLink>Pages</SectionLink>
<p className="text-xl hover:bg-gray-100 cursor-pointer px-4 py-2">Galeries</p> <SectionLink>Galeries</SectionLink>
</div> </div>
) )
} }