Re: [pgAdmin][RM5133] UI Improvements for White and Dark Theme

Hi Hackers,

Attached is the updated patch. Please find the inline comments below.

On Fri, Feb 21, 2020 at 1:15 PM Akshay Joshi <akshay(dot)joshi(at)enterprisedb(dot)com>
wrote:

> Hi Aditya
>
> On Thu, Feb 20, 2020 at 1:07 PM Aditya Toshniwal <
> aditya(dot)toshniwal(at)enterprisedb(dot)com> wrote:
>
>> Hi Hackers,
>>
>> Attached is the patch to make improvements in the UI for both default and
>> dark themes. Changes include:
>> 1) All the checkboxes are customized now to use theme colors.
>>
>
> All the checkboxes on Server dialog are not selectable. Connect Now,
> Save Password, etc...
>
Fixed.

> 2) Switch boxes will use newly introduced ternary color as the off color
>> instead of primary.
>>
>
> The switch box on the Query History tab is still having old color.
> Please verify the other switch boxes.
>
Fixed.

>
>>
> 2) "No data" status UI change on dependents, dependency, properties and
>> other places.
>> 3) Event trigger -> Definition input fields UI changes. Document changed.
>> 4) Schema diff cosmetic improvements along with support for dark theme.
>>
>
>
> - Remove the background-color when selecting the checkbox.
>
> Done.

>
> - Can we change the checkbox(with purple color)? It is not
> automatically selected/deselected when we select/deselect all the objects.
>
>
> The problem is, the underlying library used for the checkboxes does not
provide any API to customize it. I tried some hacky ways to do it, but I
was able to partially change the checkboxes in the grid. So, I reverted
back.

> [image: Screenshot 2020-02-21 at
> 12.08.00 PM.png]
>
> - In Dark Theme object's text is not readable. See the below
> screenshot.
>
> Fixed.

> [image: Screenshot 2020-02-21 at 12.29.58 PM.png]
>
>
>> 5) Improve Style of Dark Mode Code Highlight After Query Execution. Fixes
>> #4996.
>> 6) Background for geometry viewer changed to use #fff for all themes.
>> This will allow it to look cleaner. Fixes #5077.
>> 7) Select2 dropdown selected and hovered item should will have different
>> colors. Also tweaked the tags appearance in multi select boxes. Fixes #4955.
>>
>
> The hover color looks very light, can we make it a bit dark?
> [image: Screenshot 2020-02-21 at 12.07.26 PM.png]
>
Done. Note that, this is in sync with tree hover/selection colors.

> 8) Source code pro font updated to latest version to fix firefox monospace
>> issue. Fixes #5184.
>> 9) Other accessibility and cosmetic changes wherever needed.
>>
>> Thanks @Chethana Kumar <chethana(dot)kumar(at)enterprisedb(dot)com> for your
>> suggestions and inputs. :)
>>
>> Kindly review.
>>
>
> Apart from that, there is a white border visible for the Default
> Privileges tab in all the dialogs wherever applicable.
>
Fixed.

> [image: Screenshot 2020-02-21 at 12.33.32 PM.png]
>
> Feature tests are failing, please fix them.
>
The test cases seems to be working fine on my system. :/

>
>> --
>> Thanks and Regards,
>> Aditya Toshniwal
>> pgAdmin Hacker | Sr. Software Engineer | EnterpriseDB India | Pune
>> "Don't Complain about Heat, Plant a TREE"
>>
>
>
> --
> *Thanks & Regards*
> *Akshay Joshi*
>
> *Sr. Software Architect*
> *EnterpriseDB Software India Private Limited*
> *Mobile: +91 976-788-8246*
>

--
Thanks and Regards,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Engineer | EnterpriseDB India | Pune
"Don't Complain about Heat, Plant a TREE"