Re: [pgAdmin][RM5990]: Update the style guide on pgAdmin4 website - Mailing list pgadmin-hackers

From Nikhil Mohite
Subject Re: [pgAdmin][RM5990]: Update the style guide on pgAdmin4 website
Date
Msg-id CAOBg0APy7ONbPTFSHFqcvtYzDNKc7dSgv1Qz+Cg7kb_mF9p7gg@mail.gmail.com
Whole thread Raw
In response to Re: [pgAdmin][RM5990]: Update the style guide on pgAdmin4 website  (Dave Page <dpage@pgadmin.org>)
Responses Re: [pgAdmin][RM5990]: Update the style guide on pgAdmin4 website  (Dave Page <dpage@pgadmin.org>)
List pgadmin-hackers
Hi Dave/ Team,

On Thu, Aug 20, 2020 at 9:24 PM Dave Page <dpage@pgadmin.org> wrote:
Hi

Great, those issues look like they're fixed. Here's a v3 update;

- Wording tweaked.
- Link to Font Awesome added.
- HTML reformatted (mostly by Pycharm)
- </br> changed to <br/>
- s/ria-controls/aria-controls/g

There are a couple of things left I found that could do with some work:

- On the iconography section, the anchor tags to the sub-sections only work for the standard theme. should we split each set of icons out into separate pages (like the controls) rather than trying to have long pages with anchors?
1. updated this section, as per suggestion now loading only specific sections on icons similar to other controllers.

- The page names used in the view/templates and URLs is quite ugly. Could we change the names, and then use URL matching rather than GET parameters? e.g.

/styleguide/?tab=typg -> /styleguide/typography
/styleguide/?tab=thm&section=alrt -> /styleguide/themes/alerts
/styleguide/?tab=ic#custom_query_plan -> /styleguide/iconography/query_plans (assuming we split the icon pages)
2. Updated URLs from GET parameters to URL matching, also updated URLs for better reading and understanding.

PFA patch v4 for the same.


Thanks!

On Thu, Aug 20, 2020 at 1:01 PM Nikhil Mohite <nikhil.mohite@enterprisedb.com> wrote:
Hi Dave/Team,

I have updated the style guide as per the suggestions, PFA of the updated patch for the same.

On Thu, Aug 20, 2020 at 1:37 PM Dave Page <dpage@pgadmin.org> wrote:
Hi

On Wed, Aug 19, 2020 at 10:20 AM Nikhil Mohite <nikhil.mohite@enterprisedb.com> wrote:
Hi Dave/Team,

As per discussion with the UX team, Few updates on style-guide patch.
1. I have missed removing the "proposed" keyword from the "High-Contract" theme name.
1. Removed "proposed" keyword from the "High-Contrast" theme name. 

Right.
 
2. I have not added the "Writing Style" section in the style guide as we don’t have the information for it (UX design is also pending due to this). @Dave Page can you provide some inputs on it.

Sure; not sure how to deal with that yet - we'll proceed without it for now.

A couple of other issues I found:

- Random scrollbars:

Screenshot 2020-08-20 at 09.00.38.png
2. Resolved scrollbar issue. 

 - On the Menu section, there is a subsection for "Sub menus" (I realise you didn't design that, but...). That doesn't seem right; what is described as a sub menu there is actually a tab set. Can you move it to a separate section please?
3. Create a new section for "Tab Set" as suggested.

There are a few wording changes I'd like as well, but I can deal with that when I'm committing.

Nice work - thanks!



Regards,
Nikhil Mohite.

On Wed, Aug 19, 2020 at 11:40 AM Nikhil Mohite <nikhil.mohite@enterprisedb.com> wrote:
Hi Team,

I have updated the style guide for the pgAdmin 4 website as per RM-5990.
Details :
1. The updated style-guide section as per the new UI design.
2. Added new icons as per font-awesome 5.14.0.
3. Added custom icons of pgAdmin4.

PFA the patch.


Regards,
Nikhil Mohite.


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

EDB: http://www.enterprisedb.com



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

EDB: http://www.enterprisedb.com


Regards,
Nikhil Mohite 
Attachment

pgadmin-hackers by date:

Previous
From: Dave Page
Date:
Subject: Re: [pgAdmin][RM5990]: Update the style guide on pgAdmin4 website
Next
From: Akshay Joshi
Date:
Subject: Re: [pgAdmin][SonarQube]: Cognitive complexity