artegoser/ultyt
1
0
Fork 0
mirror of https://github.com/artegoser/ultyt.git synced 2024-11-24 04:46:23 +03:00
Code Issues Projects Releases Packages Wiki Activity

fix: channel tabs

Browse source
This commit is contained in:
Artemy 2023-08-10 10:23:47 +03:00
parent cb6ff89661
commit b7a10179ad
1 changed files with 19 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
src/pages/channel.tsx
View file

@ -6,7 +6,7 @@ import {
VideoContainer, VideoContainer,
} from "../components/video"; } from "../components/video";
import { useParams, useSearchParams } from "react-router-dom"; import { useParams, useSearchParams } from "react-router-dom";
import { Card, CardFooter } from "@nextui-org/react"; import { Button, Card, CardFooter } from "@nextui-org/react";
import { capitalize } from "../components/utils"; import { capitalize } from "../components/utils";
export default function ChannelPage() { export default function ChannelPage() {
@ -48,45 +48,41 @@ export default function ChannelPage() {
} else { } else {
return ( return (
<div className="grid grid-rows p-4"> <div className="grid grid-rows p-4">
<div className=""> <Card radius="lg" shadow="none">
<Card radius="lg" shadow="none"> <div className="p-4">
<div className="p-4"> <img className="w-full rounded-xl" src={channel.bannerUrl} />
<img className="w-full rounded-xl" src={channel.bannerUrl} /> </div>
</div> <CardFooter className="p-4 justify-between ">
<CardFooter className="p-4 justify-between "> <div className="flex flex-col">
<div className="flex flex-col"> <div className="flex flex-row gap-2 text-xl font-bold pl-2">
<div className="flex flex-row gap-2 text-xl font-bold pl-2"> {channel.name}
{channel.name}
</div>
</div> </div>
</CardFooter> </div>
</Card> </CardFooter>
</div> </Card>
<div className="flex flex-row flex-wrap gap-2 bg-white rounded-xl mt-4"> <div className="flex flex-row flex-wrap gap-2 mt-4">
<div <Button
style={{ cursor: "pointer" }}
onClick={() => { onClick={() => {
setSearchParams({ tabId: "videos" }); setSearchParams({ tabId: "videos" });
}} }}
key="videos" key="videos"
className="text-xl font-bold p-4" className="text-xl font-bold mt-4"
> >
Videos Videos
</div> </Button>
{channel.tabs.map((tab, index) => { {channel.tabs.map((tab, index) => {
return ( return (
<div <Button
style={{ cursor: "pointer" }}
onClick={() => { onClick={() => {
setSearchParams({ tabId: String(index) }); setSearchParams({ tabId: String(index) });
setTab(undefined); setTab(undefined);
}} }}
key={tab.name} key={tab.name}
className="text-xl font-bold p-4" className="text-xl font-bold mt-4"
> >
{capitalize(tab.name)} {capitalize(tab.name)}
</div> </Button>
); );
})} })}
</div> </div>