diff --git a/package.json b/package.json
index 634200c8..c5a1b153 100644
--- a/package.json
+++ b/package.json
@@ -46,6 +46,7 @@
"react-mailchimp-subscribe": "^2.1.3",
"react-router-dom": "^5.3.0",
"react-scripts": "4.0.3",
+ "react-youtube": "^10.1.0",
"svgson": "^5.2.1",
"typescript": "^4.4.3",
"web-vitals": "^1.0.1"
diff --git a/src/content/components/announcement-banner.md b/src/content/components/announcement-banner.md
index fd2a24f1..82cc9a75 100644
--- a/src/content/components/announcement-banner.md
+++ b/src/content/components/announcement-banner.md
@@ -2,4 +2,4 @@
template: announcement
title: Announcement
---
-Maximize your BTC in DeFi by minting tBTC! Learn More
\ No newline at end of file
+Maximize your BTC in DeFi by minting tBTC! Learn More
diff --git a/src/content/pages/index.md b/src/content/pages/index.md
index 32055ac6..9817e72d 100644
--- a/src/content/pages/index.md
+++ b/src/content/pages/index.md
@@ -11,9 +11,33 @@ hero:
- label: Pre Launch NFT
url: https://galxe.com/Threshold/campaign/GCBKCUwT8Q
image: /images/tbtc-dashboard.png
+whatIsThreshold:
+ title: What is Threshold?
+ description:
+ Threshold provides a suite of threshold cryptography products that
+ power user sovereignty on the public blockchain.
+ youtubeID: 8MzE_FG67Z8
+ buttons:
+ - label: Subscribe
+ url: https://www.youtube.com/@Threshold.Network
+ variant: EXTERNAL_OUTLINE
+tbtc:
+ rowReverse: false
+ title: Bridge BTC to Ethereum
+ description: tBTC is Threshold’s decentralized bridge to bring BTC to the
+ Ethereum network.
+ image: /images/tbtc-illustration.png
+ buttons:
+ - label: Stay Updated
+ url: https://twitter.com/TheTNetwork
+ variant: EXTERNAL_SOLID
+ - label: Learn More
+ url: /tbtc
+ variant: INTERNAL_OUTLINE
stakerRole:
title: Threshold Staking
- description: Stakers escrow T tokens to run a node on the Threshold Network and
+ description:
+ Stakers escrow T tokens to run a node on the Threshold Network and
earn rewards.
image: /images/staking-threshold.png
buttons:
@@ -89,7 +113,8 @@ harnessThePower:
threshold cryptographic services without a central authority.
image: /images/decentralized-icon.png
- title: Secure
- description: Splitting cryptographic operations across nodes increases security
+ description:
+ Splitting cryptographic operations across nodes increases security
and availability and reduces trust assumptions. Threshold is
[audited](/about#audits) by the best firms in the space.
image: /images/secure-icon.png
@@ -113,7 +138,8 @@ joinTheCommunity:
left:
- label: Get involved
title: Become a part of our community
- description: Join our Discord server and our Telegram to get involved and stay
+ description:
+ Join our Discord server and our Telegram to get involved and stay
up to date.
buttons:
- label: Discord
@@ -133,7 +159,8 @@ joinTheCommunity:
right:
- label: For Developers
title: Learn more about the network
- description: Learn more about the Threshold network by reading the documentation
+ description:
+ Learn more about the Threshold network by reading the documentation
or visiting Github.
buttons:
- label: GitHub
diff --git a/src/templates/home-page/WhaIsThreshold/index.tsx b/src/templates/home-page/WhaIsThreshold/index.tsx
new file mode 100644
index 00000000..5bf92006
--- /dev/null
+++ b/src/templates/home-page/WhaIsThreshold/index.tsx
@@ -0,0 +1,72 @@
+import React, { FC } from "react"
+import Youtube from "react-youtube"
+import {
+ PageSection,
+ ResponsiveStack,
+ SectionTextContainer,
+} from "../../../components/PageSection"
+import { BodyLg, H5 } from "../../../components"
+import { BoxProps, Stack } from "@chakra-ui/react"
+import useChakraBreakpoint from "../../../hooks/useChakraBreakpoint"
+import { FooterButton } from "../SectionTemplate"
+import {
+ ButtonType,
+ CmsButtonLink,
+} from "../../../components/Buttons/CmsButtonLink"
+
+export interface WhatIsThresholdProps extends BoxProps {
+ bgColor: string
+ title: string
+ description: string
+ youtubeID: string
+ buttons: FooterButton[]
+}
+
+const WhatIsThreshold: FC = ({
+ title,
+ description,
+ youtubeID,
+ buttons,
+ ...props
+}) => {
+ const isMobile = useChakraBreakpoint("md")
+ const youtubeStyles = isMobile
+ ? {
+ margin: "20px auto",
+ }
+ : {}
+
+ return (
+
+
+
+ {title}
+
+ {description}
+
+
+ {buttons.map((_: FooterButton, i) => (
+
+ {_.label}
+
+ ))}
+
+
+
+
+
+ )
+}
+
+export default WhatIsThreshold
diff --git a/src/templates/home-page/index.tsx b/src/templates/home-page/index.tsx
index 86ee2ced..1630bd8b 100644
--- a/src/templates/home-page/index.tsx
+++ b/src/templates/home-page/index.tsx
@@ -7,10 +7,12 @@ import MigrationInfoSection from "./MigrationInfoSection"
import HarnessThePower from "./HarnessThePower"
import JoinTheCommunity from "./JoinTheCommunity"
import ActiveCommunity from "./ActiveCommunity"
+import WhatIsThreshold from "./WhaIsThreshold"
const SplashPageTemplate: FC = ({ data }) => {
const {
hero,
+ whatIsThreshold,
stakerRole,
lpRole,
btcRole,
@@ -22,13 +24,13 @@ const SplashPageTemplate: FC = ({ data }) => {
} = data.markdownRemark.frontmatter
const proposals = data.allProposals
-
return (
<>
+
+
-
@@ -62,6 +64,16 @@ export const query = graphql`
}
}
}
+ whatIsThreshold {
+ title
+ description
+ youtubeID
+ buttons {
+ label
+ url
+ variant
+ }
+ }
stakerRole {
rowReverse
title
diff --git a/static/admin/config.yml b/static/admin/config.yml
index be2e3326..4ed89333 100644
--- a/static/admin/config.yml
+++ b/static/admin/config.yml
@@ -77,6 +77,66 @@ collections:
{ label: URL, name: url, widget: string },
],
}
+ - label: "What is Threshold"
+ name: "whatIsThreshold"
+ widget: "object"
+ collapsed: true
+ fields:
+ - {
+ label: "Title",
+ name: "title",
+ widget: "string",
+ minimal: true,
+ }
+ - {
+ label: "Description",
+ name: "description",
+ widget: "string",
+ required: false,
+ }
+ - {
+ label: "Youtube ID",
+ name: "youtubeID",
+ widget: "string",
+ required: true,
+ }
+ - {
+ label: "Buttons",
+ name: "buttons",
+ widget: "list",
+ allow_add: true,
+ required: false,
+ fields:
+ [
+ { label: Label, name: label, widget: string },
+ { label: URL, name: url, widget: string },
+ {
+ label: Variant,
+ name: variant,
+ widget: select,
+ required: true,
+ options:
+ [
+ {
+ label: "External Solid",
+ value: "EXTERNAL_SOLID",
+ },
+ {
+ label: "Internal Solid",
+ value: "INTERNAL_SOLID",
+ },
+ {
+ label: "External Outline",
+ value: "EXTERNAL_OUTLINE",
+ },
+ {
+ label: "Internal Outline",
+ value: "INTERNAL_OUTLINE",
+ },
+ ],
+ },
+ ],
+ }
- label: "Staker Role"
name: "stakerRole"
widget: "object"
diff --git a/static/images/tbtc-illustration.png b/static/images/tbtc-illustration.png
new file mode 100644
index 00000000..0829345b
Binary files /dev/null and b/static/images/tbtc-illustration.png differ
diff --git a/yarn.lock b/yarn.lock
index 925d71b7..9eba7189 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8631,7 +8631,7 @@ date-fns@^2.25.0:
resolved "https://registry.npmjs.org/date-fns/-/date-fns-2.28.0.tgz#9570d656f5fc13143e50c975a3b6bbeb46cd08b2"
integrity sha512-8d35hViGYx/QH0icHYCeLmsLmMUheMmTyV9Fcm6gvNwdw31yXXH+O85sOBJ+OLnLQMKZowvpKb6FgMIQjcpvQw==
-debug@2, debug@2.6.9, debug@^2.1.3, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, debug@^2.6.9:
+debug@2, debug@2.6.9, debug@^2.1.3, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, debug@^2.6.6, debug@^2.6.9:
version "2.6.9"
resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==
@@ -10178,7 +10178,7 @@ extract-files@9.0.0, extract-files@^9.0.0:
resolved "https://registry.npmjs.org/extract-files/-/extract-files-9.0.0.tgz#8a7744f2437f81f5ed3250ed9f1550de902fe54a"
integrity sha512-CvdFfHkC95B4bBBk36hcEmvdR2awOdhhVUYH6S/zrVj3477zven/fJMYg7121h4T1xHZC+tetUpubpAhxwI7hQ==
-fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
+fast-deep-equal@3.1.3, fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
version "3.1.3"
resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
@@ -14041,6 +14041,11 @@ load-bmfont@^1.3.1, load-bmfont@^1.4.0:
xhr "^2.0.1"
xtend "^4.0.0"
+load-script@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/load-script/-/load-script-1.0.0.tgz#0491939e0bee5643ee494a7e3da3d2bac70c6ca4"
+ integrity sha512-kPEjMFtZvwL9TaZo0uZ2ml+Ye9HUMmPwbYRJ324qF9tqMejwykJ5ggTyvzmrbBeapCAbk98BSbTeovHEEP1uCA==
+
loader-runner@^2.4.0:
version "2.4.0"
resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.4.0.tgz#ed47066bfe534d7e84c4c7b9998c2a75607d9357"
@@ -17673,7 +17678,7 @@ prompts@^2.0.1, prompts@^2.4.2:
kleur "^3.0.3"
sisteransi "^1.0.5"
-prop-types@^15.0.0, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.6, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.8.1:
+prop-types@15.8.1, prop-types@^15.0.0, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.6, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.8.1:
version "15.8.1"
resolved "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@@ -18484,6 +18489,15 @@ react-window@^1.8.5:
"@babel/runtime" "^7.0.0"
memoize-one ">=3.1.1 <6"
+react-youtube@^10.1.0:
+ version "10.1.0"
+ resolved "https://registry.yarnpkg.com/react-youtube/-/react-youtube-10.1.0.tgz#7e5670c764f12eb408166e8eb438d788dc64e8b5"
+ integrity sha512-ZfGtcVpk0SSZtWCSTYOQKhfx5/1cfyEW1JN/mugGNfAxT3rmVJeMbGpA9+e78yG21ls5nc/5uZJETE3cm3knBg==
+ dependencies:
+ fast-deep-equal "3.1.3"
+ prop-types "15.8.1"
+ youtube-player "5.5.2"
+
react@^16.8.4:
version "16.14.0"
resolved "https://registry.npmjs.org/react/-/react-16.14.0.tgz#94d776ddd0aaa37da3eda8fc5b6b18a4c9a3114d"
@@ -19631,6 +19645,11 @@ simple-swizzle@^0.2.2:
dependencies:
is-arrayish "^0.3.1"
+sister@^3.0.0:
+ version "3.0.2"
+ resolved "https://registry.yarnpkg.com/sister/-/sister-3.0.2.tgz#bb3e39f07b1f75bbe1945f29a27ff1e5a2f26be4"
+ integrity sha512-p19rtTs+NksBRKW9qn0UhZ8/TUI9BPw9lmtHny+Y3TinWlOa9jWh9xB0AtPSdmOy49NJJJSSe0Ey4C7h0TrcYA==
+
sisteransi@^1.0.5:
version "1.0.5"
resolved "https://registry.yarnpkg.com/sisteransi/-/sisteransi-1.0.5.tgz#134d681297756437cc05ca01370d3a7a571075ed"
@@ -22562,6 +22581,15 @@ yoga-layout-prebuilt@^1.10.0:
dependencies:
"@types/yoga-layout" "1.9.2"
+youtube-player@5.5.2:
+ version "5.5.2"
+ resolved "https://registry.yarnpkg.com/youtube-player/-/youtube-player-5.5.2.tgz#052b86b1eabe21ff331095ffffeae285fa7f7cb5"
+ integrity sha512-ZGtsemSpXnDky2AUYWgxjaopgB+shFHgXVpiJFeNB5nWEugpW1KWYDaHKuLqh2b67r24GtP6HoSW5swvf0fFIQ==
+ dependencies:
+ debug "^2.6.6"
+ load-script "^1.0.0"
+ sister "^3.0.0"
+
yurnalist@^2.1.0:
version "2.1.0"
resolved "https://registry.npmjs.org/yurnalist/-/yurnalist-2.1.0.tgz#44cf7ea5a33a8fab4968cc8c2970489f93760902"