Add Christmas theme and quotes for December
Introduces a Christmas-themed UI to the homepage during December, including festive colors and a holiday footer message. Adds a collection of Christmas quotes and updates quote selection logic to use them in December, with new utility functions for date checks and quote retrieval.
This commit is contained in:
78
app/page.tsx
78
app/page.tsx
@@ -5,6 +5,7 @@ import { Shield, LineChart, Zap, ArrowRight, CheckCircle2, Sparkles } from "luci
|
|||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { AnimatedStatsSection } from "@/components/animated-stats-section";
|
import { AnimatedStatsSection } from "@/components/animated-stats-section";
|
||||||
|
import { isDecember } from "@/lib/utils/christmas";
|
||||||
|
|
||||||
export const dynamic = 'force-dynamic';
|
export const dynamic = 'force-dynamic';
|
||||||
|
|
||||||
@@ -30,29 +31,50 @@ function formatCurrencyValue(amount: number): string {
|
|||||||
export default async function Home() {
|
export default async function Home() {
|
||||||
try {
|
try {
|
||||||
const stats = await getPlatformStatsServer();
|
const stats = await getPlatformStatsServer();
|
||||||
|
const isDec = isDecember();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col min-h-screen bg-black text-white">
|
<div className={`flex flex-col min-h-screen bg-black text-white ${isDec ? 'christmas-theme' : ''}`}>
|
||||||
<div className="absolute inset-0 bg-gradient-to-br from-[#D53F8C]/10 via-[#D53F8C]/3 to-transparent pointer-events-none scale-100" />
|
<div className={`absolute inset-0 bg-gradient-to-br pointer-events-none scale-100 ${
|
||||||
|
isDec
|
||||||
|
? 'from-red-500/10 via-green-500/5 to-transparent'
|
||||||
|
: 'from-[#D53F8C]/10 via-[#D53F8C]/3 to-transparent'
|
||||||
|
}`} />
|
||||||
<HomeNavbar />
|
<HomeNavbar />
|
||||||
|
|
||||||
{/* Hero Section */}
|
{/* Hero Section */}
|
||||||
<section className="relative overflow-hidden">
|
<section className="relative overflow-hidden">
|
||||||
<div className="relative flex flex-col items-center px-4 py-20 md:py-32 mx-auto max-w-7xl">
|
<div className="relative flex flex-col items-center px-4 py-20 md:py-32 mx-auto max-w-7xl">
|
||||||
<div className="flex flex-col items-center text-center space-y-6 max-w-3xl">
|
<div className="flex flex-col items-center text-center space-y-6 max-w-3xl">
|
||||||
<div className="inline-flex items-center px-4 py-2 rounded-full bg-[#D53F8C]/10 border border-[#D53F8C]/20 mb-4">
|
<div className={`inline-flex items-center px-4 py-2 rounded-full border mb-4 ${
|
||||||
<Sparkles className="h-4 w-4 text-[#D53F8C] mr-2" />
|
isDec
|
||||||
<span className="text-sm font-medium text-[#D53F8C]">Secure Crypto Payments</span>
|
? 'bg-red-500/10 border-red-500/20'
|
||||||
|
: 'bg-[#D53F8C]/10 border-[#D53F8C]/20'
|
||||||
|
}`}>
|
||||||
|
<Sparkles className={`h-4 w-4 mr-2 ${isDec ? 'text-red-400' : 'text-[#D53F8C]'}`} />
|
||||||
|
<span className={`text-sm font-medium ${isDec ? 'text-red-400' : 'text-[#D53F8C]'}`}>
|
||||||
|
Secure Crypto Payments
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<h1 className="text-4xl md:text-6xl font-bold tracking-tight">
|
<h1 className="text-4xl md:text-6xl font-bold tracking-tight">
|
||||||
The Future of <span className="text-[#D53F8C]">E-commerce</span> Management
|
The Future of <span className={isDec ? 'text-red-400' : 'text-[#D53F8C]'}>E-commerce</span> Management
|
||||||
</h1>
|
</h1>
|
||||||
<p className="text-lg md:text-xl text-zinc-400 max-w-2xl">
|
<p className="text-lg md:text-xl text-zinc-400 max-w-2xl">
|
||||||
Streamline your online business with our all-in-one platform. Secure payments, order tracking, and analytics in one place.
|
{isDec
|
||||||
|
? 'Spread joy this holiday season with our all-in-one platform. Secure payments, order tracking, and analytics wrapped up in one beautiful package. 🎄'
|
||||||
|
: 'Streamline your online business with our all-in-one platform. Secure payments, order tracking, and analytics in one place.'
|
||||||
|
}
|
||||||
</p>
|
</p>
|
||||||
<div className="flex flex-col sm:flex-row gap-4 mt-4">
|
<div className="flex flex-col sm:flex-row gap-4 mt-4">
|
||||||
<Link href="/dashboard">
|
<Link href="/dashboard">
|
||||||
<Button size="lg" className="gap-2 bg-[#D53F8C] hover:bg-[#B83280] text-white border-0 h-12 px-8">
|
<Button
|
||||||
|
size="lg"
|
||||||
|
className={`gap-2 text-white border-0 h-12 px-8 ${
|
||||||
|
isDec
|
||||||
|
? 'bg-gradient-to-r from-red-500 to-green-500 hover:from-red-600 hover:to-green-600'
|
||||||
|
: 'bg-[#D53F8C] hover:bg-[#B83280]'
|
||||||
|
}`}
|
||||||
|
>
|
||||||
Get Started
|
Get Started
|
||||||
<ArrowRight className="h-4 w-4" />
|
<ArrowRight className="h-4 w-4" />
|
||||||
</Button>
|
</Button>
|
||||||
@@ -82,18 +104,38 @@ export default async function Home() {
|
|||||||
title: "Lightning Fast",
|
title: "Lightning Fast",
|
||||||
description: "Optimized for speed with real-time updates and instant notifications."
|
description: "Optimized for speed with real-time updates and instant notifications."
|
||||||
}
|
}
|
||||||
].map((feature, i) => (
|
].map((feature, i) => {
|
||||||
<div key={i} className="group relative overflow-hidden rounded-xl bg-gradient-to-b from-zinc-800/30 to-transparent p-6 border border-zinc-800">
|
const christmasColors = ['from-red-500/5', 'from-green-500/5', 'from-yellow-500/5'];
|
||||||
<div className="absolute inset-0 bg-gradient-to-b from-[#D53F8C]/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
|
const christmasBorders = ['border-red-500/30', 'border-green-500/30', 'border-yellow-500/30'];
|
||||||
|
const christmasIcons = ['text-red-400', 'text-green-400', 'text-yellow-400'];
|
||||||
|
const christmasBgs = ['bg-red-500/10', 'bg-green-500/10', 'bg-yellow-500/10'];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
key={i}
|
||||||
|
className={`group relative overflow-hidden rounded-xl bg-gradient-to-b p-6 border ${
|
||||||
|
isDec
|
||||||
|
? `from-zinc-800/30 to-transparent ${christmasBorders[i % 3]}`
|
||||||
|
: 'from-zinc-800/30 to-transparent border-zinc-800'
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`absolute inset-0 bg-gradient-to-b to-transparent opacity-0 group-hover:opacity-100 transition-opacity ${
|
||||||
|
isDec ? christmasColors[i % 3] : 'from-[#D53F8C]/5'
|
||||||
|
}`}
|
||||||
|
/>
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<div className="h-12 w-12 flex items-center justify-center rounded-lg bg-[#D53F8C]/10 mb-4">
|
<div className={`h-12 w-12 flex items-center justify-center rounded-lg mb-4 ${
|
||||||
<feature.icon className="h-6 w-6 text-[#D53F8C]" />
|
isDec ? christmasBgs[i % 3] : 'bg-[#D53F8C]/10'
|
||||||
|
}`}>
|
||||||
|
<feature.icon className={`h-6 w-6 ${isDec ? christmasIcons[i % 3] : 'text-[#D53F8C]'}`} />
|
||||||
</div>
|
</div>
|
||||||
<h3 className="text-lg font-semibold text-white mb-2">{feature.title}</h3>
|
<h3 className="text-lg font-semibold text-white mb-2">{feature.title}</h3>
|
||||||
<p className="text-sm text-zinc-400">{feature.description}</p>
|
<p className="text-sm text-zinc-400">{feature.description}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
))}
|
);
|
||||||
|
})}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Stats Section */}
|
{/* Stats Section */}
|
||||||
@@ -106,9 +148,13 @@ export default async function Home() {
|
|||||||
{/* Footer */}
|
{/* Footer */}
|
||||||
<footer className="relative py-12 px-4 mt-auto">
|
<footer className="relative py-12 px-4 mt-auto">
|
||||||
<div className="max-w-7xl mx-auto flex flex-col items-center">
|
<div className="max-w-7xl mx-auto flex flex-col items-center">
|
||||||
<div className="flex items-center gap-2 mb-4">
|
{isDec && (
|
||||||
|
<div className="flex items-center gap-2 mb-4 text-red-400 animate-twinkle">
|
||||||
|
<span className="text-xl">🎄</span>
|
||||||
|
<span className="text-sm font-medium">Happy Holidays from da ember team!</span>
|
||||||
|
<span className="text-xl">🎄</span>
|
||||||
</div>
|
</div>
|
||||||
|
)}
|
||||||
<div className="text-sm text-zinc-500">
|
<div className="text-sm text-zinc-500">
|
||||||
© {new Date().getFullYear()} Ember. All rights reserved.
|
© {new Date().getFullYear()} Ember. All rights reserved.
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -3,6 +3,39 @@ export interface Quote {
|
|||||||
author: string;
|
author: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const christmasQuotes: Quote[] = [
|
||||||
|
{ text: 'Christmas waves a magic wand over this world, and behold, everything is softer and more beautiful.', author: 'Norman Vincent Peale' },
|
||||||
|
{ text: 'The best way to spread Christmas cheer is singing loud for all to hear.', author: 'Buddy the Elf' },
|
||||||
|
{ text: 'Christmas is not a time nor a season, but a state of mind. To cherish peace and goodwill, to be plenteous in mercy, is to have the real spirit of Christmas.', author: 'Calvin Coolidge' },
|
||||||
|
{ text: 'I will honor Christmas in my heart, and try to keep it all the year.', author: 'Charles Dickens' },
|
||||||
|
{ text: 'Christmas is doing a little something extra for someone.', author: 'Charles M. Schulz' },
|
||||||
|
{ text: 'The magic of Christmas is not in the presents, but in His presence.', author: 'Anonymous' },
|
||||||
|
{ text: 'Christmas is the season of joy, of gift-giving, and of families united.', author: 'Norman Vincent Peale' },
|
||||||
|
{ text: 'Peace on earth will come to stay, when we live Christmas every day.', author: 'Helen Steiner Rice' },
|
||||||
|
{ text: 'Christmas is most truly Christmas when we celebrate it by giving the light of love to those who need it most.', author: 'Ruth Carter Stapleton' },
|
||||||
|
{ text: 'The best of all gifts around any Christmas tree: the presence of a happy family all wrapped up in each other.', author: 'Burton Hillis' },
|
||||||
|
{ text: 'Christmas is a season not only of rejoicing but of reflection.', author: 'Winston Churchill' },
|
||||||
|
{ text: 'Christmas is the day that holds all time together.', author: 'Alexander Smith' },
|
||||||
|
{ text: 'Gifts of time and love are surely the basic ingredients of a truly merry Christmas.', author: 'Peg Bracken' },
|
||||||
|
{ text: 'Christmas, my child, is love in action.', author: 'Dale Evans' },
|
||||||
|
{ text: 'Christmas is the spirit of giving without a thought of getting.', author: 'Thomas S. Monson' },
|
||||||
|
{ text: 'The joy of brightening other lives, bearing each others\' burdens, easing other\'s loads and supplanting empty hearts and lives with generous gifts becomes for us the magic of Christmas.', author: 'W. C. Jones' },
|
||||||
|
{ text: 'Christmas is a time when you get homesick - even when you\'re home.', author: 'Carol Nelson' },
|
||||||
|
{ text: 'Christmas is the season for kindling the fire of hospitality in the hall, the genial flame of charity in the heart.', author: 'Washington Irving' },
|
||||||
|
{ text: 'A lovely thing about Christmas is that it\'s compulsory, like a thunderstorm, and we all go through it together.', author: 'Garrison Keillor' },
|
||||||
|
{ text: 'Christmas is the day that holds all time together.', author: 'Alexander Smith' },
|
||||||
|
{ text: 'The best Christmas trees come very close to exceeding nature.', author: 'Andy Rooney' },
|
||||||
|
{ text: 'Christmas is not as much about opening our presents as opening our hearts.', author: 'Janice Maeditere' },
|
||||||
|
{ text: 'Christmas is doing a little something extra for someone.', author: 'Charles M. Schulz' },
|
||||||
|
{ text: 'At Christmas, all roads lead home.', author: 'Marjorie Holmes' },
|
||||||
|
{ text: 'Christmas is the season of joy, of gift-giving, and of families united.', author: 'Norman Vincent Peale' },
|
||||||
|
{ text: 'Christmas is the spirit of giving without a thought of getting.', author: 'Thomas S. Monson' },
|
||||||
|
{ text: 'May you have the gladness of Christmas which is hope; The spirit of Christmas which is peace; The heart of Christmas which is love.', author: 'Ada V. Hendricks' },
|
||||||
|
{ text: 'Christmas is a time when everybody wants his past forgotten and his present remembered.', author: 'Phyllis Diller' },
|
||||||
|
{ text: 'The best way to spread Christmas cheer is singing loud for all to hear.', author: 'Buddy the Elf' },
|
||||||
|
{ text: 'Christmas waves a magic wand over this world, and behold, everything is softer and more beautiful.', author: 'Norman Vincent Peale' },
|
||||||
|
];
|
||||||
|
|
||||||
export const businessQuotes: Quote[] = [
|
export const businessQuotes: Quote[] = [
|
||||||
{ text: 'Your work is going to fill a large part of your life, and the only way to be truly satisfied is to do what you believe is great work.', author: 'Steve Jobs' },
|
{ text: 'Your work is going to fill a large part of your life, and the only way to be truly satisfied is to do what you believe is great work.', author: 'Steve Jobs' },
|
||||||
{ text: 'Innovation distinguishes between a leader and a follower.', author: 'Steve Jobs' },
|
{ text: 'Innovation distinguishes between a leader and a follower.', author: 'Steve Jobs' },
|
||||||
@@ -110,9 +143,21 @@ export const quotes = businessQuotes;
|
|||||||
export default businessQuotes;
|
export default businessQuotes;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Returns a random business quote from the collection
|
* Check if the current date is in December
|
||||||
|
*/
|
||||||
|
function isDecember(): boolean {
|
||||||
|
const now = new Date();
|
||||||
|
return now.getMonth() === 11; // December is month 11 (0-indexed)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns a random quote - Christmas quotes during December, business quotes otherwise
|
||||||
*/
|
*/
|
||||||
export function getRandomQuote(): Quote {
|
export function getRandomQuote(): Quote {
|
||||||
|
if (isDecember()) {
|
||||||
|
const randomIndex = Math.floor(Math.random() * christmasQuotes.length);
|
||||||
|
return christmasQuotes[randomIndex];
|
||||||
|
}
|
||||||
const randomIndex = Math.floor(Math.random() * businessQuotes.length);
|
const randomIndex = Math.floor(Math.random() * businessQuotes.length);
|
||||||
return businessQuotes[randomIndex];
|
return businessQuotes[randomIndex];
|
||||||
}
|
}
|
||||||
@@ -122,7 +167,8 @@ export function getRandomQuote(): Quote {
|
|||||||
* otherwise returns a random quote from any author
|
* otherwise returns a random quote from any author
|
||||||
*/
|
*/
|
||||||
export function getRandomQuoteByAuthor(author: string): Quote {
|
export function getRandomQuoteByAuthor(author: string): Quote {
|
||||||
const authorQuotes = businessQuotes.filter(quote =>
|
const quotesToSearch = isDecember() ? christmasQuotes : businessQuotes;
|
||||||
|
const authorQuotes = quotesToSearch.filter(quote =>
|
||||||
quote.author.toLowerCase() === author.toLowerCase()
|
quote.author.toLowerCase() === author.toLowerCase()
|
||||||
);
|
);
|
||||||
if (authorQuotes.length === 0) return getRandomQuote();
|
if (authorQuotes.length === 0) return getRandomQuote();
|
||||||
@@ -134,7 +180,15 @@ export function getRandomQuoteByAuthor(author: string): Quote {
|
|||||||
* Returns quotes filtered by a theme or keyword in the text
|
* Returns quotes filtered by a theme or keyword in the text
|
||||||
*/
|
*/
|
||||||
export function getQuotesByTheme(keyword: string): Quote[] {
|
export function getQuotesByTheme(keyword: string): Quote[] {
|
||||||
return businessQuotes.filter(quote =>
|
const quotesToSearch = isDecember() ? christmasQuotes : businessQuotes;
|
||||||
|
return quotesToSearch.filter(quote =>
|
||||||
quote.text.toLowerCase().includes(keyword.toLowerCase())
|
quote.text.toLowerCase().includes(keyword.toLowerCase())
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns all available quotes (Christmas quotes in December, business quotes otherwise)
|
||||||
|
*/
|
||||||
|
export function getAllQuotes(): Quote[] {
|
||||||
|
return isDecember() ? christmasQuotes : businessQuotes;
|
||||||
|
}
|
||||||
@@ -1,4 +1,4 @@
|
|||||||
{
|
{
|
||||||
"commitHash": "48f1b97",
|
"commitHash": "e7fcfd6",
|
||||||
"buildTime": "2025-12-08T00:12:30.781Z"
|
"buildTime": "2025-12-08T01:01:03.674Z"
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user