8000 feat: OCK theming by cpcramer · Pull Request #1354 · coinbase/onchainkit · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

feat: OCK theming #1354

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Alre 8000 ady on GitHub? Sign in to your account

Jump to bottom
Merged
merged 12 commits into from
Oct 11, 2024
Merged

feat: OCK theming #1354

merged 12 commits into from
Oct 11, 2024

Conversation

cpcramer
Copy link
Contributor
@cpcramer cpcramer commented Oct 3, 2024 •
edited
Loading

What changed? Why?
Add OnchainKit Theming Support.

  • Add appearance config support and ability to specify mode and theme.
  • Add default, base, cyberpunk, and minimal themes.
  • Update playground to have ComponentMode and ComponentTheme selection for testing.
  • Add useTheme hook
  • Update CSS variables to have ock prefix.
  • New Line and Icon variables.
  • General styling clean up and fixes.

Fast follows that must be merged prior to Tuesday's release:

General fast follows:

  • General styling cleanup
      <OnchainKitProvider
        apiKey={ENVIRONMENT_VARIABLES[ENVIRONMENT.API_KEY]}
        chain={base}
        appearance={{
          mode: 'auto',
          theme: 'default' 
        }}
      >
        {children}
      </OnchainKitProvider>
  • Themes: | 'base' | 'cyberpunk' | 'default' | 'minimal'
  • Modes: 'auto' | 'light' | 'dark'
/* Customize Theme */
/*
@layer base {
  :root,
  .default-light,
  .default-dark,
  .base,
  .cyberpunk,
  .minimal {
    --ock-bg-primary: red;
  }
} */
Screenshot 2024-10-09 at 9 15 35 PM Screenshot 2024-10-09 at 9 16 20 PM Screenshot 2024-10-09 at 9 16 41 PM

Notes to reviewers

How has it been tested?

@cpcramer cpcramer changed the title OCK theming 🚧 OCK theming Oct 3, 2024
@vercel Vercel
Copy link
vercel bot commented Oct 3, 2024 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
onchainkit-coverage ❌ Failed (Inspect) Oct 11, 2024 8:02pm
onchainkit-playground ✅ Ready (Inspect) Visit Preview ✅ 3 resolved Oct 11, 2024 8:02pm
onchainkit-routes ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 11, 2024 8:02pm

alessey
alessey approved these changes Oct 11, 2024
View reviewed changes
Copy link
Contributor
@alessey alessey left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🥇

@cpcramer cpcramer merged commit 79c8960 into main Oct 11, 2024
16 checks passed
@cpcramer cpcramer changed the title OCK theming feat: OCK theming Oct 11, 2024
This was referenced Oct 15, 2024
Merged
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@alessey alessey alessey approved these changes

@0xAlec 0xAlec 0xAlec approved these changes

@abcrane123 abcrane123 Awaiting requested review from abcrane123

Assignees
No one assigned
Labels
documentation Improvements or additions to documentation pkg: fund pkg: identity pkg: styles pkg: swap pkg: token pkg: wallet root
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@cpcramer @alessey @0xAlec @abcrane123
0