Re: [pgAdmin4][RM2927] Move all CSS into SCSS files for consistency and ease of colour maintenance etc.

Hi

That looks much better... but, did you get the right shades of grey? They
seem to have a slight green hint to them.

On Thu, Aug 16, 2018 at 10:42 AM, Aditya Toshniwal <
aditya(dot)toshniwal(at)enterprisedb(dot)com> wrote:

> Hi Dave/Hackers,
>
> Please find attached the updated patch.
>
> On Thu, Aug 16, 2018 at 1:45 PM, Dave Page <dpage(at)pgadmin(dot)org> wrote:
>
>> Hi
>>
>> On Thu, Aug 16, 2018 at 6:14 AM, Aditya Toshniwal <
>> aditya(dot)toshniwal(at)enterprisedb(dot)com> wrote:
>>
>>> Hi Dave,
>>>
>>> On Wed, Aug 15, 2018 at 9:31 PM, Dave Page <dpage(at)pgadmin(dot)org> wrote:
>>>
>>>> One more thought - can you please look at updating the style guide on
>>>> the website to be consistent? https://git.postgr
>>>> esql.org/gitweb/?p=pgadmin-www.git;a=summary
>>>>
>>> Yes. Will start working on this.
>>>
>>>>
>>>> Thanks.
>>>>
>>>>
>>>> On Wed, Aug 15, 2018 at 1:17 PM, Dave Page <dpage(at)pgadmin(dot)org> wrote:
>>>>
>>>>> Hi
>>>>>
>>>>> On Tue, Aug 14, 2018 at 6:41 PM, Aditya Toshniwal <
>>>>> aditya(dot)toshniwal(at)enterprisedb(dot)com> wrote:
>>>>>
>>>>>> Hi Hackers,
>>>>>>
>>>>>> Attached is the updated patch fixing the errors. I missed the linter
>>>>>> in webpack.config.js :(
>>>>>>
>>>>>
>>>>> That's better - thanks.
>>>>>
>>>>> A few thoughts:
>>>>>
>>>>> - The button bars now have the flat style, however disabled buttons
>>>>> are almost indistinguishable from enabled ones. If we're going to have a
>>>>> flatter style, then we need to make the foreground colour of the buttons
>>>>> much lighter when they're disabled.
>>>>>
>>>> I guess they are distinguishable :/ (below screenshots). Plus you will
>>> get a disabled mouse pointer on button hover (after I send the updated
>>> patch). If we need to change the colors of the button then we need to
>>> override bootstrap variables and compile the less files.
>>>
>>>
>>>
>> I mean the button bar on the Query Tool or Debugger (though I only looked
>> at the former).
>>
>> BTW, you should grab the Sim Daltonism app from the app store on your
>> Mac. It shows you what the colours would look like to people with different
>> types of colour-blindness. It's very useful.
>>
> I have over-riden bootstrap class
>
> for such buttons to make foreground more lighter. The app helped, thanks.
>
>>
>>
>>
>>>
>>>
>>>>
>>>>> - I'm not keen on using $color-white/$color-black. That pre-supposes
>>>>> what the colours are, in which case we might as well just hard-code the
>>>>> values. How about $color-foreground/$color-background?
>>>>>
>>>> foreground/background is a good idea. It will be helpful in theming if
>>> we want a dark theme. All need to use these variables in places where no
>>> backgroud/foreground color is set in CSS classes. Will work on this.
>>>
>>>
>>>>
>>>>> - One thing we may want to do in the future is to have the option for
>>>>> alternate themes (or at least just a dark one). Do you know (no need to do
>>>>> it now - I'm just asking) if we've got enough of the colours in
>>>>> _default_variables.scss (and overridden elsewhere) to be able to do that?
>>>>>
>>>> I have added few more variables and should be enough. pgAdmin4 has
> limited number of colors
>
> and the current variables should be enough.
>
>> I have covered all the hash codes used in pgAdmin4 defined CSS/SCSS
>>> files. But, if we want the complete theme then we need to override the
>>> external CSS or override the variables and compile the less/sass files
>>> (bootstrap). This is part is still not done.
>>>
>>
>> Ack. Personally, I'd love a dark theme. Or even pluggable themes. That
>> would be awesome - but we have more important work first.
>>
> Moving to Bootstrap 4 will make it more easier :P
>
>
>>
>>
>>>
>>>>>
>>>>>> I have noticed one more thing, templated CSS. We should remove it.
>>>>>> For now I have skipped template css from webpack bundling.
>>>>>>
>>>>>
>>>>> +1
>>>>>
>>>> Should this be done as part of this RM, or we need to create a separate
>>> one ?
>>>
>>
>> A separate one I think.
>>
> RM3574 <https://redmine.postgresql.org/issues/3574> created.
>
>
>>
>> Thanks!
>>
>>
>>>
>>>>> --
>>>>> Dave Page
>>>>> Blog: http://pgsnake.blogspot.com
>>>>> Twitter: @pgsnake
>>>>>
>>>>> EnterpriseDB UK: http://www.enterprisedb.com
>>>>> The Enterprise PostgreSQL Company
>>>>>
>>>>
>>>>
>>>>
>>>> --
>>>> Dave Page
>>>> Blog: http://pgsnake.blogspot.com
>>>> Twitter: @pgsnake
>>>>
>>>> EnterpriseDB UK: http://www.enterprisedb.com
>>>> The Enterprise PostgreSQL Company
>>>>
>>>
>>>
>>>
>>> --
>>> Thanks and Regards,
>>> Aditya Toshniwal
>>> Software Engineer | EnterpriseDB Software Solutions | Pune
>>> "Don't Complain about Heat, Plant a tree"
>>>
>>
>>
>>
>> --
>> Dave Page
>> Blog: http://pgsnake.blogspot.com
>> Twitter: @pgsnake
>>
>> EnterpriseDB UK: http://www.enterprisedb.com
>> The Enterprise PostgreSQL Company
>>
>
>
>
> --
> Thanks and Regards,
> Aditya Toshniwal
> Software Engineer | EnterpriseDB Software Solutions | Pune
> "Don't Complain about Heat, Plant a tree"
>

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

EnterpriseDB UK: http://www.enterprisedb.com
The Enterprise PostgreSQL Company