Skip to content

Commit aab834a

Browse files
committed
change requests
1 parent 8385ea0 commit aab834a

File tree

7 files changed

+57
-56
lines changed

7 files changed

+57
-56
lines changed

app/[locale]/roadmap/_components/ReleaseCarousel.tsx

Lines changed: 13 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -14,20 +14,10 @@ import {
1414
} from "@/components/ui/carousel"
1515

1616
import { cn } from "@/lib/utils/cn"
17+
import { formatDate } from "@/lib/utils/date"
1718

1819
import { releasesData } from "@/data/roadmap/releases"
1920

20-
const formatReleaseDate = (date: string) => {
21-
if (/^\d{4}$/.test(date)) {
22-
return date
23-
}
24-
return new Date(date).toLocaleDateString("en-US", {
25-
month: "long",
26-
day: "numeric",
27-
year: "numeric",
28-
})
29-
}
30-
3121
const findLatestReleaseIndex = () => {
3222
const today = new Date()
3323
const twoMonthsFromNow = new Date()
@@ -62,7 +52,9 @@ const ReleaseCarousel = () => {
6252

6353
const [api1, setApi1] = useState<CarouselApi>()
6454
const [api2, setApi2] = useState<CarouselApi>()
65-
const [currentIndex, setCurrentIndex] = useState(findLatestReleaseIndex())
55+
const [currentIndex, setCurrentIndex] = useState(() =>
56+
findLatestReleaseIndex()
57+
)
6658

6759
useEffect(() => {
6860
if (!api1 || !api2) {
@@ -132,13 +124,15 @@ const ReleaseCarousel = () => {
132124
currentIndex !== index && "hidden"
133125
)}
134126
>
135-
<p className="text-sm font-bold">Coming soon</p>
127+
<p className="text-sm font-bold text-black">
128+
Coming soon
129+
</p>
136130
</div>
137131
)}
138132
{labelType === 3 && (
139133
<div
140134
className={cn(
141-
"w-fit rounded-lg bg-roadmap-upgrade-card-gradient-hover px-2 py-1",
135+
"w-fit rounded-lg bg-card-gradient-secondary-hover px-2 py-1",
142136
currentIndex !== index && "hidden"
143137
)}
144138
>
@@ -155,8 +149,7 @@ const ReleaseCarousel = () => {
155149
index !== 0
156150
? nextRelease
157151
? "bg-gradient-to-r from-primary to-primary-low-contrast"
158-
: release.releaseDate <
159-
new Date().toISOString().split("T")[0]
152+
: releaseDate.getTime() < todayDate.getTime()
160153
? "bg-primary"
161154
: "bg-primary-low-contrast"
162155
: "bg-transparent"
@@ -165,8 +158,7 @@ const ReleaseCarousel = () => {
165158
<div
166159
className={cn(
167160
"h-7 w-7 rounded-full",
168-
release.releaseDate <
169-
new Date().toISOString().split("T")[0]
161+
releaseDate.getTime() < todayDate.getTime()
170162
? "bg-primary"
171163
: "bg-primary-low-contrast",
172164
nextRelease &&
@@ -189,7 +181,7 @@ const ReleaseCarousel = () => {
189181
{release.releaseName}
190182
</p>
191183
<p className="font-mono text-sm text-body-medium">
192-
{formatReleaseDate(release.releaseDate)}
184+
{formatDate(release.releaseDate)}
193185
</p>
194186
</div>
195187
</div>
@@ -234,7 +226,7 @@ const ReleaseCarousel = () => {
234226
{release.releaseName}
235227
</h2>
236228
<p className="text-md">
237-
{formatReleaseDate(release.releaseDate)}
229+
{formatDate(release.releaseDate)}
238230
</p>
239231
</div>
240232

@@ -243,7 +235,7 @@ const ReleaseCarousel = () => {
243235
Main features
244236
</p>
245237
<div className="flex flex-col gap-4">
246-
{release.content.map((item) => item)}
238+
{release.content}
247239
</div>
248240
</div>
249241
<ButtonLink

app/[locale]/roadmap/_components/roadmap.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -170,7 +170,7 @@ const RoadmapPage = () => {
170170
{changesComingItems.map((item) => (
171171
<div
172172
key={item.title}
173-
className="flex h-full flex-col gap-4 rounded-3xl border bg-roadmap-card-gradient p-6"
173+
className="bg-roadmap-card-gradient flex h-full flex-col gap-4 rounded-3xl border p-6"
174174
>
175175
<div className="flex flex-row items-center justify-between gap-4">
176176
<h3 className="m-0">{item.title}</h3>
@@ -250,7 +250,7 @@ const RoadmapPage = () => {
250250
{technicalUpgradesItems.map((item) => (
251251
<LinkBox
252252
key={item.title}
253-
className="flex flex-col rounded-3xl border border-[rgba(159,43,212,0.11)] bg-roadmap-upgrade-card-gradient p-6 hover:bg-roadmap-upgrade-card-gradient-hover hover:shadow-lg"
253+
className="flex flex-col rounded-3xl border border-[rgba(159,43,212,0.11)] bg-card-gradient-secondary p-6 hover:bg-card-gradient-secondary-hover hover:shadow-lg"
254254
>
255255
<div className="mb-3 flex gap-4">
256256
{item.icon}

src/components/ui/buttons/Button.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,6 @@ const buttonVariants = cva(
4444
lg: "text-lg py-3 px-8 [&>svg]:text-2xl rounded-lg focus-visible:rounded-lg",
4545
md: "min-h-10.5 px-4 py-2 [&>svg]:text-2xl",
4646
sm: "text-xs min-h-[31px] py-1.5 px-2 [&>svg]:text-md",
47-
xs: "text-xs py-1 px-1 [&>svg]:text-md",
4847
},
4948
},
5049
defaultVariants: {

src/data/roadmap/releases.tsx

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ interface Release {
1111
image: StaticImageData
1212
releaseName: string
1313
releaseDate: string
14-
content: React.ReactNode[]
14+
content: React.ReactNode
1515
href: string
1616
}
1717

@@ -20,8 +20,8 @@ export const releasesData: Release[] = [
2020
image: DevelopersHubHeroImage,
2121
releaseName: "Paris (The Merge)",
2222
releaseDate: "2022-09-15",
23-
content: [
24-
<div key="1">
23+
content: (
24+
<div>
2525
<p className="font-bold">Transition to Proof of Stake</p>
2626
<ul>
2727
<li>Replaced energy-intensive mining with staking-based consensus</li>
@@ -39,16 +39,16 @@ export const releasesData: Release[] = [
3939
</li>
4040
<li>Ensured smooth transition to the new consensus mechanism</li>
4141
</ul>
42-
</div>,
43-
],
42+
</div>
43+
),
4444
href: "/upgrades/merge",
4545
},
4646
{
4747
image: QuizzesHubHeroImage,
4848
releaseName: "Shapella",
4949
releaseDate: "2023-04-12",
50-
content: [
51-
<div key="1">
50+
content: (
51+
<div>
5252
<p className="font-bold">Staking withdrawals</p>
5353
<ul>
5454
<li>Enabled validators to withdraw their staked ETH and rewards</li>
@@ -66,16 +66,16 @@ export const releasesData: Release[] = [
6666
<li>Reduced gas costs for accessing the COINBASE address</li>
6767
<li>Improved efficiency of certain smart contract operations</li>
6868
</ul>
69-
</div>,
70-
],
69+
</div>
70+
),
7171
href: "/staking/withdrawals",
7272
},
7373
{
7474
image: Layer2HubHeroImage,
7575
releaseName: "Dencun",
7676
releaseDate: "2024-03-13",
77-
content: [
78-
<div key="1">
77+
content: (
78+
<div>
7979
<p className="font-bold">Proto-danksharding (EIP-4844)</p>
8080
<ul>
8181
<li>
@@ -104,16 +104,16 @@ export const releasesData: Release[] = [
104104
Enables new trust-minimized applications and cross-chain bridges
105105
</li>
106106
</ul>
107-
</div>,
108-
],
107+
</div>
108+
),
109109
href: "/roadmap/dencun",
110110
},
111111
{
112112
image: PectraImage,
113113
releaseName: "Pectra",
114114
releaseDate: "2025-05-07",
115-
content: [
116-
<div key="1">
115+
content: (
116+
<div>
117117
<p className="font-bold">EOA account code</p>
118118
<ul>
119119
<li>
@@ -135,16 +135,16 @@ export const releasesData: Release[] = [
135135
of 9, resulting in cheaper fees in Ethereum rollups
136136
</li>
137137
</ul>
138-
</div>,
139-
],
138+
</div>
139+
),
140140
href: "/roadmap/pectra",
141141
},
142142
{
143143
image: CommunityHeroImage,
144144
releaseName: "Fusaka",
145145
releaseDate: "2026",
146-
content: [
147-
<div key="1">
146+
content: (
147+
<div>
148148
<p className="font-bold">
149149
PeerDAS (Peer-to-Peer Data Availability Sampling)
150150
</p>
@@ -173,22 +173,22 @@ export const releasesData: Release[] = [
173173
Further improvements to validator efficiency and network performance
174174
</li>
175175
</ul>
176-
</div>,
177-
],
176+
</div>
177+
),
178178
href: "/roadmap/fusaka",
179179
},
180180
{
181181
image: GuidesHubHeroImage,
182182
releaseName: "Glamsterdam",
183183
releaseDate: "2026",
184-
content: [
185-
<div key="1">
184+
content: (
185+
<div>
186186
<p className="font-bold">Discussed for Glamsterdam</p>
187187
<ul>
188188
<li>Verkle trees</li>
189189
</ul>
190-
</div>,
191-
],
190+
</div>
191+
),
192192
href: "https://eips.ethereum.org/EIPS/eip-7773",
193193
},
194194
]

src/lib/utils/date.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,14 @@ export const isValidDate = (dateString?: string | number): boolean => {
66
const date = new Date(dateString)
77
return !isNaN(date.getTime())
88
}
9+
10+
export const formatDate = (date: string) => {
11+
if (/^\d{4}$/.test(date)) {
12+
return date
13+
}
14+
return new Date(date).toLocaleDateString("en-US", {
15+
month: "long",
16+
day: "numeric",
17+
year: "numeric",
18+
})
19+
}

src/styles/semantic-tokens.css

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -85,9 +85,9 @@
8585
#000000 69.77%
8686
);
8787

88-
--roadmap-card-gradient: linear-gradient(123deg, rgba(255, 255, 255, 0.20) 58.99%, rgba(174, 110, 203, 0.13) 104.04%);
89-
--roadmap-upgrade-card-gradient: linear-gradient(95deg, rgba(211, 145, 242, 0.12) 0%, rgba(159, 43, 212, 0.12) 102.78%);
90-
--roadmap-upgrade-card-gradient-hover: linear-gradient(95deg, rgba(211, 145, 242, 0.2) 0%, rgba(159, 43, 212, 0.2) 102.78%);
88+
--card-gradient: linear-gradient(123deg, rgba(255, 255, 255, 0.20) 58.99%, rgba(174, 110, 203, 0.13) 104.04%);
89+
--card-gradient-secondary: linear-gradient(95deg, rgba(211, 145, 242, 0.12) 0%, rgba(159, 43, 212, 0.12) 102.78%);
90+
--card-gradient-secondary-hover: linear-gradient(95deg, rgba(211, 145, 242, 0.2) 0%, rgba(159, 43, 212, 0.2) 102.78%);
9191

9292
/* Shadows */
9393
--shadow-color-a: hsla(var(--purple-800), 0.02);

tailwind.config.ts

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -231,10 +231,9 @@ const config = {
231231
"radial-a": "var(--radial-a)",
232232
"linear-bug-bounty-title": "var(--linear-bug-bounty-title)",
233233
"gradient-staking": "var(--gradient-staking)",
234-
"roadmap-card-gradient": "var(--roadmap-card-gradient)",
235-
"roadmap-upgrade-card-gradient": "var(--roadmap-upgrade-card-gradient)",
236-
"roadmap-upgrade-card-gradient-hover":
237-
"var(--roadmap-upgrade-card-gradient-hover)",
234+
"card-gradient": "var(--card-gradient)",
235+
"card-gradient-secondary": "var(--card-gradient-secondary)",
236+
"card-gradient-secondary-hover": "var(--card-gradient-secondary-hover)",
238237
},
239238
boxShadow: {
240239
"table-box": "var(--table-box-shadow)",

0 commit comments

Comments
 (0)