Fixes

[aelmanaa]

This pull request centralizes design tokens for branding and color themes by moving them to the shared-brand package, updates all app and component styles to use these shared tokens, and improves Solana transaction reliability with a retry mechanism. It also updates branding across the apps, including titles and favicons, and ensures all packages consistently depend on the new shared-brand package.

Branding and Design Token Centralization

• Moved all design tokens (colors, fonts, backgrounds, etc.) from shared-components to shared-brand, making shared-brand the single source of truth for styles. All apps and components now import tokens from @ccip-examples/shared-brand/design-tokens.css. (packages/shared-components/src/styles/globals.css, packages/shared-brand/src/design-tokens.css, packages/shared-components/src/styles/tokens.css, [1] [2] [3] [4] [5] [6]
• Updated the BRAND_COLORS object in shared-brand to include new variants (hover, background, shadow, tertiary, success/warning hover) for use in apps and components. (packages/shared-brand/src/index.ts, [1] [2]
• All CSS and component files now use var(--color-primary-bg) instead of var(--color-primary-light) for background color, reflecting the new design tokens. (examples/03-multichain-bridge-dapp/src/components/transaction/TransactionHistory.module.css, packages/shared-components/src/FeeTokenOptions.module.css, packages/shared-components/src/bridge/BridgeForm.module.css, packages/shared-components/src/primitives/Alert.module.css, [1] [2] [3] [4] [5]
• Updated button and border colors to use new primary color values. (packages/shared-components/src/ErrorBoundary.tsx, packages/shared-components/src/bridge/WalletConnect.module.css, [1] [2]

Dependency and Import Updates

• All app and component packages now depend on @ccip-examples/shared-brand, and import tokens or color objects from it. (examples/02-evm-simple-bridge/package.json, examples/03-multichain-bridge-dapp/package.json, packages/shared-components/package.json, [1] [2] [3]
• Removed the old tokens.css from shared-components and replaced its usage with the new shared-brand tokens. (packages/shared-components/package.json, [1] [2] [3]

App Branding Updates

• Updated app titles and branding to match new naming conventions, and added favicons to both apps using the shared-brand package. (examples/02-evm-simple-bridge/index.html, examples/03-multichain-bridge-dapp/index.html, [1] [2]
• Updated header titles in the multichain bridge app to "Multichain Family Bridge". (examples/03-multichain-bridge-dapp/src/App.tsx, examples/03-multichain-bridge-dapp/src/App.tsxL125-R126)
• Added favicon asset to shared-brand package exports. (packages/shared-brand/package.json, packages/shared-brand/package.jsonL12-R13)

Theme Usage in Components

• All theme providers (RainbowKit, etc.) now use BRAND_COLORS.primary for accent colors instead of hardcoded values, ensuring consistent branding. (examples/02-evm-simple-bridge/src/App.tsx, examples/03-multichain-bridge-dapp/src/App.tsx, [1] [2] [3] [4]

Solana Transaction Reliability Improvements

• Added a retry loop for Solana transfers to handle blockhash expiration errors during both send and confirmation steps, improving user experience and transaction reliability. (examples/03-multichain-bridge-dapp/src/hooks/useSolanaTransfer.ts, [1] [2] [3]

These changes ensure a consistent look and feel across all apps and components, simplify maintenance by centralizing style tokens, and improve reliability for Solana transfers.

[github-actions]

👋 aelmanaa, thanks for creating this pull request!

To help reviewers, please consider creating future PRs as drafts first. This allows you to self-review and make any final changes before notifying the team.

Once you're ready, you can mark it as "Ready for review" to request feedback. Thanks!