?
avatar ggppdk
ggppdk
23 Jul 2016

Red

  • declares "danger"
  • is annoying to the eyes making them difficult to read (especially in large forms)

using gray should fix both the above ..., please see picture, thanks

not_enabled_choices

avatar ggppdk ggppdk - open - 23 Jul 2016
avatar yild
yild - comment - 23 Jul 2016

As programmer of the other language, for me gray means 'inactive' - control value/state that cannot be changed by user input (at least here you used dark gray .color...).

avatar ggppdk
ggppdk - comment - 23 Jul 2016

well

  • "disabled" (in-active) has a lower opacity
  • and can have the letters italic too ?
avatar brianteeman
brianteeman - comment - 23 Jul 2016

grey is not good idea as it implies disabled/inactive

On 23 July 2016 at 17:16, Georgios Papadakis notifications@github.com
wrote:

well

  • "disabled" (in-active) has a lower opacity
  • and can have the letters italic too ?


You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#11271 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABPH8UmrPqb6U9pmeohDCUXCa7_u_O0kks5qYjAxgaJpZM4JTX-C
.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
http://brian.teeman.net/

avatar ggppdk
ggppdk - comment - 23 Jul 2016

@brianteeman
yes you are right but

  • disabled is already differentiated via opacity (in current CSS)

not_enabled_choices2

avatar brianteeman
brianteeman - comment - 23 Jul 2016

That is far too subtle a difference and would fail all a11y tests

On 23 July 2016 at 17:35, Georgios Papadakis notifications@github.com
wrote:

@brianteeman https://github.com/brianteeman
yes you are right but

  • disabled is already differentiated via opacity (in current CSS)

[image: not_enabled_choices2]
https://cloud.githubusercontent.com/assets/5092940/17078761/30cdb0fa-5104-11e6-8334-d83fcc72d857.png


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#11271 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABPH8UUxSejnqopwQafRY8sh-Copb5xvks5qYjTCgaJpZM4JTX-C
.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
http://brian.teeman.net/

avatar yild
yild - comment - 23 Jul 2016

WCAG invalid.

avatar ggppdk
ggppdk - comment - 23 Jul 2016

@yild

WCAG invalid

?? !!
thanks for taking time to answer,

but please forget my specific suggestion of colors etc,

  • i just say that red is very annoying to the eye in big forms, and make large forms much less readable

please provide better alternatives

also default red / green is meaningless in situations like:

not_enabled_choices3

avatar Bakual
Bakual - comment - 23 Jul 2016

For Yes/No type buttons, red/green is fine and very intuitive
For "Normal/Reverse" and other such options it's indeed not that helpful. Maybe we could add a new class which has other colors and which can be applied to those btn-groups.

avatar ggppdk
ggppdk - comment - 23 Jul 2016

@backual
right, adding a new class for radio fields that are not "YES-NO" is another improvement

  • because currently adding "btn-group" behaves the same as: "btn-group btn-group-yesno" , which is obviously wrong ??
avatar dgt41
dgt41 - comment - 23 Jul 2016

how about parsing something "btn-group btn-group-success|warning" (I mean the success|warning part) and apply them as classes to each button. Could be done easily

avatar Bakual
Bakual - comment - 23 Jul 2016

because currently adding "btn-group" behaves the same as: "btn-group btn-group-yesno" , which is obviously wrong ??

btn-group-yesno makes the two buttons wider, so they are about the same width a regular input field. It looks a bit better in forms to have all the same width. The colors don't change there.

avatar ggppdk
ggppdk - comment - 23 Jul 2016

btn-group-yesno makes the two buttons wider

aaa yes, there is this difference,

Still the "btn-group" by itself applying this red/green is weird,
myself i overcome it by adding an extra CSS class, so not a problem of 3rd party extensions,

Just good for joomla UI to add some extra CSS class
for non yes-no fields that may have zero value, the zero value is now marked red, and the other are green which is as explained above meaningless

Adding an extra CSS class for this case will not introduce B/C styling issues with extensions too

avatar Bakual
Bakual - comment - 23 Jul 2016

The funny thing is that this coloring is actually done by JavaScript (by adding the Bootstrap btn-primary/danger/success classes). See https://github.com/joomla/joomla-cms/blob/staging/administrator/templates/isis/js/template.js#L28-L45

avatar ggppdk
ggppdk - comment - 23 Jul 2016

@backual
yes by JS

since i did not see anyone supporting the replacement of red color,
i will close this,

(and i do agree red/green is clear for yes-no cases, just a little annoying for some people in large forms)

thanks everyone for the comments

  • about adding the non-yes-no CSS class it is another topic, that would useful if added, with no B/C styling issues either, since it will be explicitely added when needed
avatar ggppdk ggppdk - change - 23 Jul 2016
Status New Closed
Closed_Date 0000-00-00 00:00:00 2016-07-23 17:34:12
Closed_By ggppdk
avatar ggppdk ggppdk - close - 23 Jul 2016
avatar ggppdk ggppdk - change - 24 Jul 2016
Status Closed New
Closed_Date 2016-07-23 17:34:12
Closed_By ggppdk
avatar ggppdk ggppdk - reopen - 24 Jul 2016
avatar ggppdk
ggppdk - comment - 24 Jul 2016

I have checked

  • default UI in my android (v4) tablet
  • and custom replacement UI made by ASUS in my android 5 mobile phone

both are using gray for non-enabled options,
someone should tell them that they have it wrong not filling the screen with nice red spots

avatar ggppdk ggppdk - change - 24 Jul 2016
Status New Closed
Closed_Date 0000-00-00 00:00:00 2016-07-24 09:27:54
Closed_By ggppdk
avatar ggppdk ggppdk - close - 24 Jul 2016
avatar brianteeman brianteeman - close - 24 Jul 2016
avatar brianteeman brianteeman - change - 25 Jul 2016
Labels Added: ?

Add a Comment

Login with GitHub to post a comment