search

medic / cht-docs

Documentation site for the Community Health Tookit
https://docs.communityhealthtoolkit.org
13 stars 17 forks source link

Change favicon to match new CHT logo #900

Open abbyad opened 1 year ago

abbyad commented 1 year ago

Given the release of the new CHT logo, we should update the favicon for the docs site.

abbyad commented 1 year ago

The https://github.com/medic/cht-docs/commit/1641f05cb2ea222529ee4be0a91b7830e0d44fba commit was accidentally pushed to main instead of a PR. From my testing though it looks good, so I haven't reverted it to go through the PR process. @craig-landry, when you get a chance, can you confirm that it is looking alright on your side too?

Previously

image

With CHT Logo

image
craig-landry commented 1 year ago

@abbyad the new favicon shows as expected for me on Firefox 108.0.1 on Ubuntu Linux. image

2 items worth noting:

  1. I had to hard refresh to get the logo to show up as it was cached as the old logo.
  2. As you probably noticed, my Firefox dark theme (the default, I think) makes the logo less visible/attractive.

For that light/dark thing, my understanding is that browsers can choose to respect the media attribute for this like:

<link rel="icon" media="(prefers-color-scheme: dark)"  href="/icons/favicon-dark.png">
<link rel="icon" media="(prefers-color-scheme: light)"  href="/icons/favicon-light.png">

I went to edit the partial to give it a shot, but see we don't have such a partial where I think it comes from the base theme we inherit from. I don't know how to do the override on that. I've created https://github.com/medic/cht-docs/issues/924 so we can get to it in due time.

Cheesy dark mode joke:

Why do programmers prefer dark mode? Because light attracts bugs.

😆

craig-landry commented 1 year ago

Update: I got the theme and color thing worked out and opened https://github.com/medic/cht-docs/pull/925 @abbyad please have a look and review the PR.

abbyad commented 1 year ago

Thanks for the review. I agree it doesn't look great with all tab colors, so will look at other options.

To avoid maintaining the favicon partial, it would be preferable to have a logo that works in light and dark modes. Also, the dark/light mode doesn't match all scenarios, because the tabs could be dark due to a theme (or incognito mode) but the favicon served would be the regular one. I think we'd be better off with a single favicon that works well despite the color of the tab.