Skip to content

Commit dcf0f78

Browse files
theAwmintheAwmin
committed
fix footer bug
1 parent 03a2c20 commit dcf0f78

5 files changed

Lines changed: 265 additions & 233 deletions

File tree

‎src/app/[lang]/levels/citizen/[levelName]/[tabs]/layout.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,8 @@ export default async function CitizensLayout({
5050
);
5151

5252
return (
53-
<main className="flex dark:bg-black !w-full" dir={langData.direction}>
53+
<div className="flex w-full h-screen overflow-hidden">
54+
<main className="flex dark:bg-black !w-full h-screen light-scrollbar dark:dark-scrollbar" dir={langData.direction}>
5455
<SideBar
5556
pageSide="level"
5657
langArray={langArray}
@@ -67,6 +68,7 @@ export default async function CitizensLayout({
6768
{children}
6869
</div>
6970
</main>
71+
</div>
7072
);
7173
} catch (error) {
7274
const serializedError = {

‎src/app/[lang]/levels/citizen/[levelName]/[tabs]/page.jsx‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const Gem = dynamic(() => import('@/components/module/levelComponent/Gem'));
2323
const Gift = dynamic(() => import('@/components/module/levelComponent/Gift'));
2424
const Permission = dynamic(() => import('@/components/module/levelComponent/Permissions'));
2525
const Prize = dynamic(() => import('@/components/module/levelComponent/Prize'));
26-
const DynamicFooter = dynamic(() => import('@/components/module/footer/DynamicFooter'));
26+
const Footer = dynamic(() => import('@/components/module/footer/Footer'));
2727
const BreadCrumb = dynamic(() => import('@/components/shared/BreadCrumb'));
2828
const ImageBox = dynamic(() => import('@/components/module/levelComponent/ImageBox'));
2929
import { Features } from "@/components/module/levelComponent/Features";
@@ -283,9 +283,12 @@ export default async function LevelSinglePage({ params }) {
283283
<Features mainData={mainData} params={resolvedParams} />
284284
</div>
285285

286-
<div className="flex flex-col justify-center items-center xl:px-32 lg:px-32 md:px-5 sm:px-5 xs:px-1">
287-
<DynamicFooter footerTabs={footerTabs} mainData={mainData} params={resolvedParams} />
288-
</div>
286+
<div className="xl:px-32 lg:px-32 md:px-5 sm:px-5 xs:px-1 mt-10">
287+
<Footer
288+
mainData={mainData}
289+
params={resolvedParams}
290+
/>
291+
</div>
289292
</>
290293
);
291294
} catch (error) {

‎src/app/[lang]/levels/citizen/page.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import {
1010
getLangArray,
1111
} from "@/components/utils/actions";
1212

13-
import DynamicFooter from "@/components/module/footer/DynamicFooter";
13+
import Footer from "@/components/module/footer/Footer";
1414
import LevelsClient from "@/components/module/levelComponent/LevelsClient";
1515
import BreadCrumb from "@/components/shared/BreadCrumb";
1616
import { getStaticMenu } from "@/components/utils/constants";
@@ -271,7 +271,7 @@ staticData.forEach((el2: any) => {
271271

272272

273273
<div className="xl:px-32 lg:px-32 md:px-5 sm:px-5 xs:px-1 mt-10">
274-
<DynamicFooter
274+
<Footer
275275
mainData={mainData}
276276
params={resolvedParams}
277277
/>

‎src/components/module/footer/Footer.tsx‎

Lines changed: 234 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,234 @@
1+
"use client";
2+
3+
import Link from "next/link";
4+
import { findByUniqueId } from "@/components/utils/findByUniqueId";
5+
import Image from "next/image";
6+
interface FooterProps {
7+
params: { lang: string };
8+
mainData: any;
9+
}
10+
11+
interface FooterLink {
12+
label: string;
13+
href: string;
14+
targetBlank?: boolean;
15+
disabled?: boolean;
16+
}
17+
18+
export default function Footer2({ params, mainData }: FooterProps) {
19+
const isRTL = params.lang === "fa";
20+
const footerLinks: { title: string; links: FooterLink[] }[] = [
21+
{
22+
title: findByUniqueId(mainData, 1737),
23+
links: [
24+
{ label: findByUniqueId(mainData, 303), href: `/${params.lang}/` },
25+
{ label: findByUniqueId(mainData, 259), href: `/${params.lang}/about/` },
26+
{
27+
label: findByUniqueId(mainData, 1738),
28+
href: "https://github.com/iranpsc",
29+
targetBlank: true,
30+
},
31+
{ label: findByUniqueId(mainData, 1739), href: `/${params.lang}/citizens` },
32+
{
33+
label: findByUniqueId(mainData, 1740),
34+
href: `/${params.lang}/version`
35+
},
36+
],
37+
},
38+
{
39+
title: findByUniqueId(mainData, 1741),
40+
links: [
41+
{ label: findByUniqueId(mainData, 1742), href: "/build", disabled: true, },
42+
{ label: findByUniqueId(mainData, 1743), href: `/${params.lang}/whitepaper` },
43+
{
44+
label: findByUniqueId(mainData, 1744),
45+
href: "/sdk",
46+
disabled: true,
47+
},
48+
{ label: findByUniqueId(mainData, 1490), href: `/${params.lang}/rand-id/hm` },
49+
],
50+
},
51+
{
52+
title: findByUniqueId(mainData, 1745),
53+
links: [
54+
{ label: findByUniqueId(mainData, 1746), href: `/${params.lang}/articles` },
55+
{ label: findByUniqueId(mainData, 1462), href: `/${params.lang}/education` },
56+
{
57+
label: findByUniqueId(mainData, 1747),
58+
href: "http://faqhub.ir/",
59+
targetBlank: true,
60+
},
61+
{ label: findByUniqueId(mainData, 1748), href: `/${params.lang}/calendar` },
62+
],
63+
},
64+
{
65+
title: findByUniqueId(mainData, 1749),
66+
links: [
67+
{ label: findByUniqueId(mainData, 279), href: "https://www.instagram.com/metaverse_rang" },
68+
{ label: findByUniqueId(mainData, 280), href: "https://www.linkedin.com/company/metaverse-rang/" },
69+
{ label: findByUniqueId(mainData, 281), href: "https://youtube.com/@metargb?si=gdM0aFPk5SCsC7z4" },
70+
{ label: findByUniqueId(mainData, 1753), href: "https://substack.com/@metarang" },
71+
{ label: findByUniqueId(mainData, 1754), href: "https://medium.com/@metarang.iran" },
72+
],
73+
},
74+
];
75+
76+
return (
77+
<footer className="bg-white dark:bg-[#1A1A18] rounded-[40px] rounded-se-[120px] 2xl:rounded-se-[260px] mt-10">
78+
<div className="overflow-hidden ">
79+
<div className="p-5 xl:p-5 2xl:p-9 3xl:p-14 3xl:px-[76px] 3xl:px mt-5">
80+
<div className="grid gap-10 gap-y-12 md:grid-cols-[80px_repeat(4,1fr)]">
81+
82+
{/* Logo */}
83+
<div className="flex items-center lg:items-start justify-center lg:justify-start px-5 lg:px-0 lg:flex-col gap-5">
84+
<Image
85+
src="/logo.png"
86+
alt="logo"
87+
width={71}
88+
height={70}
89+
className="w-[60px] h-[60px] inline "
90+
/>
91+
<div className="flex items-center justify-center ">
92+
<div
93+
dangerouslySetInnerHTML={{
94+
__html: `<a referrerpolicy='origin' target='_blank' href='https://trustseal.enamad.ir/?id=721065&Code=fLkLFNhooBCR33C1ntVXIBxJFAj9gf3q'><img referrerpolicy='origin' src='https://trustseal.enamad.ir/logo.aspx?id=721065&Code=fLkLFNhooBCR33C1ntVXIBxJFAj9gf3q' alt='' style='cursor:pointer' code='fLkLFNhooBCR33C1ntVXIBxJFAj9gf3q'></a>`,
95+
}}
96+
/>
97+
</div>
98+
</div>
99+
100+
{/* Links */}
101+
{footerLinks.map((section) => (
102+
<div key={section.title}>
103+
<p className="mb-5 2xl:mb-12 lg:mt-3 text-3xl 3xl:text-4xl font-medium text-[#1B1B1B] dark:text-[#FFFFFF]">
104+
{section.title}
105+
</p>
106+
107+
<ul className="space-y-2 2xl:space-y-5 list-none">
108+
{section.links.map((item) => {
109+
const isExternal =
110+
item.targetBlank || item.href.startsWith("http");
111+
112+
const baseClass =
113+
"peer flex items-center dark:text-[#9A9A9A] gap-2 3xl:text-3xl transition";
114+
115+
const isDisabled = item.disabled;
116+
117+
const linkClass = isDisabled
118+
? "text-[#aaa] pointer-events-none opacity-50"
119+
: "text-[#222]";
120+
121+
return (
122+
<li key={item.href}>
123+
{isDisabled ? (
124+
<span className={`${baseClass} ${linkClass}`}>
125+
{item.label}
126+
<span className="text-[#ccc] !text-4xl ms-1">›</span>
127+
</span>
128+
) : (
129+
<Link
130+
href={item.href}
131+
className={`${baseClass} ${linkClass}`}
132+
{...(isExternal
133+
? {
134+
target: "_blank",
135+
rel: "noopener noreferrer",
136+
}
137+
: {})}
138+
>
139+
{item.label}
140+
141+
{/* arrow فقط برای فعال‌ها */}
142+
<span className="text-[#8A2BE2] ms-1 !text-4xl transition-transform peer-hover:translate-x-1 rtl:peer-hover:translate-x-[-4px]">
143+
›
144+
</span>
145+
</Link>
146+
)}
147+
</li>
148+
);
149+
})}
150+
</ul>
151+
</div>
152+
))}
153+
</div>
154+
</div>
155+
156+
{/* MARQUEE */}
157+
<div className="relative mt-10 mb-7 h-[450px] flex items-center overflow-hidden ">
158+
<div className={`marquee ${isRTL ? "rtl" : "ltr"}`}>
159+
<div className="track">
160+
<div className="group">
161+
<span className="text-neutral-900 dark:text-white">{findByUniqueId(mainData, 148)}</span>
162+
</div>
163+
<div className="group">
164+
<span className="text-neutral-900 dark:text-white">{findByUniqueId(mainData, 148)}</span>
165+
</div>
166+
<div className="group">
167+
<span className="text-neutral-900 dark:text-white">{findByUniqueId(mainData, 148)}</span>
168+
</div>
169+
<div className="group">
170+
<span className="text-neutral-900 dark:text-white">{findByUniqueId(mainData, 148)}</span>
171+
</div>
172+
</div>
173+
</div>
174+
</div>
175+
</div>
176+
177+
{/* Styles */}
178+
<style jsx>{`
179+
.marquee {
180+
overflow: hidden;
181+
width: 100%;
182+
}
183+
184+
/* base track */
185+
.track {
186+
display: flex;
187+
width: max-content;
188+
}
189+
190+
/* LTR animation (default) */
191+
.ltr .track {
192+
animation: scroll-ltr 18s linear infinite;
193+
}
194+
195+
/* RTL animation */
196+
.rtl .track {
197+
animation: scroll-rtl 10s linear infinite;
198+
}
199+
200+
.group {
201+
display: flex;
202+
flex-shrink: 0;
203+
}
204+
205+
.group span {
206+
font-size: 400px;
207+
font-weight: 700;
208+
white-space: nowrap;
209+
padding-right: 80px;
210+
}
211+
212+
/* LTR → چپ به راست */
213+
@keyframes scroll-ltr {
214+
0% {
215+
transform: translateX(0);
216+
}
217+
100% {
218+
transform: translateX(-50%);
219+
}
220+
}
221+
222+
/* RTL → راست به چپ (برعکس) */
223+
@keyframes scroll-rtl {
224+
0% {
225+
transform: translateX(0);
226+
}
227+
100% {
228+
transform: translateX(50%);
229+
}
230+
}
231+
`}</style>
232+
</footer>
233+
);
234+
}

0 commit comments

Comments
 (0)