Default dropdown style for <select> element in firefox needs to be removed
Closed this issue · 1 comments
Task: Default dropdown style for element in firefox needs to be removed Description The default dropdown style for element in firefox needs to be removed.
Steps to Reproduce
Open a file with a element in firefox to see the issue. Here is a screenshot of it in the Join & Renew Project:
Expected Result
I expect to see the default drowndown arrow that firefox uses for elements gone, with just the image of a dropdown arrow that is in the stylguide remaining. Here is what the fix looks like in the Join & Renew project:
Actual Result
I am seeing the expected result.
Relevant Screenshots/GIFs
Please see the above screenshots.
Additional Notes
Anything more to add? Nope!
Task/Feature Request
No pattern needs to be created. These three lines of code need to be added to the forms.scss file in the styles for the select element:
-moz-appearance: none; /removes default dropdown arrow in Firefox/
text-indent: 0.01px; /removes default dropdown arrow in Firefox/
text-overflow: ''; /removes default dropdown arrow in Firefox/
Components of the pattern
Ex:
- Molecule 1
- Atom 1
- Atom 2
- Molecule 2
- Atom 1
- Atom 2
User Story
Ex:
- As an anonymous user
- I want to see this organism on this page
- so that I can know things that the organism is supposed to tell me.
Acceptance Criteria
When I open an AMA page on firefox, I should not see firefox's default dropdown arrow. I should only see the dropdown icon used in the AMA styleguide.