admin-aaw/snapify-authentik
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

limit video title length to 2 lines

Browse source
This commit is contained in:
MarconLP 2023-04-11 09:43:08 +02:00
parent 41aa1802ea
commit 74670a0cd4
No known key found for this signature in database
GPG key ID: F4CAFFDFA3451D5E
1 changed files with 7 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/pages/videos.tsx
View file

@ -18,7 +18,11 @@ const VideoList: NextPage = () => {
<div className="container flex flex-row items-center justify-center gap-12 px-4 py-16 text-white "> <div className="container flex flex-row items-center justify-center gap-12 px-4 py-16 text-white ">
{[ {[
{ title: "are pings bad?", id: "4e98f4a" }, { title: "are pings bad?", id: "4e98f4a" },
{ title: "do you really need a backend?", id: "h4b98rt" }, {
title:
"do you really need a backend? because there is a much better alternative to it.",
id: "h4b98rt",
},
{ title: "how next works", id: "h7r9e" }, { title: "how next works", id: "h7r9e" },
].map(({ title, id }) => ( ].map(({ title, id }) => (
<VideoCard title={title} id={id} key={id} /> <VideoCard title={title} id={id} key={id} />
@ -37,7 +41,7 @@ interface VideoCardProps {
const VideoCard = ({ title, id }: VideoCardProps) => { const VideoCard = ({ title, id }: VideoCardProps) => {
return ( return (
<Link href={`/share/${id}`}> <Link href={`/share/${id}`}>
<div className="h-[220px] w-[250px] cursor-pointer overflow-hidden rounded-lg border border-[#3f3f46] text-sm font-normal"> <div className="h-[240px] w-[250px] cursor-pointer overflow-hidden rounded-lg border border-[#3f3f46] text-sm font-normal">
<figure> <figure>
<img <img
src="https://daisyui.com/images/stock/photo-1606107557195-0e29a4b5b4aa.jpg" src="https://daisyui.com/images/stock/photo-1606107557195-0e29a4b5b4aa.jpg"
@ -45,7 +49,7 @@ const VideoCard = ({ title, id }: VideoCardProps) => {
/> />
</figure> </figure>
<div className="m-4 flex flex-col"> <div className="m-4 flex flex-col">
<span className="font-bold">{title}</span> <span className="line-clamp-2 font-bold">{title}</span>
<span className="">12 days ago</span> <span className="">12 days ago</span>
</div> </div>
</div> </div>