charlestehio/memefast
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
ct
2025-07-17 01:20:15 +08:00
parent ade86ef772
commit 947dd19dcb
11 changed files with 465 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
resources/js/pages/FrontPages/DmcaCopyright.tsx Normal file
View File

@@ -0,0 +1,29 @@
import Footer from '@/pages/home/partials/Footer.jsx';
import { Head } from '@inertiajs/react';
import React from 'react';
interface DmcaCopyrightProps {
content: string;
title: string;
}
const DmcaCopyright: React.FC<DmcaCopyrightProps> = ({ content, title }) => {
return (
<div className="min-h-[100vh] bg-neutral-50 dark:bg-black">
<Head title={title} />
<div className="container mx-auto px-4 py-8">
<div className="mx-auto max-w-4xl">
<div className="rounded-lg bg-white p-8 shadow-lg dark:bg-neutral-900">
<div className="max-w-none" dangerouslySetInnerHTML={{ __html: content }} />
</div>
</div>
</div>
<Footer />
{/* <AuthUser /> */}
</div>
);
};
export default DmcaCopyright;

3
resources/js/pages/home/partials/Footer.jsx
View File

@@ -41,6 +41,9 @@ const Footer = () => {
<a href={route('privacy')} className="text-muted-foreground hover:text-foreground text-sm transition-colors">
Privacy
</a>
<a href={route('dmca-copyright')} className="text-muted-foreground hover:text-foreground text-sm transition-colors">
DMCA
</a>
{import.meta.env.VITE_DISCORD_LINK && (
<a
href={import.meta.env.VITE_DISCORD_LINK}

25
resources/js/pages/memes/index.tsx
View File

@@ -1,10 +1,10 @@
import { MemeCard } from '@/components/custom/meme-card';
import { Badge } from '@/components/ui/badge';
import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from '@/components/ui/breadcrumb';
import { Button } from '@/components/ui/button';
import { Card, CardContent } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import { KeywordBadge } from '@/components/ui/keyword-badge';
import { MemeCard } from '@/components/custom/meme-card';
import Footer from '@/pages/home/partials/Footer';
import { Link, router } from '@inertiajs/react';
import { Search } from 'lucide-react';
@@ -44,9 +44,10 @@ interface Props {
filters: {
search?: string;
};
dynamicDescription?: string;
}
export default function MemesIndex({ memes, popularKeywords, filters }: Props) {
export default function MemesIndex({ memes, popularKeywords, filters, dynamicDescription }: Props) {
const [search, setSearch] = useState(filters.search || '');
const handleSearch = (e: React.FormEvent) => {
@@ -77,7 +78,7 @@ export default function MemesIndex({ memes, popularKeywords, filters }: Props) {
<div className="min-h-screen bg-neutral-50 pb-10 dark:bg-black">
<div className="container mx-auto px-4 pt-8 pb-0">
<BrandLogo className="py-3"></BrandLogo>
{/* Breadcrumbs */}
<Breadcrumb className="mb-6">
<BreadcrumbList>
@@ -88,19 +89,21 @@ export default function MemesIndex({ memes, popularKeywords, filters }: Props) {
</BreadcrumbItem>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbPage>
{filters.search ? `Search: ${filters.search}` : 'Meme Library'}
</BreadcrumbPage>
<BreadcrumbPage>{filters.search ? `${filters.search.charAt(0).toUpperCase() + filters.search.slice(1)} Memes` : 'Meme Library'}</BreadcrumbPage>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
{/* Header */}
<div className="mb-8 text-center">
<h1 className="text-foreground mb-4 text-4xl font-bold">Meme Library</h1>
<h1 className="text-foreground mb-4 text-4xl font-bold">
{filters.search ? `${filters.search.charAt(0).toUpperCase() + filters.search.slice(1)} Memes` : 'Meme Library'}
</h1>
<p className="text-muted-foreground mx-auto max-w-2xl text-xl">
Thousands of memes ready for TikTok, Reels, Threads and YouTube Shorts. No signup needed - click any meme to start
creating!
{filters.search
? (dynamicDescription || `Discover ${filters.search} meme templates and create viral content for TikTok, Instagram Reels, and YouTube Shorts.`)
: 'Thousands of memes ready for TikTok, Reels, Threads and YouTube Shorts. No signup needed - click any meme to start creating!'
}
</p>
</div>
@@ -131,7 +134,7 @@ export default function MemesIndex({ memes, popularKeywords, filters }: Props) {
{/* Popular Keywords */}
<div className="mt-4">
<h3 className="text-foreground mb-3 text-sm font-medium">Popular Keywords</h3>
<h2 className="text-foreground mb-3 text-sm font-medium">Popular Keywords</h2>
<div className="flex flex-wrap gap-2">
{popularKeywords.map((keyword) => (
<KeywordBadge key={keyword} keyword={keyword} size="lg" />

17
resources/js/pages/memes/show.tsx
View File

@@ -1,10 +1,12 @@
import { MemeCard } from '@/components/custom/meme-card';
import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from '@/components/ui/breadcrumb';
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { KeywordBadge } from '@/components/ui/keyword-badge';
import { Spinner } from '@/components/ui/spinner';
import Footer from '@/pages/home/partials/Footer';
import { Link } from '@inertiajs/react';
import { ArrowLeft } from 'lucide-react';
import { useEffect, useState } from 'react';
import { route } from 'ziggy-js';
import BrandLogo from '../home/partials/BrandLogo';
@@ -82,7 +84,7 @@ export default function MemeShow({ meme, relatedMemes }: Props) {
<div className="container mx-auto mb-6 space-y-2 px-4 text-center">
<h1 className="text-foreground text-3xl font-bold">{meme.name} Meme</h1>
<h2 className="text-muted-foreground">
Use our video meme editor to customise your {meme.name} meme and save to a video in minutes!
Use our video meme editor to customise your {meme.name} meme and export as MP4 video in minutes!
</h2>
</div>
{isClient && Editor ? (
@@ -104,9 +106,10 @@ export default function MemeShow({ meme, relatedMemes }: Props) {
<Card className="h-auto">
<CardHeader>
<CardTitle className="text-lg">Know Your Meme</CardTitle>
<CardDescription>Learn more about {meme.name} meme!</CardDescription>
<CardDescription className="hidden"></CardDescription>
</CardHeader>
<CardContent>
<b>Description: </b>
{meme.description && (
<div className="mb-4">
<p className="text-muted-foreground text-sm leading-relaxed">{meme.description}</p>
@@ -139,6 +142,16 @@ export default function MemeShow({ meme, relatedMemes }: Props) {
</Card>
)}
</div>
{/* Back to Meme Library Button */}
<div className="mt-8 text-center">
<Link href={route('memes.index')}>
<Button variant="outline" size="lg" className="gap-2">
<ArrowLeft className="h-4 w-4" />
Back to Meme Library
</Button>
</Link>
</div>
</div>
<Footer />
{/* <AuthUser /> */}