Re: [pgAdmin4][RM2927] Move all CSS into SCSS files for consistency and ease of colour maintenance etc.
Hi On Tue, Aug 14, 2018 at 6:41 PM, Aditya Toshniwal < aditya.toshni...@enterprisedb.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'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? - 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 noticed one more thing, templated CSS. We should remove it. For now > I have skipped template css from webpack bundling. > +1 -- Dave Page Blog: http://pgsnake.blogspot.com Twitter: @pgsnake EnterpriseDB UK: http://www.enterprisedb.com The Enterprise PostgreSQL Company
Re: [pgAdmin4][RM2927] Move all CSS into SCSS files for consistency and ease of colour maintenance etc.
One more thought - can you please look at updating the style guide on the website to be consistent? https://git.postgresql.org/gitweb/?p=pgadmin-www.git;a=summary Thanks. On Wed, Aug 15, 2018 at 1:17 PM, Dave Page wrote: > Hi > > On Tue, Aug 14, 2018 at 6:41 PM, Aditya Toshniwal enterprisedb.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'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? > > - 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 noticed one more thing, templated CSS. We should remove it. For >> now I have skipped template css from webpack bundling. >> > > +1 > > -- > 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
Re: [pgAdmin4][RM2927] Move all CSS into SCSS files for consistency and ease of colour maintenance etc.
Hi Dave, On Wed, Aug 15, 2018 at 9:31 PM, Dave Page wrote: > One more thought - can you please look at updating the style guide on the > website to be consistent? https://git.postgresql.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 wrote: > >> Hi >> >> On Tue, Aug 14, 2018 at 6:41 PM, Aditya Toshniwal < >> aditya.toshni...@enterprisedb.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'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 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. > >> >>> 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 ? > >> -- >> 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"