Skip to content

Commit 1ba00c0

Browse files
kemurukemuru
committed
chore: implement feedback
1 parent 76fbcc2 commit 1ba00c0

File tree

9 files changed

+100
-130
lines changed

9 files changed

+100
-130
lines changed

‎frontend/src/components/BrandAssets/KlerosBadgesSection.tsx‎

Lines changed: 12 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -10,22 +10,18 @@ const KlerosBadgesSection: React.FC<IKlerosBadgesSection> = ({
1010
klerosBadgesData,
1111
}) => {
1212
return (
13-
<div className="relative bg-background-1 px-6 pb-12 pt-32">
14-
<div className="space-y-6">
15-
<h1 className="w-min text-3xl">{klerosBadgesData.header}</h1>
16-
<p className="text-lg text-secondary-text">
17-
{klerosBadgesData.subtitle}
18-
</p>
19-
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
20-
{klerosBadgesData.imageDownloads.map((imageDownload) => {
21-
return (
22-
<ImageDownload
23-
key={imageDownload.image.url}
24-
{...{ imageDownload }}
25-
/>
26-
);
27-
})}
28-
</div>
13+
<div className="relative space-y-6 bg-background-1 px-6 pb-12 pt-32">
14+
<h1 className="w-min text-3xl">{klerosBadgesData.header}</h1>
15+
<p className="text-lg text-secondary-text">{klerosBadgesData.subtitle}</p>
16+
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
17+
{klerosBadgesData.imageDownloads.map((imageDownload) => {
18+
return (
19+
<ImageDownload
20+
key={imageDownload.image.url}
21+
{...{ imageDownload }}
22+
/>
23+
);
24+
})}
2925
</div>
3026
</div>
3127
);

‎frontend/src/components/BrandAssets/KlerosColorsSection/ColorCard.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ interface IColorCard {
88
const ColorCard: React.FC<IColorCard> = ({ name, hexColor }) => {
99
return (
1010
<div
11-
className="flex h-[200px] w-[380px] flex-col items-center justify-center gap-3 rounded-lg shadow-md"
11+
className="flex h-[200px] w-[380px] flex-col items-center justify-center gap-3 rounded-2xl shadow-md"
1212
style={{ backgroundColor: hexColor }}
1313
>
1414
<span className="text-lg text-white">{name}</span>

‎frontend/src/components/BrandAssets/KlerosColorsSection/index.tsx‎

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -10,21 +10,17 @@ const KlerosColorsSection: React.FC<IKlerosColorsSection> = ({
1010
klerosColorsData,
1111
}) => {
1212
return (
13-
<div className="relative bg-background-1 px-6 pb-12 pt-32">
14-
<div className="space-y-6">
15-
<h1 className="w-min text-3xl">{klerosColorsData.header}</h1>
16-
<p className="text-lg text-secondary-text">
17-
{klerosColorsData.subtitle}
18-
</p>
19-
<div className="flex flex-row flex-wrap justify-center gap-8">
20-
{klerosColorsData?.colorCards?.map((colorCard) => (
21-
<ColorCard
22-
key={colorCard.name}
23-
name={colorCard.name}
24-
hexColor={colorCard.hexColor}
25-
/>
26-
))}
27-
</div>
13+
<div className="relative space-y-6 bg-background-2 px-6 pb-12 pt-32">
14+
<h1 className="w-min text-3xl">{klerosColorsData.header}</h1>
15+
<p className="text-lg text-secondary-text">{klerosColorsData.subtitle}</p>
16+
<div className="flex flex-row flex-wrap justify-center gap-8">
17+
{klerosColorsData?.colorCards?.map((colorCard) => (
18+
<ColorCard
19+
key={colorCard.name}
20+
name={colorCard.name}
21+
hexColor={colorCard.hexColor}
22+
/>
23+
))}
2824
</div>
2925
</div>
3026
);

‎frontend/src/components/BrandAssets/KlerosFontsSection.tsx‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,14 @@ const KlerosFontsSection: React.FC<IKlerosFontsSection> = ({
1010
klerosFontsData,
1111
}) => {
1212
return (
13-
<div className="relative bg-background-1 px-6 pb-12 pt-32">
14-
<div className="space-y-6">
15-
<h1 className="w-min text-3xl">{klerosFontsData.header}</h1>
16-
<CtaCard
17-
key={klerosFontsData.linkCard.title}
18-
title={klerosFontsData.linkCard.title}
19-
description={klerosFontsData.linkCard.subtitle}
20-
arrowLink={klerosFontsData.linkCard.link}
21-
/>
22-
</div>
13+
<div className="relative space-y-6 bg-background-1 px-6 pb-12 pt-32">
14+
<h1 className="w-min text-3xl">{klerosFontsData.header}</h1>
15+
<CtaCard
16+
key={klerosFontsData.linkCard.title}
17+
title={klerosFontsData.linkCard.title}
18+
description={klerosFontsData.linkCard.subtitle}
19+
arrowLink={klerosFontsData.linkCard.link}
20+
/>
2321
</div>
2422
);
2523
};

‎frontend/src/components/BrandAssets/KlerosLogoSection.tsx‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,14 @@ const KlerosLogoSection: React.FC<IKlerosLogoSection> = ({
1010
klerosLogoData,
1111
}) => {
1212
return (
13-
<div className="relative bg-background-1 px-6 pb-12 pt-32">
14-
<div className="space-y-6">
15-
<h1 className="w-min text-3xl">{klerosLogoData.header}</h1>
16-
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
17-
{klerosLogoData.imageDownloads.map((imageDownload) => {
18-
return (
19-
<ImageDownload key={imageDownload.name} {...{ imageDownload }} />
20-
);
21-
})}
22-
</div>
13+
<div className="relative space-y-6 bg-background-1 px-6 pb-12 pt-32">
14+
<h1 className="w-min text-3xl">{klerosLogoData.header}</h1>
15+
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
16+
{klerosLogoData.imageDownloads.map((imageDownload) => {
17+
return (
18+
<ImageDownload key={imageDownload.name} {...{ imageDownload }} />
19+
);
20+
})}
2321
</div>
2422
</div>
2523
);

‎frontend/src/components/BrandAssets/LogosPackageSection.tsx‎

Lines changed: 20 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -13,31 +13,27 @@ const LogosPackageSection: React.FC<ILogosPackageSection> = ({
1313
logosPackageData,
1414
}) => {
1515
return (
16-
<div className="relative bg-background-2 px-6 pb-12 pt-32">
17-
<div className="space-y-6">
18-
<h1 className="w-min text-3xl">{logosPackageData.header}</h1>
19-
<p className="text-lg text-secondary-text">
20-
{logosPackageData.subtitle}
21-
</p>
22-
<div>
23-
<Link
24-
href={logosPackageData.button?.link?.url}
25-
target="_blank"
26-
rel="noopener noreferrer"
27-
>
28-
<Button variant="primary">
29-
<span className="text-background-2">
30-
{logosPackageData.button?.text}
31-
</span>
32-
</Button>
33-
</Link>
34-
</div>
35-
<ExternalLink
36-
url={logosPackageData.arrowLink.link.url}
37-
text={logosPackageData.arrowLink.text}
38-
className="z-[1] flex-wrap"
39-
/>
16+
<div className="relative space-y-6 bg-background-2 px-6 pb-12 pt-32">
17+
<h1 className="w-min text-3xl">{logosPackageData.header}</h1>
18+
<p className="text-lg text-secondary-text">{logosPackageData.subtitle}</p>
19+
<div>
20+
<Link
21+
href={logosPackageData.button?.link?.url}
22+
target="_blank"
23+
rel="noopener noreferrer"
24+
>
25+
<Button variant="primary">
26+
<span className="text-background-2">
27+
{logosPackageData.button?.text}
28+
</span>
29+
</Button>
30+
</Link>
4031
</div>
32+
<ExternalLink
33+
url={logosPackageData.arrowLink.link.url}
34+
text={logosPackageData.arrowLink.text}
35+
className="z-[1] flex-wrap"
36+
/>
4137
</div>
4238
);
4339
};

‎frontend/src/components/BrandAssets/PnkTokenSection.tsx‎

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,17 +8,13 @@ interface IPnkTokenSection {
88

99
const PnkTokenSection: React.FC<IPnkTokenSection> = ({ pnkTokenData }) => {
1010
return (
11-
<div className="relative bg-background-1 px-6 pb-12 pt-32">
12-
<div className="space-y-6">
13-
<h1 className="w-min text-3xl">{pnkTokenData.header}</h1>
14-
<p className="text-lg text-secondary-text">{pnkTokenData.subtitle}</p>
15-
<div className="flex flex-row flex-wrap gap-x-8 gap-y-16">
16-
<ImageDownload
17-
key={pnkTokenData.imageDownload.name}
18-
{...{ imageDownload: pnkTokenData.imageDownload }}
19-
/>
20-
</div>
21-
</div>
11+
<div className="relative space-y-6 bg-background-1 px-6 pb-12 pt-32">
12+
<h1 className="w-min text-3xl">{pnkTokenData.header}</h1>
13+
<p className="text-lg text-secondary-text">{pnkTokenData.subtitle}</p>
14+
<ImageDownload
15+
key={pnkTokenData.imageDownload.name}
16+
{...{ imageDownload: pnkTokenData.imageDownload }}
17+
/>
2218
</div>
2319
);
2420
};

‎frontend/src/components/BrandAssets/StyledImagesSection.tsx‎

Lines changed: 25 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -10,38 +10,31 @@ const StyledImagesSection: React.FC<IStyledImagesSection> = ({
1010
styledImagesData,
1111
}) => {
1212
return (
13-
<div className="relative bg-background-2 px-6 pb-12 pt-32">
14-
<div className="space-y-6">
15-
<h1 className="w-min text-3xl">{styledImagesData.header}</h1>
16-
<h1 className="w-min text-2xl">{styledImagesData.wallpapersHeader}</h1>
17-
<p className="text-lg text-secondary-text">
18-
{styledImagesData.wallpapersSubtitle}
19-
</p>
20-
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
21-
{styledImagesData.wallpapersImageDownloads.map((imageDownload) => {
22-
return (
23-
<ImageDownload key={imageDownload.name} {...{ imageDownload }} />
24-
);
25-
})}
26-
</div>
27-
<h2 className="w-min text-2xl">
28-
{styledImagesData.productMockupsHeader}
29-
</h2>
30-
<p className="text-lg text-secondary-text">
31-
{styledImagesData.productMockupsSubtitle}
32-
</p>
33-
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
34-
{styledImagesData.productMockupsImageDownloads.map(
35-
(imageDownload) => {
36-
return (
37-
<ImageDownload
38-
key={imageDownload.name}
39-
{...{ imageDownload }}
40-
/>
41-
);
42-
},
43-
)}
44-
</div>
13+
<div className="relative space-y-6 bg-background-2 px-6 pb-12 pt-32">
14+
<h1 className="w-min text-3xl">{styledImagesData.header}</h1>
15+
<h1 className="w-min text-2xl">{styledImagesData.wallpapersHeader}</h1>
16+
<p className="text-lg text-secondary-text">
17+
{styledImagesData.wallpapersSubtitle}
18+
</p>
19+
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
20+
{styledImagesData.wallpapersImageDownloads.map((imageDownload) => {
21+
return (
22+
<ImageDownload key={imageDownload.name} {...{ imageDownload }} />
23+
);
24+
})}
25+
</div>
26+
<h2 className="w-min text-2xl">
27+
{styledImagesData.productMockupsHeader}
28+
</h2>
29+
<p className="text-lg text-secondary-text">
30+
{styledImagesData.productMockupsSubtitle}
31+
</p>
32+
<div className="flex flex-row flex-wrap justify-center gap-x-8 gap-y-16">
33+
{styledImagesData.productMockupsImageDownloads.map((imageDownload) => {
34+
return (
35+
<ImageDownload key={imageDownload.name} {...{ imageDownload }} />
36+
);
37+
})}
4538
</div>
4639
</div>
4740
);

‎frontend/src/components/DownloadButton.tsx‎

Lines changed: 8 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,6 @@ import Image from "next/image";
77

88
import DownloadIcon from "@/assets/svgs/icons/download.svg";
99

10-
const baseStyle = clsx("px-4 py-1 rounded transition duration-75");
11-
12-
const primaryStyle = clsx(
13-
baseStyle,
14-
"bg-primary-blue",
15-
"hover:bg-primary-blue/90",
16-
"disabled:bg-stroke",
17-
"text-background-2",
18-
);
19-
2010
interface IDownloadButton {
2111
name: string;
2212
url: string;
@@ -47,7 +37,14 @@ const DownloadButton: React.FC<IDownloadButton> = ({ name, url }) => {
4737
return (
4838
<button
4939
onClick={handleDownload}
50-
className={clsx(primaryStyle, "flex flex-row gap-2")}
40+
className={clsx(
41+
"rounded px-4 py-1 transition duration-75",
42+
"bg-primary-blue",
43+
"hover:bg-primary-blue/90",
44+
"disabled:bg-stroke",
45+
"text-background-2",
46+
"flex flex-row gap-2",
47+
)}
5148
>
5249
{name}
5350
<Image src={DownloadIcon} alt={name} width="14" height="14" />

0 commit comments

Comments
 (0)