27 lines
976 B
TypeScript
27 lines
976 B
TypeScript
import { FaCog } from "react-icons/fa";
|
|
|
|
export default function Channels() {
|
|
const channels = ["Discussion", "Nature", "Portrait", "Architecture"];
|
|
|
|
return (
|
|
<div className="flex flex-col flex-grow border-b-2 border-b-gray-200">
|
|
<div className="flex justify-between items-center p-4">
|
|
<p className="flex-grow text-gray-500 font-medium text-xl">
|
|
Canaux
|
|
</p>
|
|
<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>
|
|
<ul>
|
|
{channels.map((channel) => (
|
|
<li className="p-2 hover:bg-gray-100 cursor-pointer text-xl flex items-center" key={channel}>
|
|
<p className="flex-grow">
|
|
<span className="text-gray-400">#</span> {channel}
|
|
</p>
|
|
<FaCog className="transition hover:text-gray-700" />
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
)
|
|
}
|