From 1df260ef84f5db13b58a18999c81ffff14cb0fb1 Mon Sep 17 00:00:00 2001 From: Alex Z Date: Wed, 6 May 2026 16:08:25 +0700 Subject: [PATCH 1/2] Updated design --- docs/developers/security/bug-bounty.md | 2 +- src/components/HomepageLanding/index.tsx | 435 +++++++++------ .../HomepageLanding/styles.module.css | 499 +++++++++++++++--- 3 files changed, 706 insertions(+), 230 deletions(-) diff --git a/docs/developers/security/bug-bounty.md b/docs/developers/security/bug-bounty.md index 34fe7679..5ec6f1e0 100644 --- a/docs/developers/security/bug-bounty.md +++ b/docs/developers/security/bug-bounty.md @@ -5,6 +5,6 @@ sidebar_position: 3 # Bug Bounty Program -Responsible disclosure of security vulnerabilities is rewarded through our [Immunefi](https://immunefi.com/bounty/ssvnetwork/) bug bounty program. The current program scope is focused on [the protocol’s smart contracts](https://github.com/ssvlabs/ssv-network), with rewards ranging from $1,500 up to $1,000,000. +Responsible disclosure of security vulnerabilities is rewarded through our [Immunefi](https://immunefi.com/bounty/ssvnetwork/) bug bounty program. The current program scope is focused on [the protocol’s smart contracts](https://github.com/ssvlabs/ssv-network), with rewards ranging from \$1,500 up to \$250,000. Follow the link for more details: [https://immunefi.com/bounty/ssvnetwork/](https://immunefi.com/bounty/ssvnetwork/) diff --git a/src/components/HomepageLanding/index.tsx b/src/components/HomepageLanding/index.tsx index 9c92e267..a7905085 100644 --- a/src/components/HomepageLanding/index.tsx +++ b/src/components/HomepageLanding/index.tsx @@ -4,31 +4,40 @@ import Heading from '@theme/Heading'; import styles from './styles.module.css'; -type Pathway = { +type InternalLink = { + to: string; + href?: never; +}; + +type ExternalLink = { + href: string; + to?: never; +}; + +type LinkTarget = InternalLink | ExternalLink; + +type Pathway = InternalLink & { title: string; description: string; - to: string; label: string; icon: ReactElement; iconTone: 'blue' | 'yellow' | 'red' | 'green'; - featured?: boolean; + titleHoverTone?: 'default' | 'green' | 'yellow' | 'red'; }; -type CardItem = { +type ToolItem = InternalLink & { title: string; description: string; - to: string; + icon: ReactElement; }; -type SectionData = { - id: string; +type OperationItem = InternalLink & { title: string; - items: CardItem[]; + icon: ReactElement; }; -type QuickLinkItem = { - label: string; - href: string; +type SecurityLinkItem = LinkTarget & { + title: string; icon: ReactElement; }; @@ -41,6 +50,18 @@ type SupportItem = { tone?: 'default' | 'highlight' | 'orange'; }; +function getLinkProps(target: LinkTarget) { + if ('href' in target) { + return { + href: target.href, + target: '_blank', + rel: 'noopener noreferrer', + }; + } + + return {to: target.to}; +} + export function SSVIcon(props: SVGProps) { return (
{label}
- + {title}

{description}

@@ -344,9 +388,12 @@ function PathwayCard({title, description, to, label, icon, iconTone, featured}: ); } -function SectionCard({title, description, to}: CardItem) { +function DeveloperToolCard({title, description, to, icon}: ToolItem) { return ( + {title} @@ -355,21 +402,14 @@ function SectionCard({title, description, to}: CardItem) { ); } -function ContentSection({id, title, items}: SectionData) { +function SectionHeader({title, note}: {title: string; note?: string}) { return ( -
-
- - {title} - - -
- {items.map((item) => ( - - ))} -
-
+
+ + {title} + + {note ?

{note}

: ); } @@ -378,55 +418,112 @@ export default function HomepageLanding(): ReactElement {
-
- - Build with SSV Network - -

- Use Distributed Validator Technology for secure, decentralized, and scalable staking infrastructure. -

+
+
+ + Build with SSV Network + +

+ Onboard validators across distributed operators using the SSV SDK, API, subgraph, and smart contracts. +

+
+ + Quickstart → + + + Introduction → + +
+
+
+              // Onboard a validator across 4 SSV operators
+              {'\n'}
+              import {'{'} SSV {'}'} from{' '}
+              '@ssv-labs/ssv-sdk'
+              {'\n\n'}
+              const ssv = new SSV({'{'} network:{' '}
+              'mainnet' {'}'})
+              {'\n'}
+              await ssv.cluster.register({'{'} owner, operators, keyShares {'}'})
+            
-
- {pathways.map((pathway) => ( - - ))} +
+ +
+ {developerTools.map((item) => ( + + ))} +
- {sections.map((section) => ( - - ))} -
-
- - Quick Links - - -
- {quickLinks.map((item) => ( - - {item.icon} - {item.label} + +
+ {commonOperations.map((item) => ( + + + {item.title} ))}
+
+ +
+ {pathways.map((pathway) => ( + + ))} +
+
+
-
- - Connect with us - -
+ +
+
{supportItems.map((item) => (
Date: Wed, 6 May 2026 19:11:12 +0700 Subject: [PATCH 2/2] Added more common operations, fixed code block --- src/components/HomepageLanding/index.tsx | 53 ++++++++++++++++++++++-- 1 file changed, 50 insertions(+), 3 deletions(-) diff --git a/src/components/HomepageLanding/index.tsx b/src/components/HomepageLanding/index.tsx index a7905085..e30bcf0b 100644 --- a/src/components/HomepageLanding/index.tsx +++ b/src/components/HomepageLanding/index.tsx @@ -239,6 +239,38 @@ function OperationArrowDownIcon(props: SVGProps) { ); } +function OperationBalanceIcon(props: SVGProps) { + return ( + + ); +} + +function OperationExitIcon(props: SVGProps) { + return ( + + ); +} + +function OperationRemoveIcon(props: SVGProps) { + return ( + + ); +} + const pathways: Pathway[] = [ { title: 'Onboarding Guides', @@ -325,6 +357,21 @@ const commonOperations: OperationItem[] = [ to: '/developers/examples/deposit-eth', icon: , }, + { + title: 'Cluster Balance', + to: '/developers/examples/cluster-balance-script', + icon: , + }, + { + title: 'Exit validator', + to: '/developers/examples/exit-validator', + icon: , + }, + { + title: 'Remove validator', + to: '/developers/examples/remove-validator', + icon: , + }, ]; const securityLinks: SecurityLinkItem[] = [ @@ -438,11 +485,11 @@ export default function HomepageLanding(): ReactElement {
               // Onboard a validator across 4 SSV operators
               {'\n'}
-              import {'{'} SSV {'}'} from{' '}
+              import {'{'} SSVSDK {'}'} from{' '}
               '@ssv-labs/ssv-sdk'
               {'\n\n'}
-              const ssv = new SSV({'{'} network:{' '}
-              'mainnet' {'}'})
+              const ssv = new SSVSDK({'{'} publicClient, walletClient{' '}
+              {'}'})
               {'\n'}
               await ssv.cluster.register({'{'} owner, operators, keyShares {'}'})