Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Adjust style of input elements to Firefox ones #44

Open
rugk opened this issue Apr 23, 2018 · 4 comments · May be fixed by #97
Open

Adjust style of input elements to Firefox ones #44

rugk opened this issue Apr 23, 2018 · 4 comments · May be fixed by #97
Assignees
@rugk
Labels
blocked This issue is blocked by something from the outside and cannot be done currently. enhancement New feature or request

Comments

@rugk
Copy link
Owner

rugk commented Apr 23, 2018

Again as about:preferences does it, or, as the Photon styling guide states how it should be done.

This may require quite "much" CSS, but it can partically be taken from the linked photon site.

It should be applied to: checkboxes, radio elements, etc.

Note that it my look strange when it is applied to one element, but not all elements. So it needs to be done for all of them.

May be done in conjunction with #43.
@rugk rugk added the enhancement New feature or request label Apr 23, 2018
@rugk
Copy link
Owner Author

rugk commented Apr 23, 2018 •
edited

Note that as of Firefox 60 the photon design has not really been applied to the elements on the options page or so… So maybe be wait or use the "old" design. (I assume the design will be adjusted, later.)

@rugk
Copy link
Owner Author

rugk commented May 6, 2018

Uuuuh… wait… I cannot read the doc.

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/user_interface/Browser_styles says the class browser-style still needs to be applied to some elements to work…

image

So this is way easier than I thought. 😄
And there they actually follow the Photon design (for checkboxes e.g.) – in contrast to the built-in settings page in Firefox. 😆

@rugk rugk added the good first issue Good for newcomers label May 6, 2018
@rugk rugk added this to the 1.2 milestone May 6, 2018
@rugk
Copy link
Owner Author

rugk commented May 6, 2018 •
edited

It may still require some tweaking so you cannot just stupidly apply the class. E.g. this one looks crazy when applied to my select element:
image

And it seems to make checkboxes (and other elements?) un-focusable (or one just does not see it?), so maybe tab-index needs to be set again.

@rugk rugk self-assigned this Jun 3, 2018
@rugk rugk linked a pull request Jun 3, 2018 that will close this issue
Open
@rugk
Copy link
Owner Author

rugk commented Jun 3, 2018

So actually the issues I saw are Firefox issues.

In the PR #97 I've listed these bug reports. At least the accessibility issue with the not focusable elements makes this a blocking problem for now, so this won't be included in the v1.2.

@rugk rugk added blocked This issue is blocked by something from the outside and cannot be done currently. and removed good first issue Good for newcomers labels Jun 3, 2018
@rugk rugk removed this from the 1.2 milestone Jun 3, 2018
@rugk rugk mentioned this issue Oct 31, 2018
Merged
@rugk rugk mentioned this issue Mar 14, 2019
Merged
@rugk rugk mentioned this issue Sep 29, 2023
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@rugk rugk

Labels
blocked This issue is blocked by something from the outside and cannot be done currently. enhancement New feature or request
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Use browser-style for options rugk/offline-qr-code
1 participant
@rugk