feature(storefront): BCTHEME-196 Create unified focus styling in Cornerstone #1812
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
Fixed next group of issues:
https://jira.bigcommerce.com/browse/BCTHEME-177
https://jira.bigcommerce.com/browse/BCTHEME-180
https://jira.bigcommerce.com/browse/BCTHEME-181
https://jira.bigcommerce.com/browse/BCTHEME-183
https://jira.bigcommerce.com/browse/BCTHEME-182
I took Chrome focus styles as a base and changed it outline color for it to be acceptable for light and dark themes.
We can use this focus styles as a base and rewrite it for custom cases if we will need
Tickets / Documentation
Ticket
Screenshots (if appropriate)
light theme contrast
![light_theme_contrast](https://user-images.githubusercontent.com/66325265/91833734-c03cc100-ec4f-11ea-9295-08af1fd3c5c9.png)
dark theme contrast
![dark_theme_contrast](https://user-images.githubusercontent.com/66325265/91833772-cc288300-ec4f-11ea-957f-448ede75709a.png)
carousel arrows focus
![carousel_arrows_focus](https://user-images.githubusercontent.com/66325265/91833999-2295c180-ec50-11ea-83be-02e161bf947f.png)
carousel dots focus
![carousel_dots_focus](https://user-images.githubusercontent.com/66325265/91834129-4c4ee880-ec50-11ea-92bc-4dc45d649be2.png)
cart buttons focus
![cart_buttons_focus](https://user-images.githubusercontent.com/66325265/91834283-802a0e00-ec50-11ea-9f39-ecbc214e79b5.png)
options focus
![options_focus](https://user-images.githubusercontent.com/66325265/91834445-b8c9e780-ec50-11ea-93c3-761b63146b1d.png)