Skip to content

Update logo in README#5298

Merged
mattt merged 1 commit intomainfrom
mattt/update-logo
Jun 23, 2022
Merged

Update logo in README#5298
mattt merged 1 commit intomainfrom
mattt/update-logo

Conversation

@mattt
Copy link
Contributor

@mattt mattt commented Jun 22, 2022

The logo used in the current README hardcodes the fill value for its text to #24292E. This causes the text to have a contrast ratio of 1.02:1 against its background color (#22272E) when viewed in dark mode.

README before

This PR updates the README to replace the <img> element with a <picture> containing image sources with light and dark media queries. 1

<h1 align="center">
    <picture>
        <source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/7659/174594540-5e29e523-396a-465b-9a6e-6cab5b15a568.svg">
        <source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/7659/174594559-0b3ddaa7-e75b-4f10-9dee-b51431a9fd4c.svg">
        <img src="https://user-images.githubusercontent.com/7659/174594540-5e29e523-396a-465b-9a6e-6cab5b15a568.svg" alt="Dependabot" width="336">
    </picture>
</h1>

The embedded SVGs are uploaded directly to GitHub, whereas the previous was hot-linked from our AWS bucket.

Here's how the README looks after applying these changes:

README after

Footnotes

  1. https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#specifying-the-theme-an-image-is-shown-to

Replace SVG with version that uses light text in dark mode

Use picture element with media queries
@mattt mattt requested a review from a team as a code owner June 22, 2022 16:39
Copy link
Contributor

@landongrindheim landongrindheim left a comment

Choose a reason for hiding this comment

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

🌚 -> 😄
🌞 -> 😄

@mattt mattt merged commit 69c8c38 into main Jun 23, 2022
@mattt mattt deleted the mattt/update-logo branch June 23, 2022 00:59
@Nishnha Nishnha mentioned this pull request Jun 24, 2022
jeffwidman added a commit to dependabot/fetch-metadata that referenced this pull request Sep 18, 2022
The current logo is broken. So replace with the new one.

Copied from dependabot/dependabot-core#5298.

🎩 💁‍♂️  to @mattt 's attention to detail including supporting both light and dark themes.
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