Merge pull request #570 from bob-collective/dom/guides-wallets-api

Update use guides and landing page

Author: nud3l

docs/docs/learn/builder-guides/hello-bitcoin/index.mdx

@@ -46,7 +46,7 @@ Solidity and a toolchain are sufficient to get you started deploying contracts o
 
 We start with installing the prerequisites for the development environment.
 
-- Get Sepolia ETH and bridge them to BOB. Use the links on the [Connect to BOB](/learn/user-guides/networks) page.
+- Get Sepolia ETH and bridge them to BOB. Use the links on the [Connect to BOB](/learn/user-guides/getting-started/networks) page.
 - Setup either Remix or Foundry as your development environment. If you want to get started without having to install software, use Remix. If you are planning to develop more complex contracts, use Foundry.
 
 <Tabs groupId="dev-env">

docs/docs/learn/introduction/gateway/index.md

@@ -1,9 +1,8 @@
 ---
 sidebar_position: 2
-sidebar_label: "BOB Bitcoin Interoperability"
 ---
 
-# BOB Bitcoin Interoperability
+# BOB Gateway
 
 ## Introduction
 
@@ -18,7 +17,7 @@ Gateway powers the [BOB BTC Bridge](https://app.gobob.xyz/en?type=deposit&networ
 :::info Bridge or Stake BTC on BOB
 Check our user guides to learn how to swap your BTC to wrapped BTC or staked BTC.
 - [Bridge BTC to BOB](/learn/user-guides/onboard-to-bob/bob-gateway/): Receive wBTC or tBTC on BOB.
-- [Stake BTC on BOB](/learn/user-guides/bob-stake): Receive xSolvBTC, uniBTC, or other staked BTC on BOB.
+- [Stake BTC on BOB](/learn/user-guides/stake-btc/): Receive xSolvBTC, uniBTC, or other staked BTC on BOB.
 :::
 
 ## Gateway for Builders

docs/docs/learn/introduction/hybrid-btc/index.mdx

@@ -7,7 +7,7 @@ import HybridBtcDiagram from "./hybrid-btc-flow.svg";
 
 # HybridBTC
 
-HybridBTC is BOB's first yield-generating product, enabling Bitcoin holders to earn real yield on their BTC through BOB's cross-chain infrastructure. Like all BOB products, it reflects our commitment to making Bitcoin DeFi safer and more accessible by leveraging modern EVM tooling. We've unified best-in-class solutions into one seamless experience, from [paying fees with BTC](/learn/builder-guides/bridged-btc-gas-fee), to [signing with your Bitcoin wallet](/learn/reference/tools/account-abstraction/#btc-connect), to [staking your BTC directly from Bitcoin](/learn/user-guides/stake-with-ledger). HybridBTC builds on this foundation to deliver secure, efficient yield generation for Bitcoin holders.
+HybridBTC is BOB's first yield-generating product, enabling Bitcoin holders to earn real yield on their BTC through BOB's cross-chain infrastructure. Like all BOB products, it reflects our commitment to making Bitcoin DeFi safer and more accessible by leveraging modern EVM tooling. We've unified best-in-class solutions into one seamless experience, from [paying fees with BTC](/learn/builder-guides/bridged-btc-gas-fee), to [signing with your Bitcoin wallet](/learn/reference/tools/account-abstraction/#btc-connect), to [staking your BTC directly from Bitcoin](/learn/user-guides/stake-btc/#ledger-guide). HybridBTC builds on this foundation to deliver secure, efficient yield generation for Bitcoin holders.
 
 ## Quick Overview
 

docs/docs/learn/introduction/index.mdx

@@ -15,62 +15,65 @@ import styles from "./index.module.css";
   </div>
 </div>
 
-## What is BOB?
+## Why BOB?
 
 BOB is a new type of Bitcoin-secured blockchain: a Hybrid L2. Hybrid L2s inherit security from Bitcoin, as the most secure and decentralized network.
 
-With BOB’s Hybrid L2 design we strive to completely change the way BTC is used in finance.
+With BOB's Hybrid L2 design we strive to completely change the way BTC is used in finance.
 
 - **Today**: deposit BTC into centralized exchanges or wrap to a dozen of other chains via multisig bridges.
 - **The Hybrid future**: Everyone deposits assets into a BTC-secured platform that has access to native BTC liquidity… because everyone is OK to trust Bitcoin.
 
-
 ### Bitcoin Security
 
-Security is key to unlock Bitcoin liquidity in DeFi. The BOB Hybrid L2 in its final form will inherit Bitcoin security and support trust-minimized BTC deposits and withdrawals. While native ZK verification on Bitcoin requires a fork, BitVM allows us to create optimistic rollups and bridges with the tools we have today. Unlike multisig bridges and federated sidechains (t-of-n = honest majority), BitVM remains secure even with just a single honest node (1-of-n). For more details, see the [BitVM2 paper](https://bitvm.org/bitvm_bridge.pdf) co-authored by researchers from ZeroSync, BOB, TU Vienna and others.
+Security is essential for Bitcoin liquidity in DeFi.
+BOB Hybrid L2 will inherit Bitcoin's security using Bitcoin finality through BTC staking and a native BTC bridge powered by BitVM.
+BitVM enables much more secure BTC bridges without requiring a Bitcoin fork.
+
+Learn more in the [BitVM2 paper](https://bitvm.org/bitvm_bridge.pdf).
 
 ### Ethereum Liquidity
 
-Network effects, liquidity, and accessibility are key to a successful DeFi ecosystem. This Ethereum’s super power.To harness the best of both worlds, BOB will run a trust-minimized Ethereum bridge, providing ETH users with a seamless DeFi experience.
-This "Hybrid" bridge functions like ETH L2 optimistic bridges but is uniquely powered by Bitcoin finality. An ETH L2 bridge waits for L2 finality on Ethereum. The Hybrid bridge instead checks for Bitcoin finality. In simple terms: ETH and ERC-20s deposited to BOB are secured by Bitcoin.
+BOB leverages Ethereum's network effects and liquidity while providing a trust-minimized bridge for ETH users.
+Our unique "Hybrid" bridge uses Bitcoin finality instead of Ethereum L2 finality, ensuring all assets on BOB are secured by Bitcoin's robust security model.
 
 Learn more in the [BOB: The Hybrid L2 whitepaper](https://docs.gobob.xyz/whitepaper.pdf).
 
 ## Use BOB
 
 <div className="row">
   <div className="col col--4">
-    <div className="{styles.card}">
+    <div className={`${styles.card} ${styles.cardHover}`}>
       <div className="card__header">
         <h4>Setup your Wallet</h4>
       </div>
       <div className="card__body">
-        <a href="/learn/user-guides/networks">
-          <button class="button button--lg button--primary button--block">Connect to BOB↗</button>
+        <a className="button button--lg button--primary button--block" href="/learn/user-guides/getting-started/">
+          Connect to BOB
         </a>
       </div>
     </div>
   </div>
   <div className="col col--4">
-    <div className="{styles.card}">
+    <div className={`${styles.card} ${styles.cardHover}`}>
       <div className="card__header">
         <h4>Add funds to your Wallet</h4>
       </div>
       <div className="card__body">
-        <a href="/learn/user-guides/onboard-to-bob">
-          <button class="button button--lg button--primary button--block">Bridge to BOB ↗</button>
+        <a className="button button--lg button--primary button--block" href="/learn/user-guides/onboard-to-bob/">
+          Bridge to BOB
         </a>
       </div>
     </div>
   </div>
   <div className="col col--4">
-    <div className="{styles.card}">
+    <div className={`${styles.card} ${styles.cardHover}`}>
       <div className="card__header">
         <h4>Stake your Bitcoin</h4>
       </div>
       <div className="card__body">
-        <a href="/learn/user-guides/bob-stake">
-          <button class="button button--lg button--primary button--block">Stake BTC ↗</button>
+        <a className="button button--lg button--primary button--block" href="/learn/user-guides/stake-btc/">
+          Stake BTC
         </a>
       </div>
     </div>
@@ -81,37 +84,37 @@ Learn more in the [BOB: The Hybrid L2 whitepaper](https://docs.gobob.xyz/whitepa
 
 <div className="row">
   <div className="col col--4">
-    <div className="{styles.card}">
+    <div className={`${styles.card} ${styles.cardHover}`}>
       <div className="card__header">
         <h4>Deploy a Smart Contract</h4>
       </div>
       <div className="card__body">
-        <a href="/learn/builder-guides/hello-bitcoin">
-          <button class="button button--lg button--secondary button--block">Hello   Bitcoin ↗</button>
+        <a className="button button--lg button--secondary button--block" href="/learn/builder-guides/hello-bitcoin/">
+          Hello Bitcoin
         </a>
       </div>
     </div>
   </div>
   <div className="col col--4">
-    <div className="{styles.card}">
+    <div className={`${styles.card} ${styles.cardHover}`}>
       <div className="card__header">
         <h4>BTC Onramp in your App</h4>
       </div>
       <div className="card__body">
-        <a href="/learn/builder-guides/gateway">
-          <button class="button button--lg button--secondary button--block">BOB Gateway ↗</button>
+        <a className="button button--lg button--secondary button--block" href="/learn/builder-guides/gateway">
+          BOB Gateway
         </a>
       </div>
     </div>
   </div>
   <div className="col col--4">
-    <div className="{styles.card}">
+    <div className={`${styles.card} ${styles.cardHover}`}>
       <div className="card__header">
         <h4>Start a Full Node</h4>
       </div>
       <div className="card__body">
-        <a href="/learn/builder-guides/full-node">
-          <button class="button button--lg button--secondary button--block">Run a Full Node ↗</button>
+        <a className="button button--lg button--secondary button--block" href="/learn/builder-guides/full-node">
+          Run a Full Node
         </a>
       </div>
     </div>

docs/docs/learn/introduction/index.module.css

@@ -4,15 +4,71 @@
  */
 
 .hero {
-    padding: auto;
-    margin-top: 5rem;
-    margin-right: 0;
-    margin-bottom: 5rem;
-    background-color: var(--bob-background);
+    padding: 2rem 0;
+    position: relative;
+    overflow: hidden;
+}
+
+.hero__subtitle {
+    font-size: 1.5rem;
+    max-width: 800px;
+    margin: 0;
+    color: var(--ifm-color-primary);
 }
 
 .card {
-    margin: 1rem;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    transition: transform 0.2s ease-in-out;
+    border-radius: 8px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    background: var(--ifm-card-background-color);
+    border: 1px solid var(--ifm-color-emphasis-200);
+}
+
+.cardHover:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+}
+
+.card__header {
     padding: 1rem;
-    border-radius: 0.5rem;
+    border-bottom: 1px solid var(--ifm-color-emphasis-200);
+}
+
+.card__header h4 {
+    margin: 0;
+    color: var(--ifm-color-primary);
+    text-align: center;
+}
+
+.card__body {
+    padding: 1rem;
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 80px;
+}
+
+.card__body a {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.button--block {
+    width: 100%;
+    text-align: center;
+    padding: 0.75rem 1.5rem;
+    font-weight: 500;
+    border-radius: 6px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    min-height: 50px;
 }

docs/docs/learn/introduction/stack-overview.md

@@ -87,7 +87,7 @@ The majority of Bitcoin's stack and applications built around it are implemented
 
 [BOB Bridge](/learn/user-guides/onboard-to-bob/bob-gateway/) is our intent-based Bitcoin bridge built on the light client verification mentioned above. It is optimized to be fast, inexpensive, and programmable. As of this writing, 30,000 users have swapped a total of 75 BTC in a trust-minimized, peer-to-peer way.
 
-[BOB Stake](/learn/user-guides/bob-stake/) extends this idea by executing users' "intents" to stake, restake, or lend their BTC automatically during the bridge process. There are [more than a dozen options available](https://app.gobob.xyz/en/stake) at the moment, some offering five different sources of yield. All options are BTC-denominated and have no risk of impermanent loss.
+[BOB Stake](/learn/user-guides/stake-btc/) extends this idea by executing users' "intents" to stake, restake, or lend their BTC automatically during the bridge process. There are [more than a dozen options available](https://app.gobob.xyz/en/stake) at the moment, some offering five different sources of yield. All options are BTC-denominated and have no risk of impermanent loss.
 
 We built the [BOB Gateway SDK](/learn/builder-guides/gateway/) to make it possible for any frontend to offer its users these options by plugging into our infrastructure. Using the BOB Gateway SDK with [Dynamic's](https://www.dynamic.xyz/) wallet abstraction, you can even send native BTC to someone's email address via [BOB Pay](/learn/user-guides/bob-pay/#what-is-bob-pay).
 

docs/docs/learn/user-guides/bob-fusion/index.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 5
+sidebar_position: 7
 sidebar_label: Harvest Spice with BOB Fusion
 ---
 
@@ -31,7 +31,7 @@ Season 3 will be the Final season of the BOB Fusion program, bringing in new way
 
 ### Stacking BOB Partner Points
 
-Most of BOB’s dApp partners, like Solv, Bedrock, and FBTC, have introduced points programs. Users can also collect Babylon points by using partner LSTs on BOB. Season 3 enables triple harvesting across different partners, allowing you to stack points alongside Spice. Explore the dApps and choose your favorites. DYOR!
+Most of BOB's dApp partners, like Solv, Bedrock, and FBTC, have introduced points programs. Users can also collect Babylon points by using partner LSTs on BOB. Season 3 enables triple harvesting across different partners, allowing you to stack points alongside Spice. Explore the dApps and choose your favorites. DYOR!
 
 ### Early Bird Launch Event
 
@@ -57,19 +57,19 @@ ETH. BOB fees are low, similar to OP chain fees. Learn more at [l2fees.info](htt
 
 Withdraw your assets as well as sufficient ETH for gas fees from a centralized exchange to the Ethereum network or any supported L2 like Arbitrum, Optimism, Base, etc.
 
-If you’re a Coinbase user, withdrawing to the base network is free & then you can bridge your assets to BOB for low gas fees.
+If you're a Coinbase user, withdrawing to the base network is free & then you can bridge your assets to BOB for low gas fees.
 
 Use the [BOB bridge](https://app.gobob.xyz/bridge) or any other listed bridge providers to bridge your assets to the BOB network.
 
 ### What happens to my Season 1 & 2 points?
 
 Season 1 and 2 points are being counted separately from Season 3 points. They can be found on the dashboard under Season 3 points.
 
-### I have deployed capital into some dApps but they’re not distributing Spice very regularly
+### I have deployed capital into some dApps but they're not distributing Spice very regularly
 
 Please note some dApps plan to distribute Spice retroactively at some point in the future, so if you have used the dApp during that snapshot time, you will get your Spice, albeit the distribution timelines depend on the dApps.
 
-If you are unhappy about a dApp’s Spice distribution, your best options are to either voice your concerns to that dApp or look for other opportunities in the BOB Fusion campaign.
+If you are unhappy about a dApp's Spice distribution, your best options are to either voice your concerns to that dApp or look for other opportunities in the BOB Fusion campaign.
 
 ### What happens to the referrals I made in Season 1 & 2?
 
@@ -82,6 +82,6 @@ Yes! More risk and effort = more Spice.
 Example: DEXes harvest more than lending.
 There will be regular calls to action for specific assets or pools that can get bonuses.
 
-### What’s the maximum amount of Spice for the Fusion campaign?
+### What's the maximum amount of Spice for the Fusion campaign?
 
 There is no limit. The more TVL and activity, the more Spice distribution. Stay active in the ecosystem, to defend and grow your position.

docs/docs/learn/user-guides/bob-pay/index.md

@@ -1,17 +1,16 @@
 ---
-sidebar_position: 6
-sidebar_label: Send BTC to an Email Address
+sidebar_position: 8
 ---
 
-# Send BTC to an Email Address
+# BOB Pay
 
 ## What is BOB Pay?
 
 [BOB Pay](https://bob-pay.gobob.xyz/) aims to showcase how easy crypto UX can be by focusing on a simple use case popular within the Bitcoin ecosystem: payments.
 
 With BOB Pay, you can send Bitcoin and stablecoins to someone's email address. No wallet, no app, no seed phrase - just simple, cheap, non-custodial, and lightning-fast payments. BOB Pay showcases the power of wallet abstraction with [Dynamic](https://www.dynamic.xyz/), smart accounts from [ZeroDev](https://zerodev.app/), and paymasters from [Pimlico](https://www.pimlico.io/).
 
-We’re offering projects on BOB free access to Dynamic and Pimlico if you’d like to do the same.
+We're offering projects on BOB free access to Dynamic and Pimlico if you'd like to do the same.
 
 ## Video Tutorial
 
@@ -102,7 +101,7 @@ We’re offering projects on BOB free access to Dynamic and Pimlico if you’d l
 
 ## Conclusion
 
-BOB offers a complete package for builders looking to bring world-class UX to Bitcoin. We’re offering projects on BOB free access to Dynamic and Pimlico if you’d like to do the same.
+BOB offers a complete package for builders looking to bring world-class UX to Bitcoin. We're offering projects on BOB free access to Dynamic and Pimlico if you'd like to do the same.
 
 We look forward to seeing what you Build on Bitcoin!