-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
132 additions
and
129 deletions.
There are no files selected for viewing
130 changes: 130 additions & 0 deletions
130
ssg/src/components/page/solutions/mpc-wallet/Header.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,130 @@ | ||
import React from "react" | ||
import Translate, { translate } from "@docusaurus/Translate" | ||
import SectionTitle from "../../../common/SectionTitle" | ||
import clsx from "clsx" | ||
|
||
const Item = ({ | ||
cover, | ||
background, | ||
title, | ||
description, | ||
className, | ||
coverClassName, | ||
}: { | ||
cover: string | ||
background: string | ||
title: string | ||
description: string | ||
className?: string | ||
coverClassName?: string | ||
}) => { | ||
return ( | ||
<div | ||
className={clsx( | ||
"relative flex flex-col gap-y-5 overflow-hidden bg-[#F2F2F2] px-5 pb-5 pt-10", | ||
"sm:pl-15 sm:pt-12.5 sm:pb-6.5 sm:h-124.25 sm:justify-between sm:pr-10", | ||
"md:h-88 md:px-10 md:py-5", | ||
"lg:h-110 lg:pb-6.5 lg:p-10", | ||
className, | ||
)} | ||
> | ||
<img | ||
src={ | ||
require("@site/static/img/page/solutions/mpc-wallet/" + background) | ||
.default | ||
} | ||
className="fill op-0 sm:op-100" | ||
/> | ||
<img | ||
src={ | ||
require("@site/static/img/page/solutions/mpc-wallet/" + cover).default | ||
} | ||
width={1098} | ||
height={678} | ||
className={clsx( | ||
"z-1 w-full object-contain sm:order-last sm:self-end", | ||
"sm:w-94", | ||
"md:w-68.75 md:absolute md:bottom-3 md:right-3", | ||
"lg:w-94 lg:bottom-6.5 lg:right-10", | ||
coverClassName, | ||
)} | ||
/> | ||
<div className="z-1"> | ||
<div className="text-5.5 sm:text-8">{title}</div> | ||
<div className="mt-3 leading-[1.625]">{description}</div> | ||
</div> | ||
</div> | ||
) | ||
} | ||
|
||
export const Header = () => ( | ||
<> | ||
<SectionTitle | ||
description={translate({ | ||
message: | ||
"Using MPC technology for wallets offers several advantages, including eliminating the need to trust third parties, enhanced data privacy, increased accuracy, the removal of single points of failure, increased difficulty for hackers, and reduced reliance on cold storage.", | ||
})} | ||
> | ||
<Translate>What are the benefits of MPC wallets?</Translate> | ||
</SectionTitle> | ||
<div className="grid gap-5 px-5 md:grid-cols-2 "> | ||
<Item | ||
cover="1.1.webp" | ||
background="1.6.webp" | ||
title={translate({ message: "Eliminate third-party trust" })} | ||
description={translate({ | ||
message: | ||
"Data can be shared in a distributed manner without any third parties", | ||
})} | ||
/> | ||
|
||
<Item | ||
cover="1.2.webp" | ||
background="1.7.webp" | ||
title={translate({ message: "Increased data privacy" })} | ||
description={translate({ | ||
message: | ||
"Data is encrypted at rest and in transit so no private information is revealed or compromised", | ||
})} | ||
/> | ||
|
||
<Item | ||
cover="1.3.webp" | ||
background="1.8.webp" | ||
title={translate({ message: "Reduced reliance on cold storage" })} | ||
description={translate({ | ||
message: | ||
"Users can only hold their assets online and no longer need cold-storage devices", | ||
})} | ||
className={clsx( | ||
"!sm:h-160", | ||
"!md:h-88 md:gap-x-18 md:col-span-full md:flex-row", | ||
"!lg:h-110 lg:gap-x-25", | ||
)} | ||
coverClassName={clsx( | ||
"!md:w-90 !md:static !md:self-center", | ||
"!lg:w-122", | ||
)} | ||
/> | ||
|
||
<Item | ||
cover="1.4.webp" | ||
background="1.9.webp" | ||
title={translate({ message: "Removal of SPOF" })} | ||
description={translate({ | ||
message: "Private keys are not stored in one single place", | ||
})} | ||
/> | ||
|
||
<Item | ||
cover="1.5.webp" | ||
background="1.10.webp" | ||
title={translate({ message: "Increased hacking difficulty" })} | ||
description={translate({ | ||
message: | ||
"A hacker would need to attack multiple parties across systems and locations", | ||
})} | ||
/> | ||
</div> | ||
</> | ||
) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters