Skip to content

docs: center the README logo and fix its size#1878

Merged
fengmk2 merged 1 commit into
mainfrom
docs/readme-logo-size
Jun 18, 2026
Merged

docs: center the README logo and fix its size#1878
fengmk2 merged 1 commit into
mainfrom
docs/readme-logo-size

Conversation

@hyf0

@hyf0 hyf0 commented Jun 18, 2026

Copy link
Copy Markdown
Contributor

Problem

The README logo renders too small and left-aligned:

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="/logo-dark.svg">
  <source media="(prefers-color-scheme: light)" srcset="/logo.svg">
  <img alt="Vite+" src="/logo.svg">
</picture>

logo.svg / logo-dark.svg have an intrinsic size of 103×15 (viewBox="0 0 103 15"). Embedding the <img> with no size constraint makes GitHub render it at that intrinsic ~15px height — roughly one line of body text — and the wordmark sits left-aligned rather than as a hero banner.

Fix

Mirror the vitejs/vite README header treatment:

  • center the logo in <p align="center">
  • link it to the homepage (https://viteplus.dev)
  • pin height="60" on the <img> (same value vite uses); at the 103:15 aspect ratio it renders ~412px wide
<p align="center">
  <a href="https://viteplus.dev" target="_blank" rel="noopener noreferrer">
    <picture>
      <source media="(prefers-color-scheme: dark)" srcset="/logo-dark.svg">
      <source media="(prefers-color-scheme: light)" srcset="/logo.svg">
      <img alt="Vite+" src="/logo.svg" height="60">
    </picture>
  </a>
</p>

The dark/light <source> mapping and the relative SVG paths are unchanged. Verified the markup survives GitHub's HTML sanitizer (the align and height attributes are preserved).

The logo SVG has an intrinsic size of 103x15, so embedding it without a
size constraint renders it at ~15px tall (about one line of body text)
and left-aligned. Mirror the vitejs/vite README treatment: center the
logo in a paragraph, link it to the homepage, and pin height=60.
@netlify

netlify Bot commented Jun 18, 2026

Copy link
Copy Markdown

Deploy Preview for viteplus-preview canceled.

Name Link
🔨 Latest commit b46f7cf
🔍 Latest deploy log https://app.netlify.com/projects/viteplus-preview/deploys/6a33f3469e432f00087d621b

@hyf0 hyf0 marked this pull request as ready for review June 18, 2026 13:51
@fengmk2 fengmk2 merged commit 30abad6 into main Jun 18, 2026
28 checks passed
@fengmk2 fengmk2 deleted the docs/readme-logo-size branch June 18, 2026 15:32
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