diff --git a/.gitignore b/.gitignore
index dfad251b..088abda1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,7 +4,7 @@
.eslintcache
# Generated
-build/
+/build/
dist/
# Yarn
diff --git a/src/components/Card/index.tsx b/src/components/Card/index.tsx
index 756d68e6..cfe6154b 100644
--- a/src/components/Card/index.tsx
+++ b/src/components/Card/index.tsx
@@ -9,7 +9,18 @@ import {
import { FC } from "react"
import { BodyLg, BodySm, LabelSm } from "../Typography"
+export interface CardButton {
+ label: string
+ url: string
+ variant: string
+}
+
+export interface CardCategory {
+ label: string
+}
+
type CardComponent
= FC
& {
+ PreTitle: FC
Title: FC
SubTitle: FC
Divider: FC
@@ -21,6 +32,12 @@ const Card: CardComponent = (props) => {
return
}
+const PreTitle: FC = ({ children, ...textProps }) => (
+
+ {children}
+
+)
+
const Title: FC = ({ children, ...textProps }) => (
{children}
)
@@ -39,6 +56,7 @@ const Divider = ({ ...dividerProps }) => {
return
}
+Card.PreTitle = PreTitle
Card.Title = Title
Card.SubTitle = SubTitle
Card.Body = Body
diff --git a/src/components/HighlightWord.tsx b/src/components/HighlightWord.tsx
index 8cb076f3..2d773d94 100644
--- a/src/components/HighlightWord.tsx
+++ b/src/components/HighlightWord.tsx
@@ -1,10 +1,9 @@
import React, { FC } from "react"
-import { RoleTemplateProps } from "../templates/home-page/SectionTemplate"
import { BoxProps, Text } from "@chakra-ui/react"
export interface HighlightWordProps extends BoxProps {
title: string
- highlightedWord: string
+ highlightedWord?: string
}
export const HighlightWord: FC = ({
@@ -12,13 +11,13 @@ export const HighlightWord: FC = ({
highlightedWord,
...highlightedWordProps
}) => {
- const titleSplittedByHighlightedWord = title.split(highlightedWord!)
+ const splittedTitle = title.split(highlightedWord || "")
return (
<>
- {titleSplittedByHighlightedWord.map((item, index) => (
+ {splittedTitle.map((item, index) => (
{item}
- {index !== titleSplittedByHighlightedWord.length - 1 && (
+ {index !== splittedTitle.length - 1 && highlightedWord && (
{highlightedWord}
diff --git a/src/components/IntegrationCard.tsx b/src/components/IntegrationCard.tsx
index da6463b0..834ac24b 100644
--- a/src/components/IntegrationCard.tsx
+++ b/src/components/IntegrationCard.tsx
@@ -101,7 +101,6 @@ export const IntegrationsCardGroup: FC<{ cards: IntegrationCardProps[] }> = ({
spacing={cardSpacing}
overflowX="hidden"
py={20}
- mb={-28}
position="relative"
>
{cardSet.map((card: IntegrationCardProps, i) => (
diff --git a/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx b/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx
index 012895c7..d876eca3 100644
--- a/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx
+++ b/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx
@@ -3,8 +3,18 @@ import { HStack } from "@chakra-ui/react"
import DropdownLabelLink from "./DropdownMenu"
import NavLink from "./NavLink"
import { LinkInfo } from "../types"
+import NavCTAButtons from "../NavCTAButtons"
+import { CardButton } from "../../Card"
-const DesktopNavLinks: FC<{ navLinks: LinkInfo[] }> = ({ navLinks }) => {
+interface DesktopNavLinksProps {
+ navLinks: LinkInfo[]
+ menuButtons: CardButton[]
+}
+
+const DesktopNavLinks: FC = ({
+ navLinks,
+ menuButtons,
+}) => {
return (
= ({ navLinks }) => {
borderColor="gray.700"
px={8}
spacing={4}
- display={{ base: "none", lg: "inherit" }}
+ display={{ base: "none", md: "inherit" }}
+ justifyContent={{ base: "end", lg: "start" }}
as="nav"
>
{navLinks.map(({ subitems, label, url }) => {
@@ -29,6 +40,7 @@ const DesktopNavLinks: FC<{ navLinks: LinkInfo[] }> = ({ navLinks }) => {
)
})}
+
)
}
diff --git a/src/components/Navbar/DesktopNav/DropdownMenu.tsx b/src/components/Navbar/DesktopNav/DropdownMenu.tsx
index 909a6236..86657875 100644
--- a/src/components/Navbar/DesktopNav/DropdownMenu.tsx
+++ b/src/components/Navbar/DesktopNav/DropdownMenu.tsx
@@ -35,6 +35,7 @@ const DropdownMenu: FC<{ dropdown: LinkInfo[]; text: string }> = ({
px={2}
color="gray.300"
_hover={hoverStyles}
+ display={{ base: "none", lg: "inherit" }}
{...openStyles}
>
diff --git a/src/components/Navbar/DesktopNav/NavLink.tsx b/src/components/Navbar/DesktopNav/NavLink.tsx
index 4569f55e..6fc63626 100644
--- a/src/components/Navbar/DesktopNav/NavLink.tsx
+++ b/src/components/Navbar/DesktopNav/NavLink.tsx
@@ -10,7 +10,7 @@ const NavLink: FC<{ href: string }> = ({ href, children }) => {
px={2}
to={href}
color="gray.300"
- display="flex"
+ display={{ base: "none", lg: "flex" }}
_hover={{
textDecoration: "none",
color: "white",
diff --git a/src/components/Navbar/MobileNav/MobileDrawer.tsx b/src/components/Navbar/MobileNav/MobileDrawer.tsx
index d425827b..d8838439 100644
--- a/src/components/Navbar/MobileNav/MobileDrawer.tsx
+++ b/src/components/Navbar/MobileNav/MobileDrawer.tsx
@@ -18,13 +18,24 @@ import { LinkInfo, SocialLink } from "../types"
import SocialMediaLinks from "../SocialMediaLinks"
import { FaChevronLeft } from "react-icons/all"
import { BodySm, H5 } from "../../Typography"
+import { CardButton } from "../../Card"
+import NavCTAButtons from "../NavCTAButtons"
-const MobileDrawer: FC<{
+interface MobileDrawerProps {
onClose: () => void
isOpen: boolean
navLinks: LinkInfo[]
socialLinks: SocialLink[]
-}> = ({ onClose, isOpen, navLinks, socialLinks }) => {
+ menuButtons: CardButton[]
+}
+
+const MobileDrawer: FC = ({
+ onClose,
+ isOpen,
+ navLinks,
+ socialLinks,
+ menuButtons,
+}) => {
const isMobileDevice = useChakraBreakpoint("lg")
const [navLinksToRender, setNavLinksToRender] = useState(navLinks)
@@ -64,6 +75,14 @@ const MobileDrawer: FC<{
justifyContent="space-between"
pb={20}
>
+
}>
{navLinksToRender.map(({ url, label, subitems }) => (
= ({ menuButtons, ...props }) => {
+ return (
+
+ {menuButtons.map((_: CardButton) => {
+ return (
+
+ {_.label}
+
+ )
+ })}
+
+ )
+}
+
+export default NavCTAButtons
diff --git a/src/components/Navbar/index.tsx b/src/components/Navbar/index.tsx
index d8d311d8..8f042dde 100644
--- a/src/components/Navbar/index.tsx
+++ b/src/components/Navbar/index.tsx
@@ -8,6 +8,59 @@ import { LinkInfo } from "./types"
import WhatsNextBanner from "./WhatsNextBanner"
import MobileDrawer from "./MobileNav/MobileDrawer"
import DesktopNavLinks from "./DesktopNav/DesktopNavLinks"
+import { CardButton } from "../Card"
+import NavCTAButtons from "./NavCTAButtons"
+
+export const Navbar: FC = () => {
+ const {
+ isOpen: isDrawerOpen,
+ onOpen: onDrawOpen,
+ onClose: onDrawerClose,
+ } = useDisclosure()
+
+ const { isOpen: showBanner, onClose: closeBanner } = useDisclosure({
+ defaultIsOpen: true,
+ })
+ const data = useStaticQuery(query)
+ const socialLinks =
+ data.allMarkdownRemark.edges[0].node.frontmatter.social_links
+ const navLinks = data.allMarkdownRemark.edges[0].node.frontmatter
+ .nav_items as LinkInfo[]
+ const menuButtons = data.allMarkdownRemark.edges[0].node.frontmatter
+ .menu_buttons as CardButton[]
+
+ return (
+ <>
+ {showBanner && }
+
+
+
+
+
+
+
+
+
+ >
+ )
+}
const query = graphql`
query Navbar {
@@ -27,6 +80,10 @@ const query = graphql`
isExternal
}
}
+ menu_buttons {
+ label
+ url
+ }
social_links {
label
url
@@ -63,51 +120,3 @@ const query = graphql`
}
}
`
-
-export const Navbar: FC = () => {
- const {
- isOpen: isDrawerOpen,
- onOpen: onDrawOpen,
- onClose: onDrawerClose,
- } = useDisclosure()
-
- const { isOpen: showBanner, onClose: closeBanner } = useDisclosure({
- defaultIsOpen: true,
- })
- const data = useStaticQuery(query)
- const socialLinks =
- data.allMarkdownRemark.edges[0].node.frontmatter.social_links
- const navLinks = data.allMarkdownRemark.edges[0].node.frontmatter
- .nav_items as LinkInfo[]
-
- return (
- <>
- {showBanner && }
-
-
-
-
-
-
-
-
-
- >
- )
-}
diff --git a/src/content/components/nav-bar.md b/src/content/components/nav-bar.md
index c9f72663..8626cc0d 100644
--- a/src/content/components/nav-bar.md
+++ b/src/content/components/nav-bar.md
@@ -12,22 +12,25 @@ nav_items:
url: /earn/btc
- label: Token Holder
url: /earn/token-holder
+ - label: Build
+ isExternal: false
+ subitems:
+ - label: tBTC SDK
+ url: /build/tbtc-sdk
+ - label: Docs
+ url: https://docs.threshold.network/
+ isExternal: true
- label: Governance
url: /governance
- label: Ecosystem
url: /ecosystem
- - label: News
+ - label: About
subitems:
- label: Press
url: /press
- label: Blog
url: https://blog.threshold.network/
isExternal: true
- - label: About
- subitems:
- - label: Docs
- url: https://docs.threshold.network/
- isExternal: true
- label: Contributors
url: /about#contributors
- label: FAQ
@@ -38,6 +41,9 @@ nav_items:
- label: Brand Assets
url: https://bit.ly/threshold-brand-assets
isExternal: true
+menu_buttons:
+ - label: tBTC dApp
+ url: https://dashboard.threshold.network/tBTC
social_links:
- label: Twitter
url: https://twitter.com/TheTNetwork
@@ -54,11 +60,6 @@ social_links:
icon:
image: /images/discord.svg
alt: Threshold Discord
- - label: Discourse
- url: https://forum.threshold.network
- icon:
- image: /images/discourse-resources.svg
- alt: Threshold Forum
- label: GitHub
url: https://github.com/threshold-network
icon:
diff --git a/src/content/pages/build/index.md b/src/content/pages/build/index.md
new file mode 100644
index 00000000..27561e02
--- /dev/null
+++ b/src/content/pages/build/index.md
@@ -0,0 +1,5 @@
+---
+template: build-page
+path: /build
+title: Build
+---
diff --git a/src/content/pages/build/tbtc-sdk.md b/src/content/pages/build/tbtc-sdk.md
new file mode 100644
index 00000000..9043cff9
--- /dev/null
+++ b/src/content/pages/build/tbtc-sdk.md
@@ -0,0 +1,75 @@
+---
+template: build-page/tbtc-sdk
+path: /build/tbtc-sdk
+title: SDK Page
+seoTitle: Threshold tBTC SDK
+seoDescription: "Develop applications using tBTC SDK, and leverage the Bitcoins strength across various blockchains, enhancing user flexibility and market reach"
+sdkInfo:
+ title: "tBTC SDK: Supercharge Your Project with Bitcoin"
+ highlightedWord: "tBTC SDK:"
+ description: "Unlock the power of blockchain – The ultimate toolkit for harnessing Bitcoin's potential."
+ image: /images/tbtc-sdk.svg
+ buttons:
+ - label: Bounty Program
+ url: https://blog.threshold.network/introducing-the-tbtc-sdk-bounty-program/
+ variant: EXTERNAL_SOLID
+ - label: Learn More
+ url: https://blog.threshold.network/harnessing-the-tbtc-sdk-empowering-your-projects-with-bitcoin/
+ variant: EXTERNAL_OUTLINE
+ rowReverse: false
+useCasesInfo:
+ preTitle: Explore
+ title: Use Cases
+ description: "How tBTC SDK Unlocks Bitcoin’s Versatility in Blockchain Projects."
+ rowReverse: false
+useCases:
+ - image: /images/decentralized-finance.svg
+ preTitle: Explore
+ title: Decentralized Finance
+ description: Make your DeFi application Bitcoin-compatible to boost liquidity and market options.
+ buttons:
+ - label: Learn More
+ url: https://docs.threshold.network/app-development/tbtc-v2/tbtc-sdk/
+ variant: EXTERNAL_OUTLINE
+ - image: /images/cross-chain-applications.svg
+ preTitle: Explore
+ title: Cross-Chain Applications
+ description: Build apps that use Bitcoin's power across different blockchains, offering more flexibility and reach.
+ buttons:
+ - label: Learn More
+ url: https://docs.threshold.network/app-development/tbtc-v2/tbtc-sdk/
+ variant: EXTERNAL_OUTLINE
+ - image: /images/payment-solutions.svg
+ preTitle: Explore
+ title: Payment Solutions
+ description: Add Bitcoin to your blockchain platforms for wider payment options and to attract more users.
+ buttons:
+ - label: Learn More
+ url: https://docs.threshold.network/app-development/tbtc-v2/tbtc-sdk/
+ variant: EXTERNAL_OUTLINE
+featuresInfo:
+ preTitle: Features
+ title: Key Features
+ description: "Explore tBTC SDK's core features for seamless Bitcoin integration."
+ image: /images/ecosystem-grid.svg
+ rowReverse: false
+ icon: /images/gradient-box-icon.svg
+features:
+ - title: Seamless Integration
+ description: TypeScript library enables the inclusion of Bitcoin into a range of blockchain environments.
+ - title: Streamlined Features
+ description: Simplifies Bitcoin deposits, mints, redemptions, focusing on innovation, not complexity.
+ - title: Adaptable Architecture
+ description: With shared libraries, the SDK smooth interactions between Bitcoin and multiple chains.
+callToActionInfo:
+ title: Get Started Today
+ description: "Join our community and explore the endless possibilities with tBTC SDK."
+ rowReverse: false
+ buttons:
+ - label: Learn More
+ url: https://docs.threshold.network/app-development/tbtc-v2/tbtc-sdk/
+ variant: EXTERNAL_OUTLINE
+ - label: Join Discord
+ url: https://discord.gg/threshold
+ variant: EXTERNAL_OUTLINE
+---
diff --git a/src/templates/build-page/index.tsx b/src/templates/build-page/index.tsx
new file mode 100644
index 00000000..960ca1e0
--- /dev/null
+++ b/src/templates/build-page/index.tsx
@@ -0,0 +1,7 @@
+import { FC } from "react"
+
+const BuildPageTemplate: FC = () => {
+ return <>>
+}
+
+export default BuildPageTemplate
diff --git a/src/templates/build-page/tbtc-sdk/FeaturesSection.tsx b/src/templates/build-page/tbtc-sdk/FeaturesSection.tsx
new file mode 100644
index 00000000..c9043b81
--- /dev/null
+++ b/src/templates/build-page/tbtc-sdk/FeaturesSection.tsx
@@ -0,0 +1,56 @@
+import { FC } from "react"
+import { SimpleGrid, Stack } from "@chakra-ui/react"
+import Card from "../../../components/Card"
+import { BodyMd, H6, Image, ImageProps } from "../../../components"
+
+interface FeaturesSectionProps {
+ cards: FeatureCardProps[]
+ icon: ImageProps
+}
+
+export interface FeatureCardProps {
+ title: string
+ description: string
+}
+
+const FeatureCard: FC> =
+ ({ icon, title, description }) => {
+ return (
+
+
+
+
+ {title}
+
+
+
+ {description}
+
+
+
+ )
+ }
+
+const FeaturesSection: FC = ({
+ cards,
+ icon,
+}: FeaturesSectionProps) => {
+ return (
+ <>
+
+ {cards.map((card: FeatureCardProps, i) => (
+
+ ))}
+
+ >
+ )
+}
+
+export default FeaturesSection
diff --git a/src/templates/build-page/tbtc-sdk/UseCases.tsx b/src/templates/build-page/tbtc-sdk/UseCases.tsx
new file mode 100644
index 00000000..dd916e84
--- /dev/null
+++ b/src/templates/build-page/tbtc-sdk/UseCases.tsx
@@ -0,0 +1,94 @@
+import { FC } from "react"
+import { Box, SimpleGrid, Stack } from "@chakra-ui/react"
+import Card, { CardButton } from "../../../components/Card"
+import ExternalButtonLink from "../../../components/Buttons/ExternalButtonLink"
+import { ExternalLinkHref } from "../../../components/Navbar/types"
+import { Image, ImageProps } from "../../../components"
+
+export interface UseCasesCardProps {
+ image: ImageProps
+ preTitle: string
+ title: string
+ description: string
+ buttons: CardButton[]
+}
+
+const UseCasesCard: FC = ({
+ image,
+ preTitle,
+ title,
+ description,
+ buttons,
+}) => {
+ return (
+
+
+
+
+
+ {preTitle}
+
+
+
+
+ {title}
+
+
+
+ {description}
+
+
+ {buttons.map((button: CardButton, i) => (
+
+ {button.label}
+
+ ))}
+
+
+
+
+
+ )
+}
+
+const UseCases: FC<{ cards: UseCasesCardProps[] }> = ({ cards }) => {
+ return (
+
+ {cards.map((card: any, i) => (
+
+ ))}
+
+ )
+}
+
+export default UseCases
diff --git a/src/templates/build-page/tbtc-sdk/index.tsx b/src/templates/build-page/tbtc-sdk/index.tsx
new file mode 100644
index 00000000..39dec164
--- /dev/null
+++ b/src/templates/build-page/tbtc-sdk/index.tsx
@@ -0,0 +1,181 @@
+import { FC } from "react"
+import { graphql } from "gatsby"
+import SectionTemplate from "../../home-page/SectionTemplate"
+import { Box, Divider } from "@chakra-ui/react"
+import UseCases, { UseCasesCardProps } from "./UseCases"
+import FeaturesSection, { FeatureCardProps } from "./FeaturesSection"
+import { HighlightWord } from "../../../components/HighlightWord"
+import { SectionInfo, WithRequiredProperty } from "../../../types"
+
+interface SDKPageContent {
+ sdkInfo: SectionInfo
+ useCasesInfo: SectionInfo
+ useCases: UseCasesCardProps[]
+ featuresInfo: WithRequiredProperty
+ features: FeatureCardProps[]
+ callToActionInfo: SectionInfo
+}
+
+interface SDKTitleProps {
+ title: string
+ highlightedWord: string
+}
+
+const SDKTitle: FC = ({ title, highlightedWord }) => (
+
+
+
+)
+
+const SDKPageTemplate: FC = ({ data }: any) => {
+ const {
+ sdkInfo,
+ useCasesInfo,
+ useCases,
+ featuresInfo,
+ features,
+ callToActionInfo,
+ } = data.markdownRemark.frontmatter as SDKPageContent
+ const { title, highlightedWord, ...sectionTemplateProps } = sdkInfo
+
+ return (
+
+ }
+ columnReverse
+ size="sm"
+ >
+
+
+
+
+
+
+
+
+
+
+ )
+}
+
+export default SDKPageTemplate
+
+export const query = graphql`
+ query SDKPage($id: String!) {
+ markdownRemark(id: { eq: $id }) {
+ id
+ frontmatter {
+ sdkInfo {
+ rowReverse
+ title
+ highlightedWord
+ description
+ image {
+ id
+ relativePath
+ internal {
+ mediaType
+ }
+ childImageSharp {
+ gatsbyImageData(width: 200)
+ }
+ }
+ buttons {
+ label
+ url
+ variant
+ }
+ }
+ useCasesInfo {
+ rowReverse
+ preTitle
+ title
+ description
+ }
+ useCases {
+ image {
+ id
+ relativePath
+ internal {
+ mediaType
+ }
+ childImageSharp {
+ gatsbyImageData(width: 200)
+ }
+ }
+ preTitle
+ title
+ description
+ buttons {
+ label
+ url
+ variant
+ }
+ }
+ featuresInfo {
+ rowReverse
+ preTitle
+ title
+ description
+ image {
+ id
+ relativePath
+ internal {
+ mediaType
+ }
+ childImageSharp {
+ gatsbyImageData(width: 200)
+ }
+ }
+ icon {
+ id
+ relativePath
+ internal {
+ mediaType
+ }
+ childImageSharp {
+ gatsbyImageData(width: 200)
+ }
+ }
+ }
+ features {
+ title
+ description
+ }
+ callToActionInfo {
+ rowReverse
+ title
+ description
+ buttons {
+ label
+ url
+ variant
+ }
+ }
+ }
+ }
+ }
+`
diff --git a/src/templates/ecosystem-page/ProjectsAndTools.tsx b/src/templates/ecosystem-page/ProjectsAndTools.tsx
index 0da1cd05..01689746 100644
--- a/src/templates/ecosystem-page/ProjectsAndTools.tsx
+++ b/src/templates/ecosystem-page/ProjectsAndTools.tsx
@@ -1,6 +1,6 @@
import { FC, useEffect, useState } from "react"
import { SimpleGrid, Stack, Flex } from "@chakra-ui/react"
-import { ImageProps } from "../../components"
+import { CardButton, CardCategory, ImageProps } from "../../components"
import SortDropdown, { SortOption } from "../../components/SortDropdown"
import FilterMenu from "../../components/FilterMenu"
import { ProjectsAndToolsCard } from "./ProjectsAndToolsCard"
@@ -17,16 +17,6 @@ export enum Category {
INTEGRATION = "integration",
}
-export interface CardButton {
- label: string
- url: string
- variant: string
-}
-
-export interface CardCategory {
- label: string
-}
-
export interface ProjectsAndToolsCardProps {
image: ImageProps
title: string
diff --git a/src/templates/ecosystem-page/ProjectsAndToolsCard.tsx b/src/templates/ecosystem-page/ProjectsAndToolsCard.tsx
index 47fe40fe..c05763ef 100644
--- a/src/templates/ecosystem-page/ProjectsAndToolsCard.tsx
+++ b/src/templates/ecosystem-page/ProjectsAndToolsCard.tsx
@@ -1,20 +1,10 @@
import { FC, useRef, useState } from "react"
import { Box, Button, SimpleGrid, Stack, Flex } from "@chakra-ui/react"
-import Card from "../../components/Card"
+import Card, { CardButton, CardCategory } from "../../components/Card"
import ExternalButtonLink from "../../components/Buttons/ExternalButtonLink"
import { ExternalLinkHref } from "../../components/Navbar/types"
import { Image, ImageProps } from "../../components"
-export interface CardButton {
- label: string
- url: string
- variant: string
-}
-
-export interface CardCategory {
- label: string
-}
-
export interface ProjectsAndToolsCardProps {
image: ImageProps
title: string
diff --git a/src/templates/ecosystem-page/ResourcesSection.tsx b/src/templates/ecosystem-page/ResourcesSection.tsx
index 761a147d..5f009975 100644
--- a/src/templates/ecosystem-page/ResourcesSection.tsx
+++ b/src/templates/ecosystem-page/ResourcesSection.tsx
@@ -1,10 +1,9 @@
import { FC } from "react"
import { Flex, GridItem, SimpleGrid, Stack } from "@chakra-ui/react"
-import Card from "../../components/Card"
+import Card, { CardButton } from "../../components/Card"
import ExternalButtonLink from "../../components/Buttons/ExternalButtonLink"
import { ExternalLinkHref } from "../../components/Navbar/types"
import { BodyLg, H3, H5, Image, ImageProps } from "../../components"
-import { CardButton } from "./ProjectsAndToolsCard"
import backgroundResources from "../../static/images/background-resources.svg"
export interface ResourcesCardProps {
diff --git a/src/templates/home-page/SectionTemplate.tsx b/src/templates/home-page/SectionTemplate.tsx
index 4eb085f3..a79fdd53 100644
--- a/src/templates/home-page/SectionTemplate.tsx
+++ b/src/templates/home-page/SectionTemplate.tsx
@@ -1,5 +1,9 @@
import React, { FC } from "react"
-import { BoxProps, Stack } from "@chakra-ui/react"
+import {
+ BoxProps,
+ ImageProps as ChakraImageProps,
+ Stack,
+} from "@chakra-ui/react"
import {
ButtonType,
CmsButtonLink,
@@ -24,12 +28,11 @@ export interface FooterButton {
}
export interface RoleTemplateProps extends OmittedBoxProps {
- bgColor: string
- title: string | JSX.Element
+ title: string | JSX.Element | FC
description: string
- buttons: FooterButton[]
- highlightedWord?: string
- image?: ImageProps
+ buttons?: FooterButton[]
+ bgColor?: string
+ image?: ImageProps & ChakraImageProps
rowReverse?: boolean
size?: "sm" | "md"
isImageBackground?: boolean
@@ -40,7 +43,6 @@ export interface RoleTemplateProps extends OmittedBoxProps {
const SectionTemplate: FC = ({
title,
- highlightedWord,
description,
buttons = [],
image,
@@ -63,7 +65,7 @@ const SectionTemplate: FC = ({
rowReverse={rowReverse}
columnReverse={columnReverse}
spacing={16}
- justifyContent={isCentered ? "center" : undefined}
+ justifyContent={isCentered ? "center" : "space-between"}
textAlign={isCentered ? "center" : undefined}
>
@@ -82,7 +84,12 @@ const SectionTemplate: FC = ({
{description}
)}
-
+
{buttons.map((_: FooterButton, i) => {
return (
diff --git a/src/types/index.ts b/src/types/index.ts
new file mode 100644
index 00000000..5f9fdfd0
--- /dev/null
+++ b/src/types/index.ts
@@ -0,0 +1,16 @@
+import { CardButton, ImageProps } from "../components"
+
+export interface SectionInfo {
+ title: string
+ description: string
+ preTitle?: string
+ highlightedWord?: string
+ buttons?: CardButton[]
+ icon?: ImageProps
+ image?: ImageProps
+ rowReverse?: boolean
+}
+
+export type WithRequiredProperty = Type & {
+ [Property in Key]-?: Type[Property]
+}
diff --git a/static/admin/config.yml b/static/admin/config.yml
index 555c051c..1ce7e73c 100644
--- a/static/admin/config.yml
+++ b/static/admin/config.yml
@@ -2412,6 +2412,338 @@ collections:
{ label: "URL", name: "url", widget: "string" },
],
}
+ # SDK Page
+ - file: "src/content/pages/build/tbtc-sdk.md"
+ name: "sdkPage"
+ label: "tBTC SDK Page"
+ fields:
+ - {
+ label: "Template",
+ name: "template",
+ widget: "hidden",
+ default: "build-page/sdk-page",
+ }
+ - {
+ label: "Path",
+ name: "path",
+ widget: "hidden",
+ default: "/build/tbtc-sdk",
+ }
+ - {
+ label: "SEO Title",
+ name: "seoTitle",
+ widget: "string",
+ hint: "SEO title",
+ required: false,
+ }
+ - {
+ label: "SEO Description",
+ name: "seoDescription",
+ widget: "string",
+ hint: "SEO description",
+ required: false,
+ }
+ - {
+ label: "Hero Section",
+ name: "sdkInfo",
+ widget: "object",
+ collapsed: true,
+ fields:
+ [
+ {
+ label: "Row Reverse",
+ name: "rowReverse",
+ widget: boolean,
+ required: false,
+ default: false,
+ },
+ {
+ label: "Title",
+ name: "title",
+ widget: "string",
+ minimal: true,
+ },
+ {
+ label: "Highlighted Word",
+ name: "highlightedWord",
+ widget: "string",
+ minimal: true,
+ },
+ {
+ label: "Description",
+ name: "description",
+ widget: "string",
+ required: false,
+ },
+ {
+ label: "Image",
+ name: "image",
+ widget: file,
+ media_library: { config: { multiple: false } },
+ },
+ {
+ 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: "Use Cases Section",
+ name: "useCasesInfo",
+ widget: "object",
+ collapsed: true,
+ fields:
+ [
+ {
+ label: "Row Reverse",
+ name: "rowReverse",
+ widget: boolean,
+ required: false,
+ default: false,
+ },
+ {
+ label: "Pre Title",
+ name: "preTitle",
+ widget: "string",
+ minimal: true,
+ },
+ {
+ label: "Title",
+ name: "title",
+ widget: "string",
+ minimal: true,
+ },
+ {
+ label: "Description",
+ name: "description",
+ widget: "string",
+ required: false,
+ },
+ ],
+ }
+ - {
+ label: "Use Cases Card",
+ name: "useCases",
+ widget: "list",
+ allow_add: true,
+ fields:
+ [
+ {
+ label: "Image",
+ name: "image",
+ widget: file,
+ media_library: { config: { multiple: false } },
+ },
+ {
+ label: "Pre Title",
+ name: "preTitle",
+ widget: "string",
+ minimal: true,
+ },
+ { label: "Title", name: "title", widget: "string" },
+ {
+ label: "Description",
+ name: "description",
+ widget: "string",
+ },
+ {
+ 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: "Features Section",
+ name: "featuresInfo",
+ widget: "object",
+ collapsed: true,
+ fields:
+ [
+ {
+ label: "Row Reverse",
+ name: "rowReverse",
+ widget: boolean,
+ required: false,
+ default: false,
+ },
+ {
+ label: "Pre Title",
+ name: "preTitle",
+ widget: "string",
+ minimal: true,
+ },
+ {
+ label: "Title",
+ name: "title",
+ widget: "string",
+ minimal: true,
+ },
+ {
+ label: "Description",
+ name: "description",
+ widget: "string",
+ required: false,
+ },
+ {
+ label: "Image",
+ name: "image",
+ widget: file,
+ media_library: { config: { multiple: false } },
+ },
+ {
+ label: "Icon",
+ name: "icon",
+ widget: file,
+ media_library: { config: { multiple: false } },
+ },
+ ],
+ }
+ - {
+ label: "Features Card",
+ name: "features",
+ widget: "list",
+ allow_add: true,
+ fields:
+ [
+ { label: "Title", name: "title", widget: "string" },
+ {
+ label: "Description",
+ name: "description",
+ widget: "string",
+ },
+ ],
+ }
+ - {
+ label: "Call To Action Section",
+ name: "callToActionInfo",
+ widget: "object",
+ collapsed: true,
+ fields:
+ [
+ {
+ label: "Row Reverse",
+ name: "rowReverse",
+ widget: boolean,
+ required: false,
+ default: false,
+ },
+ {
+ label: "Title",
+ name: "title",
+ widget: "string",
+ minimal: true,
+ },
+ {
+ label: "Description",
+ name: "description",
+ widget: "string",
+ required: false,
+ },
+ {
+ 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",
+ },
+ ],
+ },
+ ],
+ },
+ ],
+ }
# Governance Page
- file: "src/content/pages/governance/index.md"
name: "governancePage"
@@ -2890,6 +3222,18 @@ collections:
},
],
}
+ - {
+ label: "Buttons",
+ name: "menu_buttons",
+ widget: "list",
+ allow_add: true,
+ required: false,
+ fields:
+ [
+ { label: Label, name: label, widget: string },
+ { label: URL, name: url, widget: string },
+ ],
+ }
- {
label: "Social Media Links",
name: "social_links",
diff --git a/static/images/cross-chain-applications.svg b/static/images/cross-chain-applications.svg
new file mode 100644
index 00000000..7f11dbed
--- /dev/null
+++ b/static/images/cross-chain-applications.svg
@@ -0,0 +1,5 @@
+
diff --git a/static/images/decentralized-finance.svg b/static/images/decentralized-finance.svg
new file mode 100644
index 00000000..db57a394
--- /dev/null
+++ b/static/images/decentralized-finance.svg
@@ -0,0 +1,5 @@
+
diff --git a/static/images/gradient-box-icon.svg b/static/images/gradient-box-icon.svg
new file mode 100644
index 00000000..b15da47f
--- /dev/null
+++ b/static/images/gradient-box-icon.svg
@@ -0,0 +1,9 @@
+
diff --git a/static/images/payment-solutions.svg b/static/images/payment-solutions.svg
new file mode 100644
index 00000000..fafb09c0
--- /dev/null
+++ b/static/images/payment-solutions.svg
@@ -0,0 +1,6 @@
+
diff --git a/static/images/tbtc-sdk.svg b/static/images/tbtc-sdk.svg
new file mode 100644
index 00000000..140c5517
--- /dev/null
+++ b/static/images/tbtc-sdk.svg
@@ -0,0 +1,77 @@
+