ProjectSegfault/invidious-experimenting
4
0
Fork 0
forked from midou/invidious
Code Pull Requests Activity

Add padding for watch page

Browse Source
This commit is contained in:
Omar Roth 2018-03-11 12:05:56 -05:00
parent 8b2d2044b2
commit 052fa400a2
2 changed files with 21 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
assets/css/custom.css
View File

@ -7,3 +7,7 @@ a:hover,
a:active { a:active {
color: #167ac6; color: #167ac6;
} }
.l-box {
padding: 1em;
}

16
src/views/watch.ecr
View File

@ -6,11 +6,13 @@
<title><%= video.title %> - Invidious</title> <title><%= video.title %> - Invidious</title>
<% end %> <% end %>
<div class="l-box">
<% if listen %> <% if listen %>
<%= render "src/views/player/audio.ecr" %> <%= render "src/views/player/audio.ecr" %>
<% else %> <% else %>
<%= render "src/views/player/video.ecr" %> <%= render "src/views/player/video.ecr" %>
<% end %> <% end %>
</div>
<script> <script>
var options = { var options = {
@ -72,6 +74,7 @@ function toggle(target) {
} }
</script> </script>
<div class="l-box">
<h1> <h1>
<%= video.info["title"] %> <%= video.info["title"] %>
<% if listen %> <% if listen %>
@ -84,9 +87,11 @@ function toggle(target) {
</a> </a>
<% end %> <% end %>
</h1> </h1>
</div>
<div class="pure-g"> <div class="pure-g">
<div class="pure-u-1 pure-u-md-1-5"> <div class="pure-u-1 pure-u-md-1-5">
<div class="l-box">
<p><i class="fa fa-eye" aria-hidden="true"></i> <%= number_with_separator(video.views) %></p> <p><i class="fa fa-eye" aria-hidden="true"></i> <%= number_with_separator(video.views) %></p>
<p><i class="fa fa-thumbs-up" aria-hidden="true"></i> <%= number_with_separator(video.likes) %></p> <p><i class="fa fa-thumbs-up" aria-hidden="true"></i> <%= number_with_separator(video.likes) %></p>
<p><i class="fa fa-thumbs-down" aria-hidden="true"></i> <%= number_with_separator(video.dislikes) %></p> <p><i class="fa fa-thumbs-down" aria-hidden="true"></i> <%= number_with_separator(video.dislikes) %></p>
@ -94,8 +99,10 @@ function toggle(target) {
<p id="Rating">Rating : <%= rating.round(4) %> / 5</p> <p id="Rating">Rating : <%= rating.round(4) %> / 5</p>
<p id="Engagement">Engagement : <%= engagement.round(2) %>%</p> <p id="Engagement">Engagement : <%= engagement.round(2) %>%</p>
</div> </div>
</div>
<div class="pure-u-1 pure-u-md-3-5"> <div class="pure-u-1 pure-u-md-3-5">
<div class="l-box">
<p> <p>
<a href="https://youtube.com/channel/<%= video.info["ucid"] %>"> <a href="https://youtube.com/channel/<%= video.info["ucid"] %>">
<h3><%= video.info["author"] %></h3> <h3><%= video.info["author"] %></h3>
@ -104,12 +111,12 @@ function toggle(target) {
<p> <p>
<b>Shared <%= video.published.to_s("%B %-d, %Y") %></b> <b>Shared <%= video.published.to_s("%B %-d, %Y") %></b>
</p> </p>
<div style="margin-right:1em; overflow-wrap:break-word; word-wrap:break-word;"> <div style="overflow-wrap:break-word; word-wrap:break-word;">
<%= video.description %> <%= video.description %>
</div> </div>
<hr style="margin-right:1em;"> <hr style="margin-left:1em; margin-right:1em;">
<% if reddit_thread && !reddit_html.empty? %> <% if reddit_thread && !reddit_html.empty? %>
<div style="margin-right:1em; overflow-wrap:break-word; word-wrap:break-word;"> <div style="overflow-wrap:break-word; word-wrap:break-word;">
<h3><%= reddit_thread.data.title %></h3> <h3><%= reddit_thread.data.title %></h3>
<b> <b>
<a target="_blank" href="https://reddit.com<%= reddit_thread.data.permalink %>">View more comments on Reddit</a> <a target="_blank" href="https://reddit.com<%= reddit_thread.data.permalink %>">View more comments on Reddit</a>
@ -118,8 +125,10 @@ function toggle(target) {
</div> </div>
<% end %> <% end %>
</div> </div>
</div>
<div class="pure-u-1 pure-u-md-1-5"> <div class="pure-u-1 pure-u-md-1-5">
<div class="l-box">
<% rvs.each do |rv| %> <% rvs.each do |rv| %>
<% if rv.has_key?("id") %> <% if rv.has_key?("id") %>
<a href="/watch?v=<%= rv["id"] %>"> <a href="/watch?v=<%= rv["id"] %>">
@ -131,3 +140,4 @@ function toggle(target) {
<% end %> <% end %>
</div> </div>
</div> </div>
</div>