Skip to content

Commit 1d72730

Browse files
MM25ZamanianMM25Zamanian
committed
c
1 parent b0e1447 commit 1d72730

18 files changed

Lines changed: 982 additions & 136 deletions

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,12 @@
33
"version": "0.1.0",
44
"private": true,
55
"scripts": {
6-
"dev": "next dev --webpack",
6+
"dev": "rm -rf .next && next dev --webpack",
77
"build": "next build --webpack",
88
"build:static": "next build --webpack",
99
"build:en": "BUILD_LOCALE=en next build --webpack",
1010
"build:tr": "BUILD_LOCALE=tr next build --webpack",
11+
"typecheck": "tsc --noEmit",
1112
"generate:world-map": "node scripts/generate-world-map.mjs",
1213
"start": "next start",
1314
"lint": "eslint"

‎public/iran-map.webp‎

-25 KB
Binary file not shown.

‎public/monochrome-freight-train-on-tracks.webp‎

169 KB
Loading

‎public/services-rail-perspective-bg.webp‎

73.5 KB
Loading

‎src/app/globals.css‎

Lines changed: 52 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,72 @@
1111
--font-sans: var(--font-roboto);
1212
--font-mono: var(--font-roboto);
1313

14-
--animate-traffic-lights-pulse: traffic-lights-pulse 3s
15-
var(--tw-animation-delay) ease both infinite;
14+
--animate-traffic-lights-pulse: traffic-lights-pulse 3s var(--tw-animation-delay) ease both infinite;
1615

1716
@keyframes traffic-lights-pulse {
17+
1818
0%,
1919
66%,
2020
100% {
2121
opacity: 0%;
2222
}
23+
2324
33% {
2425
opacity: 100%;
2526
}
2627
}
2728
}
2829

30+
@import "tailwindcss";
31+
32+
@theme {
33+
--animate-map-gold-shine: map-gold-shine 2s linear infinite;
34+
35+
@keyframes map-gold-shine {
36+
0% {
37+
transform: translateX(-120%) skewX(-14deg);
38+
opacity: 0;
39+
}
40+
41+
4% {
42+
opacity: 0.9;
43+
}
44+
45+
25% {
46+
opacity: 0.9;
47+
}
48+
49+
30%,
50+
100% {
51+
transform: translateX(260%) skewX(-14deg);
52+
opacity: 0;
53+
}
54+
}
55+
}
56+
57+
@utility map-mask {
58+
mask-repeat: no-repeat;
59+
mask-size: contain;
60+
mask-position: center;
61+
-webkit-mask-repeat: no-repeat;
62+
-webkit-mask-size: contain;
63+
-webkit-mask-position: center;
64+
}
65+
66+
@utility map-gold-shine {
67+
background: linear-gradient(105deg,
68+
transparent 0%,
69+
rgba(255, 218, 140, 0) 22%,
70+
rgba(255, 218, 140, 0.35) 42%,
71+
rgba(255, 244, 210, 0.95) 50%,
72+
rgba(255, 201, 96, 0.35) 58%,
73+
transparent 78%);
74+
}
75+
2976
html,
3077
body {
3178
background: var(--color-primary);
79+
transition: background-color 500ms ease-in-out;
3280
}
3381

3482
:root {
@@ -53,6 +101,7 @@ body {
53101
opacity: 0;
54102
transform: translateY(24px);
55103
}
104+
56105
to {
57106
opacity: 1;
58107
transform: translateY(0);
@@ -72,4 +121,4 @@ body {
72121
.world-map-route-reduced {
73122
display: initial;
74123
}
75-
}
124+
}

‎src/app/page.tsx‎

Lines changed: 15 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
import { getDictionary } from "@/i18n";
22
import { WorldMap } from "@/components/world-map";
3-
import { FirstSlide } from "@/slides/01-first";
4-
import { SecondSlide } from "@/slides/02-second";
5-
import { ThirdSlide } from "@/slides/03-third";
3+
import { Slide01 } from "@/slides/01-slide";
4+
import { Slide02 } from "@/slides/02-slide";
5+
import { Slide03 } from "@/slides/03-slide";
6+
import { Slide04 } from "@/slides/04-slide";
7+
import { Slide05 } from "@/slides/05-slide";
8+
import { Slide06 } from "@/slides/06-slide";
9+
import { Slide07 } from "@/slides/07-slide";
610
import { ScrollBackgroundManager } from "@/components/scroll-bg-manager";
7-
import { FourthSlide } from "@/slides/04-fourth";
811

912
export default function Home() {
1013
const dictionary = getDictionary();
@@ -13,12 +16,15 @@ export default function Home() {
1316
<main className="snap-y snap-mandatory flex flex-col h-[100svh] overflow-y-auto overscroll-none scroll-smooth">
1417
<ScrollBackgroundManager />
1518

16-
<FirstSlide copy={dictionary.firstSlide} brand={dictionary.brand}>
19+
<Slide01 copy={dictionary.slide01} brand={dictionary.brand}>
1720
<WorldMap className="bg-transparent absolute top-0 inset-x-0" />
18-
</FirstSlide>
19-
<SecondSlide copy={dictionary.secondSlide} />
20-
<ThirdSlide copy={dictionary.thirdSlide} brand={dictionary.brand} />
21-
<FourthSlide />
21+
</Slide01>
22+
<Slide02 copy={dictionary.slide02} brand={dictionary.brand} />
23+
<Slide03 copy={dictionary.slide03} brand={dictionary.brand} />
24+
<Slide04 copy={dictionary.slide04} />
25+
<Slide05 copy={dictionary.slide05} />
26+
<Slide06 copy={dictionary.slide06} />
27+
<Slide07 copy={dictionary.slide07} />
2228
</main>
2329
);
2430
}

‎src/components/icons.tsx‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,14 @@ import PhoneIconBase from "~icons/material-symbols-light/call-outline.jsx";
88
import DeskphoneIconBase from "~icons/material-symbols-light/phone-in-talk-outline.jsx";
99
import InstagramIconBase from "~icons/mynaui/instagram.jsx";
1010
import GlobeIconBase from "~icons/material-symbols-light/language.jsx";
11+
import AwardIconBase from "~icons/material-symbols-light/military-tech-outline.jsx";
12+
import UsersIconBase from "~icons/material-symbols-light/groups-outline.jsx";
13+
import InventoryIconBase from "~icons/material-symbols-light/inventory-2-outline.jsx";
14+
import ShieldIconBase from "~icons/material-symbols-light/shield-outline.jsx";
15+
import WarehouseIconBase from "~icons/material-symbols-light/warehouse-outline.jsx";
16+
import DescriptionIconBase from "~icons/material-symbols-light/description-outline.jsx";
17+
import FactCheckIconBase from "~icons/material-symbols-light/fact-check-outline.jsx";
18+
import PackageIconBase from "~icons/material-symbols-light/package-2-outline.jsx";
1119

1220
type IconProps = ComponentProps<"svg">;
1321

@@ -46,3 +54,35 @@ export function InstagramIcon(props: IconProps) {
4654
export function GlobeIcon(props: IconProps) {
4755
return <GlobeIconBase aria-hidden="true" {...props} />;
4856
}
57+
58+
export function AwardIcon(props: IconProps) {
59+
return <AwardIconBase aria-hidden="true" {...props} />;
60+
}
61+
62+
export function UsersIcon(props: IconProps) {
63+
return <UsersIconBase aria-hidden="true" {...props} />;
64+
}
65+
66+
export function InventoryIcon(props: IconProps) {
67+
return <InventoryIconBase aria-hidden="true" {...props} />;
68+
}
69+
70+
export function ShieldIcon(props: IconProps) {
71+
return <ShieldIconBase aria-hidden="true" {...props} />;
72+
}
73+
74+
export function WarehouseIcon(props: IconProps) {
75+
return <WarehouseIconBase aria-hidden="true" {...props} />;
76+
}
77+
78+
export function DescriptionIcon(props: IconProps) {
79+
return <DescriptionIconBase aria-hidden="true" {...props} />;
80+
}
81+
82+
export function FactCheckIcon(props: IconProps) {
83+
return <FactCheckIconBase aria-hidden="true" {...props} />;
84+
}
85+
86+
export function PackageIcon(props: IconProps) {
87+
return <PackageIconBase aria-hidden="true" {...props} />;
88+
}

‎src/components/scroll-bg-manager.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,12 @@ import { useEffect, useLayoutEffect, useMemo, useState } from "react";
44

55
const BACKGROUND_COLORS: Record<number, string> = {
66
0: "#03162a",
7-
1: "#03162a",
7+
1: "#f8f8f8",
88
2: "#f8f8f8",
9-
3: "#f8f8f8",
9+
3: "#03162a",
10+
4: "#03162a",
11+
5: "#f8f8f8",
12+
6: "#03162a",
1013
};
1114

1215
export function ScrollBackgroundManager() {

0 commit comments

Comments
 (0)