Skip to content

Professional docs styling overhaul#10

Merged
whoabuddy merged 11 commits intomainfrom
feat/docs-styling-overhaul
Jan 30, 2026
Merged

Professional docs styling overhaul#10
whoabuddy merged 11 commits intomainfrom
feat/docs-styling-overhaul

Conversation

@whoabuddy
Copy link
Copy Markdown
Contributor

Summary

  • Header/Navigation: Reorder sidebar (Directory, Glossary, Networks, Tokens), increase site title and social icon sizes, add 44px touch targets
  • Hero Section: Replace awkward white-to-orange gradient with solid white, fix button contrast (white text on orange)
  • Links: Replace blue external link icons with subtle gray treatment
  • Tables: Add consistent cell padding for better readability
  • Mobile Menu: Fix highlight contrast (orange text on light orange background)
  • Content: Add USDCx bridge information, standardize endpoint tables in directory

Test plan

  • Run npm run dev and visually inspect all pages
  • Check header at desktop (1440px+) and mobile widths
  • Verify hero title is solid white, button text is readable
  • Confirm tables have comfortable padding on Directory, Tokens, Networks, Glossary
  • Test mobile menu highlight contrast
  • Run npm run build to verify no build errors

🤖 Generated with Claude Code

whoabuddy and others added 9 commits January 30, 2026 07:29
Update navigation order to improve information architecture by placing
the glossary earlier in the hierarchy for better discoverability.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Scale up "Docs" title to 1.25rem (mobile) and 1.5rem (desktop) for
better visual hierarchy and improved brand presence in the header.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Scale up GitHub and X icons to 1.25rem (mobile) and 1.5rem (desktop)
to improve visibility and match the updated site title sizing.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add minimum height and flex display to site title link to meet
WCAG 2.1 Level AA touch target requirements on mobile devices.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
1. Replaced white-to-orange gradient on hero h1 with clean,
   solid white text for a more professional appearance
2. Changed primary button text from black to white for better
   readability on orange background (4.77:1 contrast ratio,
   exceeding WCAG AA 4.5:1 standard)

Both changes improve visual clarity and accessibility while
maintaining the clean, professional aesthetic.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Change external link indicator from orange (inherited from link color)
to gray with slightly higher opacity for a more subtle, professional
appearance while maintaining distinction from internal links.

- Set explicit gray color (var(--sl-color-gray-3))
- Increase opacity from 0.6 to 0.7 for better visibility
- Maintains hover underline behavior for all content links

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Added padding to table headers (0.75rem vertical, 1rem horizontal) and
data cells (0.625rem vertical, 1rem horizontal) for improved readability
and visual comfort across all table instances.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Enhanced USDCx section in tokens.md with clearer bridging information
and 1:1 backing description similar to sBTC section.

Restructured AIBTC services endpoint lists in directory.md from bullet
points to consistent table format, improving readability and maintaining
visual consistency with ecosystem services section.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
@cloudflare-workers-and-pages
Copy link
Copy Markdown

cloudflare-workers-and-pages bot commented Jan 30, 2026

Deploying aibtc-docs with  Cloudflare Pages  Cloudflare Pages

Latest commit: 65c781f
Status: ✅  Deploy successful!
Preview URL: https://3eb20f66.aibtc-docs.pages.dev
Branch Preview URL: https://feat-docs-styling-overhaul.aibtc-docs.pages.dev

View logs

whoabuddy and others added 2 commits January 30, 2026 09:37
Header:
- Remove "Docs" text, keep logo only (replacesTitle)
- Increase social icon size and even spacing
- Remove divider after social icons

Hero:
- Left-align buttons and content
- No underline on hover for minimal buttons
- Bright orange hover state

Typography:
- Bump base font size (18px mobile, 19px desktop)
- Sidebar links use color change only, no background highlight
- Matches right TOC behavior for less eye strain

Layout:
- Wider content area (55-60rem max-width)
- Consistent section and paragraph spacing
- Better table and card grid margins

Content:
- Remove redundant Quick Reference Tokens table
- Add focused Quick Start with endpoints and SDKs
- Community section now uses cards

External links:
- Remove blue arrows from cards

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- SEO title: "Page | AIBTC" (was "Page |")
- Glossary: remove dead link to non-existent guide
- Directory: convert More section to LinkCards (.md → .mdx)
- Sidebar: force transparent background with !important
  to eliminate peachy highlight on all states

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
@whoabuddy whoabuddy merged commit c619483 into main Jan 30, 2026
1 check passed
@whoabuddy whoabuddy deleted the feat/docs-styling-overhaul branch January 30, 2026 21:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant