Skip to content

Commit 7896e7f

Browse files
pettinarippettinarip
authored
Merge pull request #15741 from ethereum/lucide-next
feat: Icon updates, Lucide icon alignment
2 parents 7f9d4a4 + 6169023 commit 7896e7f

File tree

32 files changed

+164
-197
lines changed

32 files changed

+164
-197
lines changed

‎app/[locale]/developers/tutorials/_components/tutorials.tsx

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import React, {
88
useMemo,
99
useState,
1010
} from "react"
11+
import { ExternalLink } from "lucide-react"
1112
import { useLocale } from "next-intl"
1213

1314
import { ITutorial, Lang } from "@/lib/types"
@@ -198,13 +199,11 @@ const TutorialsList = ({ internalTutorials }: TutorialsListProps) => {
198199
href={tutorial.href ?? undefined}
199200
>
200201
<Flex className="mb-8 flex-col items-start justify-between gap-y-4 md:-mb-4 md:flex-row">
201-
<Text
202-
className={cn(
203-
"relative me-0 text-2xl font-semibold text-body after:ml-2 after:inline-block after:italic after:transition-all after:duration-100 after:ease-in-out after:content-['↗'] md:me-24",
204-
tutorial.isExternal ? "after:inline-block" : "after:hidden"
205-
)}
206-
>
202+
<Text className="relative me-0 text-2xl font-semibold text-body md:me-24">
207203
{tutorial.title}
204+
{tutorial.isExternal && (
205+
<ExternalLink className="mb-[0.25em] ms-[0.25em] inline-block size-[0.875em]" />
206+
)}
208207
</Text>
209208
<Tag variant="outline">
210209
<Translation id={getSkillTranslationId(tutorial.skill!)} />

‎app/[locale]/stablecoins/page.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { pick } from "lodash"
2-
import { HelpCircle } from "lucide-react"
2+
import { Info } from "lucide-react"
33
import {
44
getMessages,
55
getTranslations,
@@ -95,6 +95,7 @@ const loadData = dataLoader<[CoinGeckoCoinMarketResponse]>(
9595
async function Page({ params }: { params: Promise<{ locale: Lang }> }) {
9696
const { locale } = await params
9797
const t = await getTranslations({ locale, namespace: "page-stablecoins" })
98+
const tCommon = await getTranslations({ locale, namespace: "common" })
9899

99100
setRequestLocale(locale)
100101

@@ -249,7 +250,7 @@ async function Page({ params }: { params: Promise<{ locale: Lang }> }) {
249250

250251
const tooltipContent = (
251252
<div>
252-
{t("common:data-provided-by")}{" "}
253+
{tCommon("data-provided-by")}{" "}
253254
<InlineLink href="https://www.coingecko.com/en/api">
254255
coingecko.com
255256
</InlineLink>
@@ -556,9 +557,9 @@ async function Page({ params }: { params: Promise<{ locale: Lang }> }) {
556557
</div>
557558

558559
<h3 id="stablecoin-markets" className="mb-8 mt-12">
559-
{t("page-stablecoins-top-coins")}
560+
{t("page-stablecoins-top-coins")}&nbsp;
560561
<Tooltip content={tooltipContent}>
561-
<HelpCircle className="ms-2 fill-body text-md" />
562+
<Info className="size-4" />
562563
</Tooltip>
563564
</h3>
564565

‎app/[locale]/staking/deposit-contract/_components/deposit-contract.tsx

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client"
2-
32
import { useEffect, useState } from "react"
43
import makeBlockie from "ethereum-blockies-base64"
4+
import { Clipboard, ClipboardCheck } from "lucide-react"
55

66
import type { ChildOnlyProp, TranslationKey } from "@/lib/types"
77

@@ -375,16 +375,13 @@ const DepositContractPage = () => {
375375
<CopyButton>
376376
{!isCopied ? (
377377
<>
378-
<Emoji text=":clipboard:" className="text-md" />
379378
{t("page-staking-deposit-contract-copy")}
379+
<Clipboard className="ms-1" />
380380
</>
381381
) : (
382382
<>
383-
<Emoji
384-
text=":white_check_mark:"
385-
className="text-md"
386-
/>
387383
{t("page-staking-deposit-contract-copied")}
384+
<ClipboardCheck className="ms-1" />
388385
</>
389386
)}
390387
</CopyButton>

‎public/content/translations/fa/zero-knowledge-proofs/index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ lang: fa
108108

109109
استفاده از MACI نیازمند اعتماد به هماهنگ‌کننده مبنی بر تبانی نکردن با رشوه‌دهندگان یا تلاش برای رشوه دادن رای‌دهندگان از سوی او است. هماهنگ‌کننده می‌تواند پیام‌های کاربران را رمزگشایی کند (برای ایجاد اثبات لازم است)، بنابراین آن‌ها می‌توانند نحوۀ رای دادن هر فرد را به‌ طور دقیق تایید کنند.
110110

111-
اما در مواردی که هماهنگ‌کننده صادق است، MACI ابزاری قدرتمند برای تضمین سلامت رای‌گیری آنچین است. این امر بیان‌کنندۀ دلیل محبوبیت آن در میان برنامه‌های تامین مالی ثانویه (مانند [↗clr.fund](https://clr.fund/#/about/maci)) است که به‌شدت بر صحت آرای تک‌تک افراد متکی است.
111+
اما در مواردی که هماهنگ‌کننده صادق است، MACI ابزاری قدرتمند برای تضمین سلامت رای‌گیری آنچین است. این امر بیان‌کنندۀ دلیل محبوبیت آن در میان برنامه‌های تامین مالی ثانویه (مانند [clr.fund](https://clr.fund/#/about/maci)) است که به‌شدت بر صحت آرای تک‌تک افراد متکی است.
112112

113113
[درباره MACI بیشتر بدانید](https://privacy-scaling-explorations.github.io/maci/).
114114

‎src/components/BigNumber/index.tsx

Lines changed: 22 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -50,26 +50,29 @@ const BigNumber = async ({
5050
<div className="text-sm">
5151
{children}
5252
{sourceName && sourceUrl && (
53-
<Tooltip
54-
content={
55-
<>
56-
<p>
57-
{t("data-provided-by")}{" "}
58-
<Link href={sourceUrl}>{sourceName}</Link>
59-
</p>
60-
{lastUpdated && (
61-
<p className="mt-2">
62-
{t("last-updated")}: {lastUpdatedDisplay}
53+
<>
54+
&nbsp;
55+
<Tooltip
56+
content={
57+
<>
58+
<p>
59+
{t("data-provided-by")}{" "}
60+
<Link href={sourceUrl}>{sourceName}</Link>
6361
</p>
64-
)}
65-
</>
66-
}
67-
>
68-
<Info
69-
className="mb-0.5 ms-2 inline size-3.5 align-text-bottom"
70-
aria-label={t("data-provided-by")}
71-
/>
72-
</Tooltip>
62+
{lastUpdated && (
63+
<p className="mt-2">
64+
{t("last-updated")}: {lastUpdatedDisplay}
65+
</p>
66+
)}
67+
</>
68+
}
69+
>
70+
<Info
71+
className="mb-0.5 inline size-3.5 align-text-bottom"
72+
aria-label={t("data-provided-by")}
73+
/>
74+
</Tooltip>
75+
</>
7376
)}
7477
</div>
7578
</>

‎src/components/CardList.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
"use client"
22

3+
import { ExternalLink } from "lucide-react"
34
import TwImage, { type ImageProps } from "next/image"
45
import type { ReactNode } from "react"
56

@@ -72,7 +73,9 @@ const Card = ({
7273
<div className="mb-0 text-sm opacity-60">{caption}</div>
7374
</div>
7475
)}
75-
{isExternal && <span className={twFlipForRtl}>↗</span>}
76+
{isExternal && (
77+
<ExternalLink className={cn("size-[1em]", twFlipForRtl)} />
78+
)}
7679
</div>
7780
)
7881
}

‎src/components/CodeModal.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Children, type ReactElement } from "react"
2-
import { Check, Copy } from "lucide-react"
2+
import { Clipboard, ClipboardCheck } from "lucide-react"
33

44
import { Button } from "./ui/buttons/Button"
55
import {
@@ -43,11 +43,13 @@ const CodeModal = ({ children, isOpen, setIsOpen, title }: CodeModalProps) => {
4343
>
4444
{hasCopied ? (
4545
<>
46-
<Check /> {t("copied")}
46+
{t("copied")}
47+
<ClipboardCheck className="ms-1" />
4748
</>
4849
) : (
4950
<>
50-
<Copy /> {t("copy")}
51+
{t("copy")}
52+
<Clipboard className="ms-1" />
5153
</>
5254
)}
5355
</Button>

‎src/components/Codeblock.tsx

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
"use client"
2-
32
import React, { useState } from "react"
3+
import { Clipboard, ClipboardCheck } from "lucide-react"
44
import Highlight, {
55
defaultProps,
66
Language,
@@ -10,7 +10,6 @@ import Prism from "prism-react-renderer/prism"
1010

1111
// https://github.com/FormidableLabs/prism-react-renderer/tree/master#custom-language-support
1212
import CopyToClipboard from "@/components/CopyToClipboard"
13-
import Emoji from "@/components/Emoji"
1413
import { Flex } from "@/components/ui/flex"
1514

1615
import { cn } from "@/lib/utils/cn"
@@ -304,16 +303,13 @@ const Codeblock = ({
304303
<TopBarItem>
305304
{!isCopied ? (
306305
<>
307-
<Emoji text=":clipboard:" className="text-md" />{" "}
308306
{t("copy")}
307+
<Clipboard className="mb-1 ms-1 inline-block size-[1em]" />
309308
</>
310309
) : (
311310
<>
312-
<Emoji
313-
text=":white_check_mark:"
314-
className="text-md"
315-
/>{" "}
316311
{t("copied")}
312+
<ClipboardCheck className="mb-1 ms-1 inline-block size-[1em]" />
317313
</>
318314
)}
319315
</TopBarItem>

‎src/components/CopyToClipboard.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
"use client"
22

3-
import { CheckCircle, Copy } from "lucide-react"
3+
import { Clipboard, ClipboardCheck } from "lucide-react"
44

55
import { cn } from "@/lib/utils/cn"
66

@@ -42,9 +42,9 @@ export const CopyButton = ({ message, ...props }: CopyButtonProps) => {
4242
return (
4343
<Button variant="ghost" onClick={() => onCopy(message)} {...props}>
4444
{hasCopied ? (
45-
<CheckCircle className="size-5" />
45+
<ClipboardCheck className="size-5" />
4646
) : (
47-
<Copy className="size-5" />
47+
<Clipboard className="size-5" />
4848
)}
4949
</Button>
5050
)

‎src/components/EthPriceCard.tsx

Lines changed: 10 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client"
22

33
import { useEffect, useState } from "react"
4-
import { Info } from "lucide-react"
4+
import { ArrowUpRight, Info } from "lucide-react"
55
import { useLocale } from "next-intl"
66

77
import type { LoadingState } from "@/lib/types"
@@ -37,7 +37,7 @@ const EthPriceCard = ({
3737
const [state, setState] = useState<LoadingState<EthPriceState>>({
3838
loading: true,
3939
})
40-
const { isRtl } = useRtlFlip()
40+
const { twFlipForRtl } = useRtlFlip()
4141

4242
useEffect(() => {
4343
const fetchData = async () => {
@@ -117,9 +117,9 @@ const EthPriceCard = ({
117117
{...props}
118118
>
119119
<h4 className="m-0 flex items-center text-sm font-medium uppercase leading-xs tracking-wider">
120-
{t("eth-current-price")}
120+
{t("eth-current-price")}&nbsp;
121121
<Tooltip content={tooltipContent}>
122-
<Info className="ms-2 size-[0.875em] text-sm" />
122+
<Info className="size-[0.875em] text-sm" />
123123
</Tooltip>
124124
</h4>
125125

@@ -140,18 +140,12 @@ const EthPriceCard = ({
140140
isNegativeChange ? "text-error" : "text-success"
141141
)}
142142
>
143-
<span
144-
className={cn(
145-
isNegativeChange
146-
? "after:content-['↘']"
147-
: "after:content-['↗']",
148-
"after:inline-block",
149-
/* Cannot string-interpolate 'after:', using isRtl instead */
150-
isRtl ? "after:-scale-x-100" : ""
151-
)}
152-
>
153-
{change}
154-
</span>
143+
{change}
144+
{isNegativeChange ? (
145+
<ArrowUpRight className={cn(twFlipForRtl, "inline-block")} />
146+
) : (
147+
<ArrowUpRight className={cn(twFlipForRtl, "inline-block")} />
148+
)}
155149
</div>
156150
<div className="text-sm uppercase leading-xs tracking-wider text-body-medium">
157151
({t("last-24-hrs")})

0 commit comments

Comments
 (0)