Re: Dark mode styling for the website

On Fri, 4 Nov 2022 at 14:46, Dave Page <dpage(at)pgadmin(dot)org> wrote:

>
>
> On Thu, 3 Nov 2022 at 13:28, Dave Page <dpage(at)pgadmin(dot)org> wrote:
>
>>
>>
>> On Thu, 3 Nov 2022 at 11:09, David G. Johnston <
>> david(dot)g(dot)johnston(at)gmail(dot)com> wrote:
>>
>>> On Thu, Nov 3, 2022 at 8:04 AM Dave Page <dpage(at)pgadmin(dot)org> wrote:
>>>
>>>>
>>>>
>>>> On Thu, 3 Nov 2022 at 10:40, David G. Johnston <
>>>> david(dot)g(dot)johnston(at)gmail(dot)com> wrote:
>>>>
>>>>> On Thu, Nov 3, 2022 at 7:19 AM Dave Page <dpage(at)pgadmin(dot)org> wrote:
>>>>>
>>>>>>
>>>>>> On Wed, 26 Oct 2022 at 20:03, David G. Johnston <
>>>>>> david(dot)g(dot)johnston(at)gmail(dot)com> wrote:
>>>>>>
>>>>>>> I agree that the blue-black contrast (e.g., navigation) doesn't seem
>>>>>>> big enough and also that having the option to flip dark mode on or off on
>>>>>>> the website itself (cookie memory) would be especially nice. Having the
>>>>>>> only control (that I know of) be a system-wide dark mode setting is not
>>>>>>> desirable for me.
>>>>>>>
>>>>>>> I do appreciate the option and the work that has gone into it. Just
>>>>>>> needs a few more tweaks IMO (and some others).
>>>>>>>
>>>>>>
>>>>>> I haven't yet looked into increasing the contrast, but I have pushed
>>>>>> the beginnings of a patch to my dev branch that implements manual switching
>>>>>> that can override the auto-detected preference. It will use local storage
>>>>>> to record your preference for the next visit. You can try it out at:
>>>>>>
>>>>>> http://ec2-18-170-0-35.eu-west-2.compute.amazonaws.com
>>>>>>
>>>>>
>>>>>
>>>>> The sun icon looks very similar to the settings cog icon, which maybe
>>>>> gets the outcome (someone clicking it to see how to change the darkmode
>>>>> setting), but was a tiny bit confusing at first. The feature is new enough
>>>>> to me that I'm not really sure what the conventions are. Having the moon
>>>>> always visible but only a label, and then a left-right option toggle widget
>>>>> is maybe a bit uglier but seems more explicit in how to interact with it.
>>>>>
>>>>> Another icon thought, to leave the widget as just an icon, would be to
>>>>> always show a moon but use inverted color schemes. The existing dark moon
>>>>> in light mode then a light moon on dark background(with a white box border)
>>>>> while in dark mode.
>>>>>
>>>>
>>>> That's certainly doable, though it would require more CSS of course.
>>>> Another option would be to simply change the icon. There's a lightbulb one
>>>> that could work: https://fontawesome.com/v4/icon/lightbulb-o ?
>>>>
>>>
>>> The moon-only with coloring would just be two different icons as well
>>> (though it would be a custom icon versus two different standard ones so
>>> definitely not as easy). I do like the lightbulb over the sun icon. I'd
>>> go with it as the easier solution at this point.
>>>
>>
>> I've pushed this change to the dev branch and test site.
>>
>
> I've also now pushed another change to increase the contrast (Wave seems
> happy now).
>

Here's a patch that implements the manual switching and contrast changes.

The light-mode-only issue for users without JS still needs to be resolved
(if we actually care).

--
Dave Page
Blog: https://pgsnake.blogspot.com
Twitter: @pgsnake

EDB: https://www.enterprisedb.com