saulteafarmer/plebdevs
1
0
Fork 0
mirror of https://github.com/AustinKelsay/plebdevs.git synced 2025-05-15 10:45:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix templates

Browse Source
This commit is contained in:
austinkelsay 2024-11-08 16:20:53 -06:00
parent 1b2a8fff8f
commit cfb37e7d76
No known key found for this signature in database
GPG Key ID: 44CB4EC6D9F2FA02
3 changed files with 27 additions and 32 deletions
src/components/content/carousels/templates
CourseTemplate.jsDocumentTemplate.jsVideoTemplate.js

2
src/components/content/carousels/templates/CourseTemplate.js

@ -80,7 +80,7 @@ export function CourseTemplate({ course, showMetaTags = true }) {
</div> </div>
<CardHeader className="flex flex-row justify-between items-center p-4 border-b border-gray-700"> <CardHeader className="flex flex-row justify-between items-center p-4 border-b border-gray-700">
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
<i className="pi pi-book text-2xl text-[#f8f8ff]"></i> <i className="pi pi-book text-2xl text-[#f8f8ff] max-mob:hidden max-tab:hidden"></i>
<CardTitle className="text-xl sm:text-2xl text-[#f8f8ff]">{course.name}</CardTitle> <CardTitle className="text-xl sm:text-2xl text-[#f8f8ff]">{course.name}</CardTitle>
</div> </div>
<div> <div>

26
src/components/content/carousels/templates/DocumentTemplate.js

@ -53,19 +53,6 @@ export function DocumentTemplate({ document, isLesson, showMetaTags }) {
return ( return (
<Card className="overflow-hidden group hover:shadow-xl transition-all duration-300 bg-gray-800 m-2 border-none"> <Card className="overflow-hidden group hover:shadow-xl transition-all duration-300 bg-gray-800 m-2 border-none">
<CardHeader className="flex justify-between items-center p-4 border-b border-gray-700">
<div className="flex items-center gap-4">
<i className="pi pi-file text-2xl text-[#f8f8ff]"></i>
<CardTitle className="text-xl sm:text-2xl">{document.title}</CardTitle>
</div>
<div>
{document?.price && document?.price > 0 ? (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock" severity="info" text={`${document.price} sats`} />
) : (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock-open" severity="success" text="Free" />
)}
</div>
</CardHeader>
<div className="relative w-full h-0" style={{ paddingBottom: "56.25%" }}> <div className="relative w-full h-0" style={{ paddingBottom: "56.25%" }}>
<Image <Image
alt="document thumbnail" alt="document thumbnail"
@ -80,6 +67,19 @@ export function DocumentTemplate({ document, isLesson, showMetaTags }) {
<ZapDisplay zapAmount={zapAmount} event={document} zapsLoading={zapsLoading && zapAmount === 0} /> <ZapDisplay zapAmount={zapAmount} event={document} zapsLoading={zapsLoading && zapAmount === 0} />
</div> </div>
</div> </div>
<CardHeader className="flex flex-row justify-between items-center p-4">
<div className="flex items-center gap-4">
<i className="pi pi-file text-2xl text-[#f8f8ff] max-mob:hidden max-tab:hidden"></i>
<CardTitle className="text-xl sm:text-2xl text-[#f8f8ff]">{document.title}</CardTitle>
</div>
<div>
{document?.price && document?.price > 0 ? (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock" severity="info" text={`${document.price} sats`} />
) : (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock-open" severity="success" text="Free" />
)}
</div>
</CardHeader>
<CardContent className={`${isMobile ? "px-3" : ""} pt-6 pb-2 w-full flex flex-row justify-between items-start`}> <CardContent className={`${isMobile ? "px-3" : ""} pt-6 pb-2 w-full flex flex-row justify-between items-start`}>
<div className="flex flex-wrap gap-2 max-w-[65%]"> <div className="flex flex-wrap gap-2 max-w-[65%]">
{document?.topics?.map((topic, index) => ( {document?.topics?.map((topic, index) => (

31
src/components/content/carousels/templates/VideoTemplate.js

@ -54,22 +54,6 @@ export function VideoTemplate({ video, isLesson, showMetaTags }) {
return ( return (
<Card className="overflow-hidden group hover:shadow-xl transition-all duration-300 bg-gray-800 m-2 border-none"> <Card className="overflow-hidden group hover:shadow-xl transition-all duration-300 bg-gray-800 m-2 border-none">
{/* Header with title and price */}
<CardHeader className="flex justify-between items-center p-4 border-b border-gray-700">
<div className="flex items-center gap-4">
<i className="pi pi-video text-2xl text-[#f8f8ff]"></i>
<CardTitle className="text-xl sm:text-2xl">{video.title}</CardTitle>
</div>
<div>
{video?.price && video?.price > 0 ? (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock" severity="info" text={`${video.price} sats`} />
) : (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock-open" severity="success" text="Free" />
)}
</div>
</CardHeader>
{/* Image section */}
<div className="relative w-full h-0" style={{ paddingBottom: "56.25%" }}> <div className="relative w-full h-0" style={{ paddingBottom: "56.25%" }}>
<Image <Image
alt="video thumbnail" alt="video thumbnail"
@ -84,8 +68,19 @@ export function VideoTemplate({ video, isLesson, showMetaTags }) {
<ZapDisplay zapAmount={zapAmount} event={video} zapsLoading={zapsLoading && zapAmount === 0} /> <ZapDisplay zapAmount={zapAmount} event={video} zapsLoading={zapsLoading && zapAmount === 0} />
</div> </div>
</div> </div>
<CardHeader className="flex flex-row justify-between items-center p-4">
{/* Content section with tags and duration */} <div className="flex items-center gap-4">
<i className="pi pi-video text-2xl text-[#f8f8ff] max-mob:hidden max-tab:hidden"></i>
<CardTitle className="text-xl sm:text-2xl text-[#f8f8ff]">{video.title}</CardTitle>
</div>
<div>
{video?.price && video?.price > 0 ? (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock" severity="info" text={`${video.price} sats`} />
) : (
<Message className={`${isMobile ? "py-1 text-xs" : "py-2"} whitespace-nowrap`} icon="pi pi-lock-open" severity="success" text="Free" />
)}
</div>
</CardHeader>
<CardContent className={`${isMobile ? "px-3" : ""} pt-6 pb-2 w-full flex flex-row justify-between items-start`}> <CardContent className={`${isMobile ? "px-3" : ""} pt-6 pb-2 w-full flex flex-row justify-between items-start`}>
<div className="flex flex-wrap gap-2 max-w-[65%]"> <div className="flex flex-wrap gap-2 max-w-[65%]">
{video?.topics?.map((topic, index) => ( {video?.topics?.map((topic, index) => (