diff --git a/apps/website/src/app/build/page.tsx b/apps/website/src/app/build/page.tsx
index 4bfab242c..e6a3b8720 100644
--- a/apps/website/src/app/build/page.tsx
+++ b/apps/website/src/app/build/page.tsx
@@ -59,7 +59,7 @@ export default function Build() {
]
return (
-
+
Let’s build something new
@@ -81,9 +81,9 @@ export default function Build() {
+
diff --git a/apps/website/src/app/learn/page.tsx b/apps/website/src/app/learn/page.tsx
index 096403e64..c7be25858 100644
--- a/apps/website/src/app/learn/page.tsx
+++ b/apps/website/src/app/learn/page.tsx
@@ -74,6 +74,20 @@ export default function Learn() {
title: "Zero-knowledge",
body: "If the statement is true, no verifier learns anything other than the fact that the statement is true."
}
+ ],
+ [
+ {
+ title: "Privacy",
+ body: "Zero-knowledge property enables hiding any personal information while still enabling to building convincing proofs."
+ },
+ {
+ title: "Scalability",
+ body: "Multiple proofs can be aggregated into a single one, enabling smaller machines to verify 100s of transactions or claims in one go."
+ },
+ {
+ title: "Interoperability",
+ body: "ZKPs enable porting trust from one “realm” to another, for example between web2<>web3 worlds."
+ }
]
]
@@ -221,9 +235,9 @@ await verifyProof(verificationKey, fullProof)`,
@@ -232,22 +246,31 @@ await verifyProof(verificationKey, fullProof)`,
-
-
- Characteristics
-
-
-
+
+
+
+ Characteristics
+
+
+
+
+
+ Main use cases
+
+
+
+
)
return (
-
+
-
+
diff --git a/apps/website/src/app/page.tsx b/apps/website/src/app/page.tsx
index a22c574c7..3ac187125 100644
--- a/apps/website/src/app/page.tsx
+++ b/apps/website/src/app/page.tsx
@@ -1,4 +1,5 @@
import { Box, Button, Card, CardBody, HStack, Heading, Image, Link, Stack, Text, VStack } from "@chakra-ui/react"
+import NextLink from "next/link"
import { Sora } from "next/font/google"
import Carousel from "../components/Carousel"
import ProjectCard from "../components/ProjectCard"
@@ -12,10 +13,11 @@ const sora = Sora({
export default function Home() {
return (
-
-
+ <>
+
))}
+
+
+
+ View more
+
+
-
-
-
- Semaphore Features
-
+
+
+
+
+ Semaphore Features
+
-
-
-
-
- 1
-
-
-
- Simplified privacy
-
-
- Semaphore streamlines privacy-centric app development. It empowers developers to
- effortlessly incorporate robust privacy features.
-
-
-
-
-
- 3
-
-
-
- Universal integrations
-
-
- Semaphore is a protocol for Web2 and Web3. It integrates into any front-end
- framework or pure HTML/CSS/JS. It is cross-chain compatible with EVM, L2s, and
- alt-blockchains.
-
-
-
-
-
-
-
- 2
-
-
-
- Leverage Zero Knowledge
-
-
- Semaphore leverages Zero Knowledge, allowing us to verify information without
- revealing any underlying data. This powerful primitive allows one to prove
- membership and signal anonymously.
-
-
-
-
-
- 4
-
-
-
- Free open source software
-
-
- Semaphore is a Public Good. This means it will never seek to profit, it is owned
- by the community and will always remain open source.
-
-
-
-
-
-
-
+
+
+
+
+ 1
+
+
+
+ Simplified privacy
+
+
+ Semaphore streamlines privacy-centric app development. It empowers
+ developers to effortlessly incorporate robust privacy features.
+
+
+
+
+
+ 3
+
+
+
+ Universal integrations
+
+
+ Semaphore is a protocol for Web2 and Web3. It integrates into any front-end
+ framework or pure HTML/CSS/JS. It is cross-chain compatible with EVM, L2s,
+ and alt-blockchains.
+
+
+
+
+
+
+
+ 2
+
+
+
+ Leverage Zero Knowledge
+
+
+ Semaphore leverages Zero Knowledge, allowing us to verify information
+ without revealing any underlying data. This powerful primitive allows one to
+ prove membership and signal anonymously.
+
+
+
+
+
+ 4
+
+
+
+ Free open source software
+
+
+ Semaphore is a Public Good. This means it will never seek to profit, it is
+ owned by the community and will always remain open source.
+
+
+
+
+
+
+
+
-
+ >
)
}
diff --git a/apps/website/src/app/projects/page.tsx b/apps/website/src/app/projects/page.tsx
index 7bcc67101..fee2c3697 100644
--- a/apps/website/src/app/projects/page.tsx
+++ b/apps/website/src/app/projects/page.tsx
@@ -4,17 +4,11 @@ import ProjectsList from "../../components/ProjectsList"
export default function Projects() {
return (
-
-
+ <>
+
-
+ >
)
}
diff --git a/apps/website/src/components/Carousel.tsx b/apps/website/src/components/Carousel.tsx
index 4e96ef153..9667f0d44 100644
--- a/apps/website/src/components/Carousel.tsx
+++ b/apps/website/src/components/Carousel.tsx
@@ -47,10 +47,8 @@ export default function Carousel({ title, sizes, type, ...props }: CarouselProps
return (
-
-
- {title}
-
+
+ {title}
{type !== "projects" && (
@@ -128,7 +126,7 @@ export default function Carousel({ title, sizes, type, ...props }: CarouselProps
-
+
Projects created by
- }
variant={onlyPSE === true ? "solid" : "outline"}
+ colorScheme={onlyPSE === true ? "primary" : "white"}
onClick={() => setOnlyPSE(onlyPSE === true ? null : true)}
+ cursor="pointer"
+ px="18px"
+ py="13px"
>
- PSE
-
-
+ PSE
+
+ }
variant={onlyPSE === false ? "solid" : "outline"}
+ colorScheme={onlyPSE === false ? "primary" : "white"}
onClick={() => setOnlyPSE(onlyPSE === false ? null : false)}
+ cursor="pointer"
+ px="18px"
+ py="13px"
>
- Community
-
+
+ Community
+
@@ -79,10 +87,11 @@ export default function ProjectsList(props: any) {
Category
{getProjectCategories(sortedProjects).map((category) => (
-
+
))}
diff --git a/apps/website/src/components/SectionBlock.tsx b/apps/website/src/components/SectionBlock.tsx
index 09218f074..57c81129c 100644
--- a/apps/website/src/components/SectionBlock.tsx
+++ b/apps/website/src/components/SectionBlock.tsx
@@ -32,9 +32,9 @@ export default function SectionBlock({ title, description, linkText, linkUrl, co
diff --git a/apps/website/src/styles/components/Tag.ts b/apps/website/src/styles/components/Tag.ts
index 2cf7db284..fe1221f6b 100644
--- a/apps/website/src/styles/components/Tag.ts
+++ b/apps/website/src/styles/components/Tag.ts
@@ -4,7 +4,8 @@ const Tag = {
baseStyle: {
container: {
borderRadius: "100px",
- padding: "5px 16px 5px 16px"
+ padding: "5px 16px 5px 16px",
+ borderWidth: "1px"
}
},
defaultProps: {
@@ -22,7 +23,8 @@ const Tag = {
return {
container: {
bg,
- color
+ color,
+ borderColor: bg
}
}
}
@@ -32,7 +34,8 @@ const Tag = {
return {
container: {
bg,
- color: `darkBlue`
+ color: `darkBlue`,
+ borderColor: bg
}
}
},
@@ -42,7 +45,7 @@ const Tag = {
return {
container: {
color: c,
- shadow: `inset 0 0 0px 1px ${c}`
+ borderColor: c
}
}
}