582277 - :-moz-submit-invalid default style

Status: RESOLVED FIXED

(Core :: Layout: Form Controls, defect)

Description

[Mounir Lamouri (:mounir)]

For bug 561636 we want a default :-moz-submit-invalid style.

According to limi's mockup it could be:
-moz-box-shadow 0 0 2px red;

But that may be too close to the default :invalid style and confuse the user.

Is that a valid concern? If yes, should we move to something else? (like some transparency + a light red glow?)

Comment 1

[Jonas Sicking (:sicking) No longer reading bugmail consistently]

My understanding was that it was intentional that the two were the same. I don't think the user will get confused and think that he/she needs to enter something into the button :)

Comment 2

[Mounir Lamouri (:mounir)]

(In reply to comment #1)
> My understanding was that it was intentional that the two were the same. I
> don't think the user will get confused and think that he/she needs to enter
> something into the button :)

You should know that a button can be invalid ;) (actually, that should be removed from the specs, there is no reason)

limi and dolske, using the same style as the invalid elements sounds good for you?

Comment 3

[Justin Dolske [:Dolske]]

Err, I'm a bit confused. :moz-submit-invalid was needed because :invalid doesn't apply to <button>s per the spec, right?

But yes, the intention was that the button's (default) style should be consistent with the (default) invalid form elements.

Comment 4

[Mounir Lamouri (:mounir)]

(In reply to comment #3)
> Err, I'm a bit confused. :moz-submit-invalid was needed because :invalid
> doesn't apply to <button>s per the spec, right?

No, :-moz-submit-invalid is needed to style a submit button when the form is not valid. It hasn't the same meaning than :invalid which means the element is not valid. Apply :invalid style on the submit button to show that the form is invalid should have been a bad idea.

> But yes, the intention was that the button's (default) style should be
> consistent with the (default) invalid form elements.

Ok.

Comment 5

[Mounir Lamouri (:mounir)]

Attachment: Patch v1

Very small patch to use -moz-box-shadow for submit controls when the form is invalid like we do for invalid elements.

Comment 6

[Mounir Lamouri (:mounir)]

David, it would be nice if you can found 5 minutes on Friday to review this so I can push it for beta6.

Comment 7

[David Baron :dbaron: (⌚️UTC-5, no longer working on Mozilla)]

Comment on attachment 473960 [details] [diff] [review]
Patch v1

r=dbaron

Comment 8

[Mounir Lamouri (:mounir)]

Pushed:
http://hg.mozilla.org/mozilla-central/rev/48a6e53a710f

Would be nice to have the doc saying that you can override the default style with:
:-moz-submit-invalid {
  -moz-box-shadow: none;
  box-shadow: none;
}

Comment 9

[Eric Shepherd [:sheppy]]

This is noted in:

https://developer.mozilla.org/en/CSS/%3a-moz-submit-invalid