add changes to docs

Author: youssefea

docs/base-account/examples/coin-a-joke-app.mdx

@@ -88,10 +88,29 @@ git clone https://github.com/base/demos.git
 
 # Navigate to the app
 cd demos/smart-wallet/coin-your-joke
+```
+
+Install dependencies:
 
-# Install dependencies
+<CodeGroup>
+```bash npm
+npm install
+```
+
+```bash pnpm
 pnpm install
+```
 
+```bash yarn
+yarn install
+```
+
+```bash bun
+bun install
+```
+</CodeGroup>
+
+```bash Terminal
 # Copy the environment variables
 cp .env.example .env
 ```

docs/base-account/framework-integrations/nextjs-with-wagmi.mdx

@@ -21,10 +21,24 @@ By the end of this guide, you will:
 
 After [creating a new Next.js project](https://nextjs.org/docs/app/getting-started/installation), install the required dependencies:
 
-```bash
+<CodeGroup>
+```bash npm
 npm install wagmi viem @base-org/account
 ```
 
+```bash pnpm
+pnpm add wagmi viem @base-org/account
+```
+
+```bash yarn
+yarn add wagmi viem @base-org/account
+```
+
+```bash bun
+bun add wagmi viem @base-org/account
+```
+</CodeGroup>
+
 <Tip>
 You can also use the command line `npm create wagmi@latest` to create a new full Wagmi project.
 </Tip>

docs/base-account/guides/accept-payments.mdx

@@ -112,7 +112,7 @@ export function Checkout() {
 }
 ```
 
-See full props and theming options in the [Buttons & Branding guide](/docs/base-account/reference/ui-elements/buttons-and-branding).
+See full props and theming options in the [Button Reference](/base-account/reference/ui-elements/base-pay-button) and [Brand Guidelines](/base-account/reference/ui-elements/brand-guidelines).
 
 ## Test on Base Sepolia
 

docs/base-account/guides/authenticate-users.mdx

@@ -142,6 +142,25 @@ app.post('/auth/verify', async (req, res) => {
 app.listen(3001, () => console.log('Auth server listening on :3001'));
 ```
 
+## Add the Base Sign In With Base Button
+
+Use the pre-built component for a native look-and-feel:
+
+```tsx title="Checkout.tsx"
+import { SignInWithBaseButton } from '@base-org/account-ui/react';
+
+export function Checkout() {
+  return (
+    <SignInWithBaseButton
+      colorScheme="light"
+      onClick={() => signInWithBase()}
+    />
+  );
+}
+```
+
+See full props and theming options in the [Button Reference](/base-account/reference/ui-elements/sign-in-with-base-button) and [Brand Guidelines](/base-account/reference/ui-elements/brand-guidelines).
+
 import PolicyBanner from "/snippets/PolicyBanner.mdx";
 
 <PolicyBanner />

docs/base-account/guides/sub-accounts/add-sub-accounts-to-onchainkit.mdx

@@ -57,10 +57,27 @@ npm @coinbase/wallet-sdk@canary install
 
 Make sure to delete the `node_modules` folder and `package-lock.json` file before re-installing the dependencies after running the command above.
 
-```bash
+<CodeGroup>
+```bash npm
 rm -rf node_modules package-lock.json
 npm install
 ```
+
+```bash pnpm
+rm -rf node_modules pnpm-lock.yaml
+pnpm install
+```
+
+```bash yarn
+rm -rf node_modules yarn.lock
+yarn install
+```
+
+```bash bun
+rm -rf node_modules bun.lockb
+bun install
+```
+</CodeGroup>
 </Warning>
 
 <Check>

docs/base-account/improve-ux/batch-transactions.mdx

@@ -10,10 +10,24 @@ You can submit batch transactions by using the `wallet_sendCalls` RPC method, de
 
 Install the Base Account SDK:
 
-```bash
+<CodeGroup>
+```bash npm
 npm install @base-org/account
 ```
 
+```bash pnpm
+pnpm add @base-org/account
+```
+
+```bash yarn
+yarn add @base-org/account
+```
+
+```bash bun
+bun add @base-org/account
+```
+</CodeGroup>
+
 ## Setup
 
 ### Initialize the SDK

docs/base-account/improve-ux/sponsor-gas/paymasters.mdx

@@ -82,10 +82,24 @@ the [Base Go Gasless page](/cookbook/go-gasless).
 
   ### Installation
 
-  ```bash
+  <CodeGroup>
+  ```bash npm
   npm install @base-org/account
   ```
 
+  ```bash pnpm
+  pnpm add @base-org/account
+  ```
+
+  ```bash yarn
+  yarn add @base-org/account
+  ```
+
+  ```bash bun
+  bun add @base-org/account
+  ```
+  </CodeGroup>
+
   ### Initialize the SDK
 
   ```tsx

docs/base-account/improve-ux/sub-accounts.mdx

@@ -31,10 +31,24 @@ If you would like to see a live demo of Sub Accounts in action, check out our [S
 
 Install the Base Account SDK:
 
-```bash
+<CodeGroup>
+```bash npm
 npm install @base-org/account
 ```
 
+```bash pnpm
+pnpm add @base-org/account
+```
+
+```bash yarn
+yarn add @base-org/account
+```
+
+```bash bun
+bun add @base-org/account
+```
+</CodeGroup>
+
 ## Basic Setup
 
 ### Initialize the SDK

docs/base-account/quickstart/web.mdx

@@ -6,10 +6,24 @@ This quick-start shows the **minimum** code required to add Sign in with Base an
 
 ## 1. Install the SDK
 
-```bash
+<CodeGroup>
+```bash npm
 npm install @base-org/account
 ```
 
+```bash pnpm
+pnpm add @base-org/account
+```
+
+```bash yarn
+yarn add @base-org/account
+```
+
+```bash bun
+bun add @base-org/account
+```
+</CodeGroup>
+
 If you prefer a CDN import, you can skip the install step and replace the `import` line below with:
 
 ```html

docs/base-account/reference/ui-elements/base-pay-button.mdx

@@ -13,10 +13,24 @@ If you intend on using the BasePayButton, please follow the [Brand Guidelines](/
 
 ## Installation
 
-```bash
+<CodeGroup>
+```bash npm
 npm install @base-org/account-ui
 ```
 
+```bash pnpm
+pnpm add @base-org/account-ui
+```
+
+```bash yarn
+yarn add @base-org/account-ui
+```
+
+```bash bun
+bun add @base-org/account-ui
+```
+</CodeGroup>
+
 ## Basic Usage
 
 ```tsx