diff --git a/src/components/Card/index.tsx b/src/components/Card/index.tsx index cfe6154..862728e 100644 --- a/src/components/Card/index.tsx +++ b/src/components/Card/index.tsx @@ -13,6 +13,7 @@ export interface CardButton { label: string url: string variant: string + posthogLabel?: string } export interface CardCategory { diff --git a/src/components/HighlightWord.tsx b/src/components/HighlightWord.tsx deleted file mode 100644 index 2d773d9..0000000 --- a/src/components/HighlightWord.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import React, { FC } from "react" -import { BoxProps, Text } from "@chakra-ui/react" - -export interface HighlightWordProps extends BoxProps { - title: string - highlightedWord?: string -} - -export const HighlightWord: FC = ({ - title, - highlightedWord, - ...highlightedWordProps -}) => { - const splittedTitle = title.split(highlightedWord || "") - return ( - <> - {splittedTitle.map((item, index) => ( - - {item} - {index !== splittedTitle.length - 1 && highlightedWord && ( - - {highlightedWord} - - )} - - ))} - - ) -} diff --git a/src/components/HighlightWords.tsx b/src/components/HighlightWords.tsx new file mode 100644 index 0000000..3d1ed0a --- /dev/null +++ b/src/components/HighlightWords.tsx @@ -0,0 +1,36 @@ +import React, { FC } from "react" +import { BoxProps, Text } from "@chakra-ui/react" + +export interface HighlightWordsProps extends BoxProps { + title: string + highlighted?: string[] +} + +export const HighlightWords: FC = ({ + title, + highlighted = [], + ...boxProps +}) => { + const words = title.split(/\s+/) + + return ( + <> + {words.map((word, index) => { + const isHighlighted = highlighted.includes(word) + + return ( + + {isHighlighted ? ( + + {word} + + ) : ( + word + )} + {index < words.length - 1 && " "} + + ) + })} + + ) +} diff --git a/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx b/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx index d876eca..74afe40 100644 --- a/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx +++ b/src/components/Navbar/DesktopNav/DesktopNavLinks.tsx @@ -17,14 +17,14 @@ const DesktopNavLinks: FC = ({ }) => { return ( {navLinks.map(({ subitems, label, url }) => { diff --git a/src/components/Navbar/SocialMediaLinks.tsx b/src/components/Navbar/SocialMediaLinks.tsx index 0dfc6b6..e2884f5 100644 --- a/src/components/Navbar/SocialMediaLinks.tsx +++ b/src/components/Navbar/SocialMediaLinks.tsx @@ -11,18 +11,19 @@ const SocialMediaLinks: FC< > = ({ isMobileDrawerFooter, links, ...stackProps }) => { return ( { <> {showBanner && } { as="header" > diff --git a/src/components/ThresholdBrand.tsx b/src/components/ThresholdBrand.tsx index 12b99ea..f344e2a 100644 --- a/src/components/ThresholdBrand.tsx +++ b/src/components/ThresholdBrand.tsx @@ -8,8 +8,9 @@ const ThresholdBrand: FC<{ isDrawerOpen?: boolean } & StackProps> = ({ }) => { return ( diff --git a/src/content/components/nav-bar.md b/src/content/components/nav-bar.md index 8626cc0..24e300b 100644 --- a/src/content/components/nav-bar.md +++ b/src/content/components/nav-bar.md @@ -15,6 +15,8 @@ nav_items: - label: Build isExternal: false subitems: + - label: TACo + url: /build/taco - label: tBTC SDK url: /build/tbtc-sdk - label: Docs diff --git a/src/content/pages/build/taco.md b/src/content/pages/build/taco.md new file mode 100644 index 0000000..c767861 --- /dev/null +++ b/src/content/pages/build/taco.md @@ -0,0 +1,213 @@ +--- +template: build-page/taco +path: /build/taco +title: TACo Page +seoTitle: Threshold Taco +seoDescription: "TACo (Threshold Access Control) enables end-to-end encrypted data sharing and communication." +tacoInfo: + title: "TACo: Privacy Without Trust" + description: "Give your users true sovereignty over their data, today. TACo is the first and only access control layer you aren’t forced to trust." + image: /images/taco-encryption.svg + buttons: + - label: Start Building + url: https://docs.threshold.network/app-development/threshold-access-control-tac/integration-guide + variant: EXTERNAL_SOLID + - label: Trust Overview + url: https://docs.threshold.network/app-development/threshold-access-control-tac/trust-assumptions/mainnet-trust-model-foundation + variant: EXTERNAL_OUTLINE + rowReverse: false +tacoFeaturesInfo: + title: "End-to-End Encryption. End-to-End Decentralized." + description: "Empower users to share data with qualifying recipients, and no-one else. Encryption via a decentralized cryptosystem, from day one." + highlighted: ["Encryption.", "Decentralized."] +tacoFeatures: + - title: "Web3 needs TACo" + cards: + - title: "Decentralized Storage" + description: "TACo is the perfect complement to persistent storage, finally enabling users to grant future access without having to download & re-encrypt locally." + icon: /images/storage-icon.svg + - title: "Web3 Social Networks" + description: "TACo facilitates many-to-many data sharing, without a centralized authority that may harvest, exploit and monetize interpersonal communication." + icon: /images/social-icon.svg + - title: "Media Content-gating" + description: "Whether it's a stream, a movie or a collectible, TACo enforces the decryption rights. 'Owning' an NFT now holds significance beyond a symbolic receipt." + icon: /images/media-icon.svg + - title: "The Web needs TACo" + cards: + - title: "Hyper-sensitive data" + description: "From password recovery to reproductive healthcare, TACo ensures that high-stakes data sharing doesn’t necessitate trusting an intermediary." + icon: /images/locker-icon.svg + - title: "IoT & Connected Vehicles" + description: "TACo is the antidote to the interconnected hardware panopticon, in which every waking (and sleeping) moment of life is surveilled/harvested by data custodians." + icon: /images/iot-icon.svg + - title: "Activism & Human Rights" + description: "TACo protects the most vulnerable in society – those who may face intimidation, censorship and violence as a consequence of their data being leaked." + icon: /images/activism-icon.svg +tacoDiagramsInfo: + title: "Integrate a Privacy Layer with Nothing to Hide" + description: "TACo isn't just auditable, it's comprehensible. From high-level schematic to client code." + image: /images/taco-grid.svg + background: /images/glowing-background.png +tacoDiagrams: + - title: "Generating a DKG Cohort" + preTitle: "learn" + description: "Independent nodes are sampled from the Threshold Network to collectively generate a distributed public key." + image: /images/first-taco-diagram.svg + buttons: + - label: "nucypher/ferveo" + url: https://github.com/nucypher/ferveo + variant: EXTERNAL_OUTLINE + - label: "nucypher-contracts" + url: https://github.com/nucypher/nucypher-contracts + variant: EXTERNAL_OUTLINE + - title: "Encrypting Private Data" + preTitle: "learn" + description: "Data owners specify decryption conditions, embedded alongside the private data. The payload is encrypted with the DKG public key." + image: "/images/second-taco-diagram.svg" + buttons: + - label: "taco-web" + url: https://github.com/nucypher/taco-web + variant: EXTERNAL_OUTLINE + - label: "nucypher" + url: https://github.com/nucypher/nucypher + variant: EXTERNAL_OUTLINE + - title: "Accessing Decrypted Data" + preTitle: "learn" + description: "Data requesters present proof to the cohort, and each member verifies condition fulfilment before provisioning the requester with a decryption share; decryption requires a threshold of these shares." + image: "/images/third-taco-diagram.svg" + buttons: + - label: "taco-web" + url: https://github.com/nucypher/taco-web + variant: EXTERNAL_OUTLINE + - label: "nucypher" + url: https://github.com/nucypher/nucypher + variant: EXTERNAL_OUTLINE +tacoExamplesInfo: + title: "Access conditions that fit your use case" + preTitle: "build" + description: "Whatever the business logic for data access, TACo nodes will enforce it. Specify and combine EVM, RPC and time-based conditions. Non-blockchain coming soon." + image: "/images/ecosystem-grid.svg" + rowReverse: false +tacoExamples: + - title: "NFT-gating" + description: "Predicate decryption rights on ownership of a special-purpose NFTs. Works for digital media, event streams and beyond." + image: "/images/nft-gating.svg" + - title: "Secret recovery" + description: "Securely share your seed phrase/password with beneficiaries or your future self, without risking DOS by an intermediary." + image: "/images/secret-recovery.svg" + - title: "Inference protection" + description: "Prevent third-parties from harvesting or blocking communication between end-users and generative models." + image: "/images/inference-protection.svg" +tacoTableInfo: + title: "The Zero Compromise Solution" + highlighted: ["Zero", "Compromise"] + description: "TACo blends ease of integration with genuine decentralization. No need to choose between the two." + rowReverse: false +tacoTable: + headers: + [ + "Feature / Service Choice", + "TACo", + "LIT", + "EVM Contract", + "PKI", + "Cloud Service", + ] + features: + - label: "Scalable to millions of users" + options: + - project: "Taco" + image: "/images/check-purple.svg" + - project: "LIT" + image: "/images/check-white.svg" + - project: "EVM Contract" + image: "/images/x-gray.svg" + - project: "PKI" + image: "/images/x-gray.svg" + - project: "Cloud Service" + image: "/images/check-white.svg" + - label: "Arbitrary access conditions" + options: + - project: "Taco" + image: "/images/check-purple.svg" + - project: "LIT" + image: "/images/check-white.svg" + - project: "EVM Contract" + image: "/images/x-gray.svg" + - project: "PKI" + image: "/images/x-gray.svg" + - project: "Cloud Service" + image: "/images/check-white.svg" + - label: "Redundant & highly available" + options: + - project: "Taco" + image: "/images/check-purple.svg" + - project: "LIT" + image: "/images/dash-white.svg" + - project: "EVM Contract" + image: "/images/check-white.svg" + - project: "PKI" + image: "/images/x-gray.svg" + - project: "Cloud Service" + image: "/images/check-white.svg" + - label: "Cryptoeconomically secured" + options: + - project: "Taco" + image: "/images/check-purple.svg" + - project: "LIT" + image: "/images/x-gray.svg" + - project: "EVM Contract" + image: "/images/check-white.svg" + - project: "PKI" + image: "/images/x-gray.svg" + - project: "Cloud Service" + image: "/images/x-gray.svg" + - label: "Battle-tested network" + options: + - project: "Taco" + image: "/images/check-purple.svg" + - project: "LIT" + image: "/images/x-gray.svg" + - project: "EVM Contract" + image: "/images/check-white.svg" + - project: "PKI" + image: "/images/x-gray.svg" + - project: "Cloud Service" + image: "/images/x-gray.svg" + - label: "Transparent trust model" + options: + - project: "Taco" + image: "/images/check-purple.svg" + - project: "LIT" + image: "/images/x-gray.svg" + - project: "EVM Contract" + image: "/images/check-white.svg" + - project: "PKI" + image: "/images/check-white.svg" + - project: "Cloud Service" + image: "/images/dash-white.svg" + - label: "Track record with infra" + options: + - project: "Taco" + image: "/images/check-purple.svg" + - project: "LIT" + image: "/images/x-gray.svg" + - project: "EVM Contract" + image: "/images/check-white.svg" + - project: "PKI" + image: "/images/x-gray.svg" + - project: "Cloud Service" + image: "/images/x-gray.svg" + - label: "Multi-chain" + options: + - project: "Taco" + image: "/images/dash-purple.svg" + - project: "LIT" + image: "/images/check-white.svg" + - project: "EVM Contract" + image: "/images/x-gray.svg" + - project: "PKI" + image: "/images/x-gray.svg" + - project: "Cloud Service" + image: "/images/x-gray.svg" +--- diff --git a/src/content/pages/build/tbtc-sdk.md b/src/content/pages/build/tbtc-sdk.md index 9043cff..1136f7d 100644 --- a/src/content/pages/build/tbtc-sdk.md +++ b/src/content/pages/build/tbtc-sdk.md @@ -6,7 +6,7 @@ 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:" + highlighted: ["tBTC", "SDK:"] description: "Unlock the power of blockchain – The ultimate toolkit for harnessing Bitcoin's potential." image: /images/tbtc-sdk.svg buttons: diff --git a/src/content/pages/ecosystem/index.md b/src/content/pages/ecosystem/index.md index 5410123..401b34d 100644 --- a/src/content/pages/ecosystem/index.md +++ b/src/content/pages/ecosystem/index.md @@ -5,7 +5,7 @@ title: Ecosystem Page seoTitle: Threshold Ecosystem ecosystemInfo: title: We Are Building Our Ecosystem Together - highlightedWord: "Ecosystem" + highlighted: ["Ecosystem"] description: "The Threshold ecosystem is built around a vibrant community of users, developers, designers, and educators." image: /images/ecosystem-grid.svg rowReverse: false @@ -73,7 +73,7 @@ projectsAndTools: date: 2023-03-07 buttons: - label: Go to App - url: https://101.xyz/course/claqymc0v067108kyden9aehq + url: https://tbtcscan.com/ variant: EXTERNAL_SOLID - image: /images/dune-analytics.svg title: Dune Analytics diff --git a/src/templates/build-page/taco/TacoDiagrams.tsx b/src/templates/build-page/taco/TacoDiagrams.tsx new file mode 100644 index 0000000..d5eefd7 --- /dev/null +++ b/src/templates/build-page/taco/TacoDiagrams.tsx @@ -0,0 +1,113 @@ +import React, { FC, useState } from "react" +import { Box, Icon, Stack } from "@chakra-ui/react" +import { BodyLg, H3, LabelMd } from "../../../components/Typography" +import { + PageSection, + ResponsiveStack, + SectionImage, +} from "../../../components/PageSection" +import { Image, ImageProps } from "../../../components/Image" +import { TrackComponent } from "../../../components/Posthog/TrackComponent" +import { SectionInfo } from "../../../types" +import ExternalButtonLink from "../../../components/Buttons/ExternalButtonLink" +import { ExternalLinkHref } from "../../../components/Navbar/types" +import { BsArrowLeftShort, BsArrowRightShort } from "react-icons/bs" + +export interface TacoDiagramsProps { + backgroundImage: ImageProps + tacoDiagrams: SectionInfo[] +} + +const TacoDiagrams: FC = ({ + backgroundImage, + tacoDiagrams, +}) => { + const [current, setCurrent] = useState(0) + + const handlePrev = () => { + if (current > 0) setCurrent(current - 1) + } + + const handleNext = () => { + if (current < tacoDiagrams.length - 1) setCurrent(current + 1) + } + + const currentDiagram = tacoDiagrams[current] + return ( + + + + + {currentDiagram.preTitle} + +

+ {currentDiagram.title} +

+ + {currentDiagram.description} + + + {currentDiagram.buttons.map((button) => ( + + + {button.label} + + + ))} + + + {tacoDiagrams.map((_, index) => ( + + ))} + + + handlePrev()} + cursor="pointer" + opacity={current === 0 ? 0.5 : 1} + > + + + handleNext()} + cursor="pointer" + opacity={current === 2 ? 0.5 : 1} + > + + + + + + {currentDiagram.image && } + + + + + ) +} + +export default TacoDiagrams diff --git a/src/templates/build-page/taco/TacoExamples.tsx b/src/templates/build-page/taco/TacoExamples.tsx new file mode 100644 index 0000000..408399b --- /dev/null +++ b/src/templates/build-page/taco/TacoExamples.tsx @@ -0,0 +1,109 @@ +import React, { FC, useState } from "react" +import { Box, Stack, Collapse, Flex } from "@chakra-ui/react" +import { ResponsiveStack } from "../../../components/PageSection" +import { Image } from "../../../components/Image" +import { SectionInfo } from "../../../types" +import Card from "../../../components/Card" + +export interface TacoExamplesProps { + tacoExamples: SectionInfo[] +} + +export interface TacoExampleProps extends SectionInfo { + togglePanel: (index: number) => void + expandedPanel: number | null + index: number +} + +export const TacoExampleCard: FC = ({ + togglePanel, + expandedPanel, + index, + title, + description, +}) => { + return ( + + togglePanel(index)} + cursor="pointer" + w={{ base: "100%", md: "420px" }} + > + + {title} + + {expandedPanel === index ? "-" : "+"} + + + + + {description} + + + + + ) +} + +const TacoExamples: FC = ({ tacoExamples }) => { + const [expandedPanel, setExpandedPanel] = useState(0) + + const togglePanel = (index: number) => { + setExpandedPanel(expandedPanel === index ? null : index) + } + + return ( + + + {tacoExamples.map((example, index) => ( + + ))} + + + + + + ) +} + +export default TacoExamples diff --git a/src/templates/build-page/taco/TacoFeatures.tsx b/src/templates/build-page/taco/TacoFeatures.tsx new file mode 100644 index 0000000..d38e004 --- /dev/null +++ b/src/templates/build-page/taco/TacoFeatures.tsx @@ -0,0 +1,87 @@ +import { FC } from "react" +import { Box, SimpleGrid, Stack } from "@chakra-ui/react" +import Card from "../../../components/Card" +import { H3, ImageProps } from "../../../components" +import { SectionImage } from "../../../components/PageSection" + +export interface TacoFeaturesProps { + sections: FeatureSection[] +} + +export type FeaturesSectionProps = FeatureSection + +export interface FeaturesCardProps { + icon: ImageProps + title: string + description: string + index: number +} + +export interface FeatureCard { + title: string + description: string + icon: Icon +} + +export interface FeatureSection { + title: string + cards: FeatureCard[] +} + +export interface Icon { + id: string + relativePath: string +} + +const FeaturesCard: FC = ({ + icon, + title, + description, + index, +}) => ( + 0 ? { md: "transparent" } : "gray.800"} + gap={6} + roundedLeft={index === 0 ? { base: "none", lg: 12 } : "none"} + roundedRight={index === 2 ? { base: "none", lg: 12 } : "none"} + py="2.5rem" + bg="transparent" + > + + + + {title} + + {description} + + +) + +const FeaturesSection: FC = ({ title, cards }) => { + return ( + +

{title}

+ + {cards.map((card: any, i) => ( + + ))} + + + ) +} + +const TacoFeatures: FC = ({ sections }) => { + return ( + + {sections.map((section: any, i) => ( + + ))} + + ) +} + +export default TacoFeatures diff --git a/src/templates/build-page/taco/TacoTable.tsx b/src/templates/build-page/taco/TacoTable.tsx new file mode 100644 index 0000000..cd3617a --- /dev/null +++ b/src/templates/build-page/taco/TacoTable.tsx @@ -0,0 +1,72 @@ +import React, { FC } from "react" +import { Box, Table, Tbody, Td, Th, Thead, Tr, Center } from "@chakra-ui/react" +import { BodySm, Image, ImageProps } from "../../../components" + +export interface TableOptions { + project: "Taco" | "Taco" | "Taco" | "Taco" | "Taco" + image: ImageProps +} + +export interface TableRow { + label: string + options: TableOptions[] +} + +export interface SectionTable { + headers: Array + features: TableRow[] +} + +export interface TacoTableProps { + headers: Array + features: TableRow[] +} + +const TacoTable: FC = ({ headers, features }) => { + return ( + + + + + {headers.map((header, index) => ( + + ))} + + + + {features.map((feature, index) => ( + + + {feature.options.map((option, optIndex) => ( + + ))} + + ))} + +
+ + {header} + +
+ {feature.label} + +
+ +
+
+ + ) +} + +export default TacoTable diff --git a/src/templates/build-page/taco/index.tsx b/src/templates/build-page/taco/index.tsx new file mode 100644 index 0000000..4e25c0c --- /dev/null +++ b/src/templates/build-page/taco/index.tsx @@ -0,0 +1,310 @@ +import React, { FC } from "react" +import { graphql } from "gatsby" +import SectionTemplate from "../../home-page/SectionTemplate" +import { Box, Divider, Text } from "@chakra-ui/react" +import { SectionInfo } from "../../../types" +import { HighlightWords } from "../../../components/HighlightWords" +import TacoFeatures, { FeatureSection } from "./TacoFeatures" +import TacoDiagrams from "./TacoDiagrams" +import { ImageProps } from "../../../components" +import TacoExamples from "./TacoExamples" +import TacoTable, { SectionTable } from "./TacoTable" + +export interface TacoPageContent { + tacoInfo: SectionInfo + tacoFeaturesInfo: SectionInfo + tacoFeatures: FeatureSection[] + tacoDiagramsInfo: ExtendedSectionInfo + tacoDiagrams: SectionInfo[] + tacoExamplesInfo: SectionInfo + tacoExamples: SectionInfo[] + tacoTableInfo: SectionInfo + tacoTable: SectionTable +} + +export interface ExtendedSectionInfo extends SectionInfo { + background?: ImageProps +} + +export interface TacoTitleProps { + title: string +} + +const TacoTitle: FC = ({ title }) => { + const words = title.trim().split(/\s+/) + + return ( + <> + {words.map((word, index) => ( + + {word === "TACo:" ? ( + + {word} +
+ + ) : ( + word + )} + {index < words.length - 1 && " "} + + ))} + + ) +} + +const TacoPageTemplate: FC = ({ data }: any) => { + const { + tacoInfo, + tacoFeaturesInfo, + tacoFeatures, + tacoDiagramsInfo, + tacoDiagrams, + tacoExamplesInfo, + tacoExamples, + tacoTableInfo, + tacoTable, + } = data.markdownRemark.frontmatter as TacoPageContent + + console.log("tacoTable: ", tacoTable) + return ( + + } + columnReverse + size="md" + > + + + + + + } + preTitle="" + size="md" + isCentered + mt="-6rem" + mb="4rem" + > + + + {tacoDiagramsInfo.title}} + bgColor="#0A0C0F" + preTitle="" + size="md" + isCentered + isImageBackground + > + + + + + + + + + } + bgColor="#161A1F" + preTitle="" + size="md" + isCentered + isImageBackground + > + + + + ) +} + +export default TacoPageTemplate + +export const query = graphql` + query TacoPage($id: String!) { + markdownRemark(id: { eq: $id }) { + id + frontmatter { + tacoInfo { + rowReverse + title + description + image { + id + relativePath + internal { + mediaType + } + childImageSharp { + gatsbyImageData(width: 200) + } + } + buttons { + label + url + variant + } + } + tacoFeaturesInfo { + title + description + highlighted + } + tacoFeatures { + title + cards { + title + description + icon { + id + relativePath + } + } + } + tacoDiagramsInfo { + title + description + image { + id + relativePath + internal { + mediaType + } + childImageSharp { + gatsbyImageData(width: 200) + } + } + background { + id + relativePath + internal { + mediaType + } + childImageSharp { + gatsbyImageData(width: 200) + } + } + } + tacoDiagrams { + title + preTitle + description + image { + id + relativePath + internal { + mediaType + } + childImageSharp { + gatsbyImageData(width: 200) + } + } + buttons { + label + url + variant + } + } + tacoExamplesInfo { + title + preTitle + description + image { + id + relativePath + internal { + mediaType + } + childImageSharp { + gatsbyImageData(width: 200) + } + } + rowReverse + } + tacoExamples { + title + description + image { + id + relativePath + internal { + mediaType + } + childImageSharp { + gatsbyImageData(width: 200) + } + } + } + tacoTableInfo { + title + highlighted + description + rowReverse + } + tacoTable { + headers + features { + label + options { + project + image { + id + relativePath + internal { + mediaType + } + childImageSharp { + gatsbyImageData(width: 200) + } + } + } + } + } + } + } + } +` diff --git a/src/templates/build-page/tbtc-sdk/index.tsx b/src/templates/build-page/tbtc-sdk/index.tsx index 39dec16..fdec505 100644 --- a/src/templates/build-page/tbtc-sdk/index.tsx +++ b/src/templates/build-page/tbtc-sdk/index.tsx @@ -4,7 +4,7 @@ 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 { HighlightWords } from "../../../components/HighlightWords" import { SectionInfo, WithRequiredProperty } from "../../../types" interface SDKPageContent { @@ -18,15 +18,15 @@ interface SDKPageContent { interface SDKTitleProps { title: string - highlightedWord: string + highlighted: string[] } -const SDKTitle: FC = ({ title, highlightedWord }) => ( - - = ({ title, highlighted }) => ( + + @@ -41,13 +41,13 @@ const SDKPageTemplate: FC = ({ data }: any) => { features, callToActionInfo, } = data.markdownRemark.frontmatter as SDKPageContent - const { title, highlightedWord, ...sectionTemplateProps } = sdkInfo + const { title, highlighted, ...sectionTemplateProps } = sdkInfo return ( } + title={} columnReverse size="sm" > @@ -58,7 +58,7 @@ const SDKPageTemplate: FC = ({ data }: any) => { image={{ ...featuresInfo.image, left: 0, - ml: "4rem", + ml: "-44rem", mt: "-5rem", w: "52rem", }} @@ -91,7 +91,7 @@ export const query = graphql` sdkInfo { rowReverse title - highlightedWord + highlighted description image { id diff --git a/src/templates/ecosystem-page/index.tsx b/src/templates/ecosystem-page/index.tsx index e0bdb99..5ac0e27 100644 --- a/src/templates/ecosystem-page/index.tsx +++ b/src/templates/ecosystem-page/index.tsx @@ -7,7 +7,7 @@ import ProgramsAndEvents from "./ProgramsAndEvents" import ProjectsAndTools from "./ProjectsAndTools" import ResourcesSection from "./ResourcesSection" import CommunitySection from "./CommunitySection" -import { HighlightWord } from "../../components/HighlightWord" +import { HighlightWords } from "../../components/HighlightWords" const EcosystemPageTemplate: FC = ({ data }: any) => { const { @@ -20,15 +20,16 @@ const EcosystemPageTemplate: FC = ({ data }: any) => { communityInfo, community, } = data.markdownRemark.frontmatter + const { highlighted } = ecosystemInfo return ( @@ -36,7 +37,7 @@ const EcosystemPageTemplate: FC = ({ data }: any) => { image={{ ...ecosystemInfo.image, right: 0, - mr: "32rem", + mr: "-12rem", mt: "-3rem", w: "52rem", }} @@ -55,7 +56,7 @@ const EcosystemPageTemplate: FC = ({ data }: any) => { image={{ ...ecosystemInfo.image, left: 0, - ml: "4rem", + ml: "-40rem", mt: "-6rem", w: "52rem", }} @@ -81,7 +82,7 @@ export const query = graphql` ecosystemInfo { rowReverse title - highlightedWord + highlighted description image { id diff --git a/src/templates/home-page/SectionTemplate.tsx b/src/templates/home-page/SectionTemplate.tsx index a79fdd5..14d0d5d 100644 --- a/src/templates/home-page/SectionTemplate.tsx +++ b/src/templates/home-page/SectionTemplate.tsx @@ -59,6 +59,7 @@ const SectionTemplate: FC = ({ + + + + + + + + + diff --git a/static/images/check-purple.svg b/static/images/check-purple.svg new file mode 100644 index 0000000..b41916e --- /dev/null +++ b/static/images/check-purple.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/static/images/check-white.svg b/static/images/check-white.svg new file mode 100644 index 0000000..0116021 --- /dev/null +++ b/static/images/check-white.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/images/dash-purple.svg b/static/images/dash-purple.svg new file mode 100644 index 0000000..032c38a --- /dev/null +++ b/static/images/dash-purple.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/static/images/dash-white.svg b/static/images/dash-white.svg new file mode 100644 index 0000000..272730b --- /dev/null +++ b/static/images/dash-white.svg @@ -0,0 +1,3 @@ + + + diff --git a/static/images/first-taco-diagram.svg b/static/images/first-taco-diagram.svg new file mode 100644 index 0000000..fe06ab8 --- /dev/null +++ b/static/images/first-taco-diagram.svg @@ -0,0 +1,252 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/glowing-background.png b/static/images/glowing-background.png new file mode 100644 index 0000000..03c847e Binary files /dev/null and b/static/images/glowing-background.png differ diff --git a/static/images/inference-protection.svg b/static/images/inference-protection.svg new file mode 100644 index 0000000..189ef3f --- /dev/null +++ b/static/images/inference-protection.svg @@ -0,0 +1,79 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/iot-icon.svg b/static/images/iot-icon.svg new file mode 100644 index 0000000..c5040f1 --- /dev/null +++ b/static/images/iot-icon.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/static/images/locker-icon.svg b/static/images/locker-icon.svg new file mode 100644 index 0000000..ab950af --- /dev/null +++ b/static/images/locker-icon.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/static/images/media-icon.svg b/static/images/media-icon.svg new file mode 100644 index 0000000..6da5123 --- /dev/null +++ b/static/images/media-icon.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/static/images/nft-gating.svg b/static/images/nft-gating.svg new file mode 100644 index 0000000..8c16a18 --- /dev/null +++ b/static/images/nft-gating.svg @@ -0,0 +1,85 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/second-taco-diagram.svg b/static/images/second-taco-diagram.svg new file mode 100644 index 0000000..394db67 --- /dev/null +++ b/static/images/second-taco-diagram.svg @@ -0,0 +1,116 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/secret-recovery.svg b/static/images/secret-recovery.svg new file mode 100644 index 0000000..9dc12a0 --- /dev/null +++ b/static/images/secret-recovery.svg @@ -0,0 +1,69 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/social-icon.svg b/static/images/social-icon.svg new file mode 100644 index 0000000..66aff33 --- /dev/null +++ b/static/images/social-icon.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/static/images/storage-icon.svg b/static/images/storage-icon.svg new file mode 100644 index 0000000..be71727 --- /dev/null +++ b/static/images/storage-icon.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/static/images/taco-encryption.svg b/static/images/taco-encryption.svg new file mode 100644 index 0000000..8a5ed0f --- /dev/null +++ b/static/images/taco-encryption.svg @@ -0,0 +1,351 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/taco-grid.svg b/static/images/taco-grid.svg new file mode 100644 index 0000000..46ef06e --- /dev/null +++ b/static/images/taco-grid.svg @@ -0,0 +1,68 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/third-taco-diagram.svg b/static/images/third-taco-diagram.svg new file mode 100644 index 0000000..351309b --- /dev/null +++ b/static/images/third-taco-diagram.svg @@ -0,0 +1,205 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/x-gray.svg b/static/images/x-gray.svg new file mode 100644 index 0000000..5c6ccc8 --- /dev/null +++ b/static/images/x-gray.svg @@ -0,0 +1,4 @@ + + + +