Adds bottom nav border in high contrast mode #4475
Conversation
|
Checkout your storybook preview here http://psammead-preview.tools.bbc.co.uk/4475 |
mukama
changed the title
package.json
Outdated
| @@ -86,7 +86,7 @@ | |||
| "@bbc/psammead-media-indicator": "6.1.0", | |||
| "@bbc/psammead-media-player": "5.1.0", | |||
| "@bbc/psammead-most-read": "6.0.28", | |||
| "@bbc/psammead-navigation": "9.1.1", | |||
| "@bbc/psammead-navigation": "9.1.2", | |||
There was a problem hiding this comment.
| "@bbc/psammead-navigation": "9.1.2", | |
| "@bbc/psammead-navigation": "9.2.0", |
I think this should be a minor package bump as component is changing behaviour (not just an internal bug fix) see https://semver.org/
There was a problem hiding this comment.
Great suggestion @andrewscfc. Thanks for the review
| @@ -3,6 +3,7 @@ | |||
| <!-- prettier-ignore --> | |||
| | Version | Description | | |||
| |---------|-------------| | |||
| | 9.1.2 | [PR#4475](https://github.com/bbc/psammead/pull/4475) Adds bottom nav border in high contrast mode | | |||
There was a problem hiding this comment.
| | 9.1.2 | [PR#4475](https://github.com/bbc/psammead/pull/4475) Adds bottom nav border in high contrast mode | | |
| | 9.2.0 | [PR#4475](https://github.com/bbc/psammead/pull/4475) Adds bottom nav border in high contrast mode | |
| @@ -1,6 +1,6 @@ | |||
| { | |||
| "name": "@bbc/psammead-navigation", | |||
| "version": "9.1.1", | |||
| "version": "9.1.2", | |||
There was a problem hiding this comment.
| "version": "9.1.2", | |
| "version": "9.2.0", |
|
Great, thanks @mukama Please could you confirm if this will be implemented across all page types? I will just check this is as expected in Edge on Windows in High Contrast Mode... I assume those screen shots are from Firefox with the colour preferences changed? |
|
I can confirm this looks as expected on the preview url in Edge and IE11 on Windows 10 in a custom high contrast mode. |
That is correct! The screenshots are from Firefox with custom colour preferences turned on |
Resolves #4291
Overall change:
This PR adds a bottom border to the navigation component. This is visible only in high contract mode.
Before
After
Code changes:
afterpseudo-element of with no height and a transparent background. This is only visible in high contrast mode.