Skip to content

fix: use raw SVGs for platform logos in download dropdown#5174

Merged
ComputelessComputer merged 2 commits intomainfrom
fix/landing-platform-icons
May 4, 2026
Merged

fix: use raw SVGs for platform logos in download dropdown#5174
ComputelessComputer merged 2 commits intomainfrom
fix/landing-platform-icons

Conversation

@ComputelessComputer
Copy link
Copy Markdown
Collaborator

@ComputelessComputer ComputelessComputer commented May 4, 2026

Replaces the iconify glyphs (apple, windows, linux) in the hero download button + dropdown with raw Wikimedia SVGs via <img> — matching the existing octocat pattern in the same section. Fixes a ~1px vertical misalignment between the apple glyph and "Download for Apple Silicon" text, caused by iconify-icon's shadow-DOM SVG bearing not centering against the text cap-height. Windows and Linux keep their natural colors. Iconify import dropped from this file (still used by auth.tsx).


Note

Low Risk
Low risk UI-only change that swaps icon rendering in the home download button/dropdown; main risk is minor visual/CSP/regression due to external SVG image URLs.

Overview
Updates the home page download CTA to stop using @iconify-icon/react for Apple/Windows/Linux logos and instead render raw SVGs via <img> (removing the Icon import from index.tsx).

This adjusts sizing/styling (e.g., Apple icon inversion) to improve alignment/consistency with the existing GitHub logo approach while keeping the download links and menu behavior unchanged.

Reviewed by Cursor Bugbot for commit d41a21d. Bugbot is set up for automated code reviews on this repo. Configure here.

Swaps the four `simple-icons:*` iconify glyphs (apple, windows, linux)
for `<img>` tags pointing at Wikimedia Commons SVGs, matching the
existing GitHub octocat pattern in the same hero section.

The iconify-icon's apple glyph rendered ~1px above the optical center
of the adjacent text, which was visible as a vertical misalignment in
the "Download for Apple Silicon" button. `<img>` with the same source
the octocat uses centers cleanly with `items-center`.

The `Icon` import is no longer used in this file; `@iconify-icon/react`
remains a dep (still used by routes/auth.tsx).
@netlify
Copy link
Copy Markdown

netlify Bot commented May 4, 2026

Deploy Preview for hyprnote ready!

Name Link
🔨 Latest commit d41a21d
🔍 Latest deploy log https://app.netlify.com/projects/hyprnote/deploys/69f84353d77a9c00086bef2f
😎 Deploy Preview https://deploy-preview-5174--hyprnote.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

Copy link
Copy Markdown

@cursor cursor Bot left a comment

Choose a reason for hiding this comment

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

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit dd370b7. Configure here.

Comment thread apps/web/src/routes/index.tsx
@ComputelessComputer ComputelessComputer merged commit 2b244ba into main May 4, 2026
7 checks passed
@ComputelessComputer ComputelessComputer deleted the fix/landing-platform-icons branch May 4, 2026 09:49
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