maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fixed accessibilty issue with empty link on featured post. (#10005)

Browse source
This commit is contained in:
Nick Taylor 2020-08-26 09:17:32 -04:00 • committed by GitHub
parent bd78ba4c2c
commit 08269fb704
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 24 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
app/assets/stylesheets/components/stories.scss
View file

@ -54,17 +54,14 @@
// Cover section for promoted (first) card.
&__cover {
display: block;
width: 100%;
height: auto;
padding-bottom: 42%;
background-size: cover;
background-position: center center;
&__image {
width: 100%;
height: auto;
padding-bottom: 42%;
background-size: cover;
background-position: center center;
@media (min-width: $breakpoint-m) {
border-radius: var(--radius) var(--radius) 0 0;
}
@media (min-width: $breakpoint-m) {
border-radius: var(--radius) var(--radius) 0 0;
}
}

20
app/javascript/articles/__tests__/__snapshots__/Article.test.jsx.snap
View file

@ -17,12 +17,14 @@ Object {
<a
class="crayons-story__cover"
href="/some-post/path"
style="background-image: url(/images/10.png);"
title="Unbranded Home Loan Account"
>
<div
class="crayons-story__cover__image"
style="background-image: url(/images/10.png);"
/>
<span
class="hidden"
>
Unbranded Home Loan Account
</span>
</a>
<div
class="crayons-story__body"
@ -225,12 +227,14 @@ Object {
<a
class="crayons-story__cover"
href="/some-post/path"
style="background-image: url(/images/10.png);"
title="Unbranded Home Loan Account"
>
<div
class="crayons-story__cover__image"
style="background-image: url(/images/10.png);"
/>
<span
class="hidden"
>
Unbranded Home Loan Account
</span>
</a>
<div
class="crayons-story__body"

6
app/javascript/articles/components/ArticleCoverImage.jsx
View file

@ -7,11 +7,9 @@ export const ArticleCoverImage = ({ article }) => {
href={article.path}
className="crayons-story__cover"
title={article.title}
style={{ backgroundImage: `url(${article.main_image})` }}
>
<div
style={{ backgroundImage: `url(${article.main_image})` }}
className="crayons-story__cover__image"
/>
<span class="hidden">{article.title}</span>
</a>
);
};

5
app/views/articles/_single_story.html.erb
View file

@ -3,8 +3,9 @@
<div id="featured-story-marker" data-featured-article="articles-<%= story.id %>"></div>
<% end %>
<% if featured == true || (feed_style_preference == "rich" && story.main_image.present?) %>
<a href="<%= story.path %>" class="crayons-story__cover" aria-label="article">
<div style="background-color: <%= story.main_image_background_hex_color %>; background-image: url(<%= cloud_cover_url(story.main_image) %>);" class="crayons-story__cover__image"></div>
<a href="<%= story.path %>" title="<%= story.title %>" class="crayons-story__cover" aria-label="article"
style="background-color: <%= story.main_image_background_hex_color %>; background-image: url(<%= cloud_cover_url(story.main_image) %>);" class="crayons-story__cover__image">
<span class="hidden"><%= story.title %></span>
</a>
<% end %>