add skip link functionality to videos (#13113)

This commit is contained in:
Suzanne Aitchison 2021-03-26 09:23:45 +00:00 committed by GitHub
parent a5f014f576
commit 1f8f348d5d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 19 deletions

View file

@ -380,7 +380,7 @@ function fetchNextPageIfNearBottom() {
fetchNextPodcastPage(indexContainer);
};
} else if (indexWhich === 'videos') {
scrollableElem = document.getElementById('video-collection');
scrollableElem = document.getElementById('main-content');
fetchCallback = function fetch() {
fetchNextVideoPage(indexContainer);
};

View file

@ -20,22 +20,25 @@
<% end %>
<div class="home video-page-title" id="index-container" data-which="videos" data-params="<%= params.to_json(only: %i[tag username q]) %>">
<header>
<h1><%= community_name %> on Video</h1>
</header>
<div class="video-collection" id="video-collection">
<% @video_articles.each do |video_article| %>
<a class="single-video-article single-article" href="<%= video_article.path %>" id="video-article-<%= video_article.id %>">
<div class="video-image" style="background-image: url(<%= video_article.cloudinary_video_url %>)">
<span class="video-timestamp"><%= video_article.video_duration_in_minutes %></span>
</div>
<p><strong><%= video_article.title %></strong></p>
<p class="video-username"><%= video_article.user.name %></p>
</a>
<% end %>
</div>
<div class="subvideos"></div>
<div class="loading-articles" id="loading-articles">
loading...
</div>
<main id="main-content">
<header class="video-page-title">
<h1><%= community_name %> on Video</h1>
</header>
<div class="video-collection" id="video-collection">
<% @video_articles.each do |video_article| %>
<a class="single-video-article single-article" href="<%= video_article.path %>" id="video-article-<%= video_article.id %>">
<div class="video-image" style="background-image: url(<%= video_article.cloudinary_video_url %>)">
<span class="video-timestamp"><%= video_article.video_duration_in_minutes %></span>
</div>
<p><strong><%= video_article.title %></strong></p>
<p class="video-username"><%= video_article.user.name %></p>
</a>
<% end %>
</div>
<div class="subvideos"></div>
<div class="loading-articles" id="loading-articles">
loading...
</div>
</main>
</div>