In bug 1059336, it would have been really helpful to have been able to include shared/style/buttons.css directly to get button styling for free. Unfortunately, the CSS in this file is overly broad and matches several button elements within the dialer which we don't want styled. For now, we fixed this by copying and pasting some styles from shared/style/buttons.css into apps/communications/dialer/style/buttons.css, and making the selectors less overly broad. We can fix this two ways: 1) Sanitize the button elements in the dialer, i.e. rename them so that they don't match the button selectors in shared/style/buttons.css 2) Create a gaia_button web component and use this for buttons that we want styled, since this would sandbox the styles.

We can get started on this sooner, but I don't think it's doable within this sprint.

Comment on attachment 8499526 [details] patch in github Hi Doug, With this patch, I have tried to sanitize the buttons. Now, the visualization is correctly. Could you check it? Thanks.

Comment on attachment 8499526 [details] patch in github Removing `role="button"` breaks a11y. I also think that needing the `[hidden] { display: none; }` rule is a good sign that we're doing something wrong. Unfortunately, I don't see a way to do this that won't be extremely backwards and awkward. We don't have a gaia_button web component yet, so maybe it's time to introduce that. I'm a bit surprised that we don't have this already. My guess is that this particular scenario doesn't happen much, and compartmentalizing a button is generally overkill. Wilson, does this seem reasonable to you?

Also bringing in Yura to confirm that we shouldn't be removing `role="button"` attributes.

(In reply to Doug Sherk (:drs) from comment #5) > Also bringing in Yura to confirm that we shouldn't be removing > `role="button"` attributes. Yeah in case where's it's applied on a div it will break a11y. It is redundant with the button element so should be OK to remove (unless there's some styling that depends on it and will be updated after bug 1074224 lands, it updates this block too so [role="button"] would no longer affect the styling).

(In reply to Doug Sherk (:drs) from comment #4) > Comment on attachment 8499526 [details] > patch in github > > Removing `role="button"` breaks a11y. I also think that needing the > `[hidden] { display: none; }` rule is a good sign that we're doing something > wrong. > > Unfortunately, I don't see a way to do this that won't be extremely > backwards and awkward. We don't have a gaia_button web component yet, so > maybe it's time to introduce that. > > I'm a bit surprised that we don't have this already. My guess is that this > particular scenario doesn't happen much, and compartmentalizing a button is > generally overkill. > > Wilson, does this seem reasonable to you? <gaia-button> is coming in v2.2. All apps that use existing buttons.css will be required to migrate to the web-component. Perhaps it's best to wait for the component to land on master?

(In reply to Wilson Page [:wilsonpage] from comment #7) > <gaia-button> is coming in v2.2. All apps that use existing buttons.css will > be required to migrate to the web-component. Perhaps it's best to wait for > the component to land on master? Great! Is there a bug tracking this?

(In reply to Doug Sherk (:drs) from comment #8) > (In reply to Wilson Page [:wilsonpage] from comment #7) > > <gaia-button> is coming in v2.2. All apps that use existing buttons.css will > > be required to migrate to the web-component. Perhaps it's best to wait for > > the component to land on master? > > Great! Is there a bug tracking this? It's still in the early prototyping stage, but there will be bugs assigned once it's time to land in Gaia apps.

(In reply to Wilson Page [:wilsonpage] from comment #9) > It's still in the early prototyping stage, but there will be bugs assigned > once it's time to land in Gaia apps. Ok, since we don't have a way to track this, I'm setting a needinfo on you until bugs are filed. Paco: Looks like there's nothing to do here until that's ready.

Firefox OS is not being worked on