Skip to content
This repository has been archived by the owner on Aug 13, 2023. It is now read-only.

Add Link to Story Promo #513

Merged
merged 19 commits into from
May 20, 2019
Merged

Add Link to Story Promo #513

merged 19 commits into from
May 20, 2019

Conversation

DenisHdz
Copy link
Contributor

@DenisHdz DenisHdz commented May 10, 2019

Resolves #475 and #519

Overall change:
Add Link to the Story Promo component.

Code changes:

  • Create Link styled component
  • Add focus, hover and visited states
  • Use faux block link pattern to make the entire StoryPromo a link

  • I have assigned myself to this PR and the corresponding issues
  • Tests added for new features
  • Test engineer approval

@DenisHdz DenisHdz added the ws-home Tasks for the WS Home Team label May 10, 2019
@DenisHdz DenisHdz added this to the Story Promo (WS FP) milestone May 10, 2019
@DenisHdz DenisHdz self-assigned this May 10, 2019
j-pendlebury
j-pendlebury previously approved these changes May 10, 2019
@DenisHdz DenisHdz added the a11y Accessibility-related task label May 10, 2019
andrew-nowak
andrew-nowak previously approved these changes May 13, 2019
Copy link
Contributor

@andrew-nowak andrew-nowak left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

@DenisHdz DenisHdz added a11y-swarm An a11y swarm (clarify dev or full team in the desc) needs to be carried out before moving to test and removed a11y Accessibility-related task labels May 13, 2019
@DenisHdz DenisHdz removed the a11y-swarm An a11y swarm (clarify dev or full team in the desc) needs to be carried out before moving to test label May 14, 2019
j-pendlebury
j-pendlebury previously approved these changes May 15, 2019
@ghost
Copy link

ghost commented May 16, 2019

Update CHANGELOG.md heading from Psammead Media Indicator to Psammead Story Promo

Copy link

@ghost ghost left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@@ -33,6 +33,8 @@ const eightOfTwelveColumnsMaxScaleable = `66.67%`;
// (8 / 12) * 100 = 66.6666666667 = 66.67%

const StoryPromoWrapper = styled.div`
position: relative;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What's the reason this is needed for?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ahhh is it part of faux block link?

Copy link
Contributor Author

@DenisHdz DenisHdz May 17, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That is used to make the faux block link pattern work. If you don't apply it the clickable area is everything and not just the StoryPromoWrapper.

Copy link
Contributor

@pjlee11 pjlee11 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 👍

@jamesbrumpton
Copy link
Contributor

LGTM. Happy for this to be merged.

@DenisHdz DenisHdz merged commit bc91b2f into latest May 20, 2019
@DenisHdz DenisHdz deleted the story-promo-link branch May 20, 2019 06:21
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
ws-home Tasks for the WS Home Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add Link with hover and focus states to Story Promo
6 participants