Skip to content

Commit fccb715

Browse files
authored
Merge pull request #331 from MUFTIATBAKARE/feat/add-breadcrumbs-to-deep-pages
Feat/add breadcrumbs to deep pages
2 parents afa2e1d + 6578e13 commit fccb715

74 files changed

Lines changed: 860 additions & 651 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

client/index.html

Lines changed: 36 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,38 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6-
<link rel="apple-touch-icon" href="/vite.svg">
7-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8-
<meta name="theme-color" content="#ffffff" />
9-
<title>Tikka App</title>
10-
<meta name="description" content="Tikka Application" />
11-
<meta name="apple-mobile-web-app-capable" content="yes" />
12-
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
13-
<script>
14-
// Polyfill for 'global' - required by some Node.js packages in browser
15-
if (typeof global === 'undefined') {
16-
var global = globalThis;
17-
}
18-
</script>
19-
</head>
20-
<body>
21-
<div id="root"></div>
22-
<div id="modal-root"></div>
23-
<script type="module" src="/src/main.tsx"></script>
24-
</body>
25-
</html>
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
7+
<link rel="apple-touch-icon" href="/vite.svg">
8+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
9+
<meta name="theme-color" content="#ffffff" />
10+
<title>Tikka App</title>
11+
<meta name="description" content="Tikka Application" />
12+
<meta name="apple-mobile-web-app-capable" content="yes" />
13+
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
14+
<script>
15+
// Apply dark class immediately to avoid flash of wrong theme
16+
document.documentElement.classList.toggle(
17+
"dark",
18+
localStorage.theme === "dark" ||
19+
(!("theme" in localStorage) &&
20+
window.matchMedia("(prefers-color-scheme: dark)").matches)
21+
);
22+
</script>
23+
24+
<script>
25+
// Polyfill for 'global' - required by some Node.js packages in browser
26+
if (typeof global === 'undefined') {
27+
var global = globalThis;
28+
}
29+
</script>
30+
</head>
31+
32+
<body>
33+
<div id="root"></div>
34+
<div id="modal-root"></div>
35+
<script type="module" src="/src/main.tsx"></script>
36+
</body>
37+
38+
</html>

client/src/components/AboutRaffle.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const AboutRaffle = () => {
2323
<div className="bg-[#9D4EDD33] flex items-center space-x-4 p-4 w-full rounded-xl">
2424
<Users color="#9D4EDD" size={20} />
2525
<div>
26-
<p className="text-[#9CA3AF] text-[12px]">
26+
<p className="text-gray-600 dark:text-[#9CA3AF] text-[12px]">
2727
Participants
2828
</p>
2929
<p className="font-semibold">2,458 / 5,000</p>
@@ -33,7 +33,7 @@ const AboutRaffle = () => {
3333
<div className="bg-[#9D4EDD33] flex items-center space-x-4 p-4 w-full rounded-xl">
3434
<Ticket color="#9D4EDD" size={20} />
3535
<div>
36-
<p className="text-[#9CA3AF] text-[12px]">
36+
<p className="text-gray-600 dark:text-[#9CA3AF] text-[12px]">
3737
Tickets Sold
3838
</p>
3939
<p className="font-semibold">14,782</p>

client/src/components/AdminLogin.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@ const AdminLogin = ({ onLogin }: AdminLoginProps) => {
1515
};
1616

1717
return (
18-
<div className="flex min-h-screen items-center justify-center bg-[#0D0A1E]">
19-
<div className="w-full max-w-sm rounded-xl border border-[#2A264A] bg-[#15102A] p-8">
20-
<h1 className="mb-6 text-center text-2xl font-bold text-white">
18+
<div className="flex min-h-screen items-center justify-center bg-gray-50 dark:bg-[#0D0A1E]">
19+
<div className="w-full max-w-sm rounded-xl border border-gray-300 dark:border-[#2A264A] bg-white dark:bg-[#15102A] p-8">
20+
<h1 className="mb-6 text-center text-2xl font-bold text-gray-900 dark:text-white">
2121
Oracle Admin Dashboard
2222
</h1>
2323
<form onSubmit={handleSubmit} className="flex flex-col gap-4">
@@ -31,13 +31,13 @@ const AdminLogin = ({ onLogin }: AdminLoginProps) => {
3131
value={token}
3232
onChange={(e) => setToken(e.target.value)}
3333
placeholder="Enter admin token"
34-
className="rounded-lg border border-[#2A264A] bg-[#0D0A1E] px-4 py-2 text-white placeholder-gray-600 outline-none focus:border-[#5B4FCF] focus:ring-1 focus:ring-[#5B4FCF]"
34+
className="rounded-lg border border-gray-300 dark:border-[#2A264A] bg-gray-50 dark:bg-[#0D0A1E] px-4 py-2 text-gray-900 dark:text-white placeholder-gray-600 outline-none focus:border-[#5B4FCF] focus:ring-1 focus:ring-[#5B4FCF]"
3535
/>
3636
</div>
3737
<button
3838
type="submit"
3939
disabled={!token.trim()}
40-
className="rounded-lg bg-[#5B4FCF] px-4 py-2 text-sm font-semibold text-white transition-colors hover:bg-[#6B5FDF] disabled:cursor-not-allowed disabled:opacity-50"
40+
className="rounded-lg bg-[#5B4FCF] px-4 py-2 text-sm font-semibold text-gray-900 dark:text-white transition-colors hover:bg-[#6B5FDF] disabled:cursor-not-allowed disabled:opacity-50"
4141
>
4242
Sign In
4343
</button>

client/src/components/CreateRaffleButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ const CreateRaffleButton = ({
4747
imageFile,
4848
onSuccess,
4949
onError,
50-
className = "bg-[#FF389C] hover:bg-[#FF389C]/90 text-white px-6 py-3 rounded-lg font-medium transition-colors duration-200",
50+
className = "bg-[#FF389C] hover:bg-[#FF389C]/90 text-gray-900 dark:text-white px-6 py-3 rounded-lg font-medium transition-colors duration-200",
5151
children = "Publish Raffle",
5252
}: CreateRaffleButtonProps) => {
5353
const { isConnected, isWrongNetwork, connect, switchNetwork } =

client/src/components/EnterRaffle.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,13 @@ interface EnterRaffleProps {
66

77
const EnterRaffle = ({ handleEnterRaffle }: EnterRaffleProps) => {
88
return (
9-
<div className="bg-[#11172E] border border-[#1F263F] rounded-[30px] w-full px-4 py-5 md:px-6 md:py-6 flex flex-col space-y-3">
9+
<div className="bg-white dark:bg-[#11172E] border border-gray-200 dark:border-[#1F263F] rounded-[30px] w-full px-4 py-5 md:px-6 md:py-6 flex flex-col space-y-3">
1010
{/* Header */}
1111
<div className="flex items-center justify-between">
1212
<p className="text-[20px] md:text-[22px] font-semibold">
1313
Enter Raffle
1414
</p>
15-
<span className="bg-[#00E6CC33] px-3 py-1 text-[#00E6CC] text-[12px] rounded-full whitespace-nowrap">
15+
<span className="bg-[#00E6CC33] px-3 py-1 text-teal-600 dark:text-[#00E6CC] text-[12px] rounded-full whitespace-nowrap">
1616
Max 100 per entry
1717
</span>
1818
</div>
@@ -23,18 +23,18 @@ const EnterRaffle = ({ handleEnterRaffle }: EnterRaffleProps) => {
2323
<div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
2424
{/* Price block */}
2525
<div className="min-w-0">
26-
<p className="text-xs text-[#9CA3AF]">Price per ticket</p>
26+
<p className="text-xs text-gray-600 dark:text-[#9CA3AF]">Price per ticket</p>
2727
<p className="text-[20px] md:text-[22px] font-medium">
2828
0.05 ETH
2929
</p>
30-
<p className="text-xs text-[#9CA3AF]">≈ $85.45 USD</p>
30+
<p className="text-xs text-gray-600 dark:text-[#9CA3AF]">≈ $85.45 USD</p>
3131
</div>
3232

3333
{/* Quantity controls - centered on mobile */}
3434
<div className="flex items-center justify-start sm:justify-end gap-3">
3535
<button
3636
aria-label="decrease"
37-
className="h-9 w-9 rounded-lg bg-[#00E6CC33] text-[#00E6CC] text-[18px] flex items-center justify-center hover:brightness-95"
37+
className="h-9 w-9 rounded-lg bg-[#00E6CC33] text-teal-600 dark:text-[#00E6CC] text-[18px] flex items-center justify-center hover:brightness-95"
3838
>
3939
4040
</button>
@@ -45,7 +45,7 @@ const EnterRaffle = ({ handleEnterRaffle }: EnterRaffleProps) => {
4545

4646
<button
4747
aria-label="increase"
48-
className="h-9 w-9 rounded-lg bg-[#00E6CC33] text-[#00E6CC] text-[18px] flex items-center justify-center hover:brightness-95"
48+
className="h-9 w-9 rounded-lg bg-[#00E6CC33] text-teal-600 dark:text-[#00E6CC] text-[18px] flex items-center justify-center hover:brightness-95"
4949
>
5050
+
5151
</button>
@@ -56,7 +56,7 @@ const EnterRaffle = ({ handleEnterRaffle }: EnterRaffleProps) => {
5656

5757
{/* Total */}
5858
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2">
59-
<p className="text-xs text-[#9CA3AF]">Total</p>
59+
<p className="text-xs text-gray-600 dark:text-[#9CA3AF]">Total</p>
6060
<p className="text-[14px] md:text-[14px] font-semibold">
6161
0.05 ETH
6262
</p>
@@ -66,7 +66,7 @@ const EnterRaffle = ({ handleEnterRaffle }: EnterRaffleProps) => {
6666
<div className="w-full">
6767
<button
6868
onClick={handleEnterRaffle}
69-
className="w-full md:w-auto block px-8 py-3 md:px-10 md:py-4 rounded-xl text-white font-medium transition"
69+
className="w-full md:w-auto block px-8 py-3 md:px-10 md:py-4 rounded-xl text-gray-900 dark:text-white font-medium transition"
7070
style={{
7171
background:
7272
"linear-gradient(100.92deg, #A259FF 13.57%, #FF6250 97.65%)",

client/src/components/EnterRaffleButton.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const EnterRaffleButton = ({
1616
ticketPrice,
1717
onSuccess,
1818
onError,
19-
className = "border border-[#fe3796] px-8 py-4 rounded-xl hover:bg-[#fe3796]/10 transition",
19+
className = "border border-pink-500 dark:border-[#fe3796] px-8 py-4 rounded-xl hover:bg-[#fe3796]/10 transition",
2020
children = "Enter Raffle",
2121
}: EnterRaffleButtonProps) => {
2222
const { isConnected, isWrongNetwork, connect, switchNetwork } = useWalletContext();
@@ -68,7 +68,7 @@ const EnterRaffleButton = ({
6868
onClick={handleButtonClick}
6969
disabled={isLoading}
7070
className={`${className} ${isLoading ? "opacity-50 cursor-not-allowed" : ""
71-
} ${(!isConnected || isWrongNetwork) && !isLoading ? "!bg-indigo-600 !text-white !border-indigo-600 hover:!bg-indigo-700" : ""}`}
71+
} ${(!isConnected || isWrongNetwork) && !isLoading ? "!bg-indigo-600 !text-gray-900 dark:text-white !border-indigo-600 hover:!bg-indigo-700" : ""}`}
7272
>
7373
{getButtonText()}
7474
</button>

client/src/components/InstallPWA.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ export function InstallPWA() {
8181
Later
8282
</button>
8383
<button
84-
className="px-4 py-2 bg-green-500 text-white text-sm font-medium rounded-lg shadow-sm hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 dark:focus:ring-offset-zinc-800 transition-colors"
84+
className="px-4 py-2 bg-green-500 text-gray-900 dark:text-white text-sm font-medium rounded-lg shadow-sm hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 dark:focus:ring-offset-zinc-800 transition-colors"
8585
onClick={onClick}
8686
>
8787
Install App

0 commit comments

Comments
 (0)