Re: Dark mode styling for the website

On 1/5/23 5:21 AM, Dave Page wrote:
> 
> 
> On Thu, 5 Jan 2023 at 01:43, Jonathan S. Katz <jkatz@postgresql.org 
> <mailto:jkatz@postgresql.org>> wrote:
> 
>     On 1/4/23 5:18 AM, Dave Page wrote:

>      >     I'm not sure what you mean - maybe the Fontawesome icons? The
>      >     lightened text is defined in --a-fg-color, which does apply
>     to all
>      >     links. The rest of the text is off-white.
> 
>     Any of the blue text. Let's take the homepage for example, The <h2>
>     tags
>     use #2b6da3 whereas the links are now #699eca. I think we should be
>     consistent.
> 
> 
> OK, I'm confused. As far as I can see, they are both #699eca. 
> See --a-fg-color and --header-fg-color in 
> https://github.com/dpage/pgweb/blob/darkmode/media/css/main.css 
> <https://github.com/dpage/pgweb/blob/darkmode/media/css/main.css> (yes, 
> I know the commit has today's date on it, but that's because I rebased).

I believe this was my repo getting out of sync. Per off-list delivery of 
patch, this looks correct to me now.

> 
>     However,  we should show the icon of the mode you're currently in (e.g.
>     show the moon while you're in dark mode). That is a very common pattern
>     on the web.
> 
> 
> I think you might be confusing buttons with toggles here. Toggles show 
> the current state, so yes, most will show a moon icon or similar when 
> you're in dark mode and a sun when you're in light mode.
> 
> Icons on buttons are not the same though. They indicate what will happen 
> when you click the button; in this case, switch to the indicated mode.
> 
> Having a button icon that indicates the current state rather than the 
> state that will be shown if you click it goes against every example of 
> related design I can find. A good example is the Play button in Apple 
> Music. It will show the Play icon (the right-pointing solid triangle) 
> when nothing is playing, and changes to a pause icon (two vertical 
> rectangles) when something is playing.

I understand this interface style. My comment was that around the web 
for how people handled light/dark mode toggles, i.e. the trend was to 
show the "current" state. There are of course sites that follow the 
"music player" style interface as well.

I'll +0 this.

However, I'll +1 the application of the patch, with noted +0s above.

Thanks,

Jonathan