Skip to content

docs(readme): add animated donate badges themed to the vril.li brand - #11

Merged
VrilLabs merged 1 commit into
masterfrom
docs/animated-donate-badges
Aug 15, 2026
Merged

docs(readme): add animated donate badges themed to the vril.li brand#11
VrilLabs merged 1 commit into
masterfrom
docs/animated-donate-badges

Conversation

@VrilLabs

Copy link
Copy Markdown
Collaborator

Summary

  • Reviewed vril.li (VrilLabs' own site) to pull real design tokens: dark navy canvas (#080A0E#10131A gradient), teal/purple duo-accent (#00D9C0 / #9B5EFF), Inter body type, and the //-comment-prefixed uppercase eyebrow-label convention used throughout the site.
  • Added five self-contained animated SVG donate badges (assets/donate/*.svg), one per platform actually enabled in .github/FUNDING.yml: GitHub Sponsors, Open Collective, Ko-fi, Buy Me a Coffee, thanks.dev.
  • Each card has a pulsing accent glow, a slow diagonal shimmer sweep, and an animated dashed border chasing the perimeter — pure SMIL/CSS, so it animates correctly as a GitHub-rendered <img>.
  • Since one image can only link to one destination, each badge is its own file wrapped in its own markdown link — the correct way to get 5 distinct click targets (a single shared SVG isn't clickable per-region once rendered as <img>).
  • Placed the row directly under the top badge line, before the first divider — highest-visibility spot.

Test plan

  • Verified rendering against both GitHub light and dark theme backgrounds
  • Verified graceful wrapping at narrow/mobile widths
  • Confirmed no console/render errors when loaded as standalone <img> SVGs

🤖 Generated with Claude Code

Reviewed vril.li (VrilLabs' own site) to pull real design tokens rather
than guessing: dark navy canvas (#080A0E -> #10131A gradient), teal/purple
duo-accent (#00D9C0 / #9B5EFF), Inter body type, and the site's
`//`-comment-prefixed uppercase eyebrow-label convention used throughout
its badges and section headers.

Built five self-contained animated SVG cards (assets/donate/*.svg), one
per platform actually enabled in .github/FUNDING.yml (github, open_collective,
ko_fi, buy_me_a_coffee, thanks_dev - the commented-out platforms were
skipped). Each card has a pulsing accent glow behind its icon, a slow
diagonal shimmer sweep, and an animated dashed border that chases around
the perimeter (stroke-dashoffset animation) - all SMIL/CSS, so it animates
correctly when GitHub loads the file as an <img>.

Since a single flat image can only link to one destination, each badge is
its own file wrapped in its own markdown link - the standard, correct way
to get five distinct click targets in a README (one shared multi-link SVG
wouldn't be clickable per-region once rendered as an <img>).

Placed the row directly under the top badge line, before the first
divider - the highest-visibility spot, consistent with how most
sponsor-badge rows are placed in popular READMEs.

Verified rendering against both GitHub's light and dark theme backgrounds
and at narrow/mobile width (cards wrap gracefully with no layout system
beyond default inline image flow).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Copilot AI lite review requested due to automatic review settings August 15, 2026 04:10
@VrilLabs
VrilLabs merged commit e38009a into master Aug 15, 2026
6 checks passed
@VrilLabs
VrilLabs deleted the docs/animated-donate-badges branch August 15, 2026 04:11

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Pull request overview

Adds a set of branded, animated donation badges to the project README to improve visibility of existing funding options, while keeping each platform as a distinct clickable target.

Changes:

  • Inserted a short funding tagline and a row of five linked donate badges near the top of README.md.
  • Added five new self-contained animated SVG badge assets under assets/donate/, matching the platforms configured in .github/FUNDING.yml.

Reviewed changes

Copilot reviewed 1 out of 6 changed files in this pull request and generated no comments.

Show a summary per file
File Description
README.md Adds a prominent, linked row of donate badges under the existing top-of-readme badges.
assets/donate/github-sponsors.svg New animated SVG badge for GitHub Sponsors.
assets/donate/open-collective.svg New animated SVG badge for Open Collective.
assets/donate/ko-fi.svg New animated SVG badge for Ko-fi.
assets/donate/buy-me-a-coffee.svg New animated SVG badge for Buy Me a Coffee.
assets/donate/thanks-dev.svg New animated SVG badge for thanks.dev.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

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.

2 participants