Re: [pgAdmin][RM5990]: Update the style guide on pgAdmin4 website

Hi Team,

I have updated UI for the style guide, details as follow:
1. Resolved all UI changes suggested by Aradhana.
2. Added labels for query-tool and tree-views icons in iconography.

PFA patch v7 for the same.

If required any changes please let me know.

Regards,
Nikhil Mohite.

On Wed, Aug 26, 2020 at 6:34 PM Aradhana Birewar <
aradhana(dot)birewar(at)enterprisedb(dot)com> wrote:

> Hi Nikhil,
>
> I was going through the style guide, I have a few observations that I
> would like to share with you.
>
> 1. In the Typography section, for font size text, the Roboto font is
> not getting applied.
>
> [image: image.png]
>
> 2. In the Dropdown section, the expanded dropdown image
> appears vertically stretched.
>
> [image: image.png]
>
> 3. Tabs for navigating between themes need small UI modifications,
> only selected tab should have medium font-weight (font-weight: 500), others
> have normal font-weight.
> (font-weight: 400) Also selected tab bottom border should be the same
> as text width.
>
> [image: image.png]
> [image: Screenshot 2020-08-26 at 5.58.47 PM.png]
>
> 4. In the Toggle Buttons section, the title should be Toggle On.
>
> [image: image.png]
>
> Everything else looks great.
>
> Thanks and Regards,
> Aradhana
>
> On Wed, Aug 26, 2020 at 4:06 PM Dave Page <dpage(at)pgadmin(dot)org> wrote:
>
>> Thanks, applied with a few changes for consistency in the titles and 404
>> handling.
>>
>> On Wed, Aug 26, 2020 at 8:23 AM Nikhil Mohite <
>> nikhil(dot)mohite(at)enterprisedb(dot)com> wrote:
>>
>>> Hi Dave/Team,
>>>
>>> Updated the implementation for the set title of the page, for this, I
>>> have done a few changes in the flow.
>>> 1. Earlier we are using {% include %} for showing pages in the base
>>> page (styleguide/index.html) for a style guide but in the Django template
>>> we can't use {% block %} statement if we are adding page using "{% include
>>> %}".
>>> 2. To overcome this issue now using {% extends %} instead of {% include
>>> %}, For this added dynamic URL generation in views so instead of loading
>>> "index.html" of style guide we are loading specific component HTML file
>>> (e.g: typography.html) and that template extends the "index.html" of the
>>> style guide.
>>>
>>> PFA v6 patch for the same.
>>>
>>> If required any changes please let me know.
>>>
>>> Regards,
>>> Nikhil Mohite.
>>>
>>>
>>> On Tue, Aug 25, 2020 at 7:09 PM Dave Page <dpage(at)pgadmin(dot)org> wrote:
>>>
>>>> Hi
>>>>
>>>> On Tue, Aug 25, 2020 at 12:49 PM Nikhil Mohite <
>>>> nikhil(dot)mohite(at)enterprisedb(dot)com> wrote:
>>>>
>>>>>
>>>>> PFA v5 patch for the same.
>>>>>
>>>>> if required any updates in this please let me know.
>>>>>
>>>>
>>>> Hmm, yeah - that doesn't work for me I'm afraid; it's mixing content
>>>> with code.
>>>>
>>>> The titles should be defined in the HTML pages themselves. We do that
>>>> everywhere else by including a template block like the following in the
>>>> lowest level content:
>>>>
>>>> {% block title %}Contributing{% endblock %}
>>>>
>>>> And then in base.html:
>>>>
>>>> <title>{% block title %}{% endblock %}</title>
>>>>
>>>> --
>>>> 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
>>
>>