Add padding for watch page

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

View File

@ -1,9 +1,13 @@
a {
color: #333;
text-decoration: none;
color: #333;
text-decoration: none;
}
a:hover,
a:active {
color: #167ac6;
}
color: #167ac6;
}
.l-box {
padding: 1em;
}

View File

@ -6,11 +6,13 @@
<title><%= video.title %> - Invidious</title>
<% end %>
<div class="l-box">
<% if listen %>
<%= render "src/views/player/audio.ecr" %>
<% else %>
<%= render "src/views/player/video.ecr" %>
<% end %>
</div>
<script>
var options = {
@ -72,6 +74,7 @@ function toggle(target) {
}
</script>
<div class="l-box">
<h1>
<%= video.info["title"] %>
<% if listen %>
@ -84,9 +87,11 @@ function toggle(target) {
</a>
<% end %>
</h1>
</div>
<div class="pure-g">
<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-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>
@ -94,8 +99,10 @@ function toggle(target) {
<p id="Rating">Rating : <%= rating.round(4) %> / 5</p>
<p id="Engagement">Engagement : <%= engagement.round(2) %>%</p>
</div>
</div>
<div class="pure-u-1 pure-u-md-3-5">
<div class="l-box">
<p>
<a href="https://youtube.com/channel/<%= video.info["ucid"] %>">
<h3><%= video.info["author"] %></h3>
@ -104,12 +111,12 @@ function toggle(target) {
<p>
<b>Shared <%= video.published.to_s("%B %-d, %Y") %></b>
</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 %>
</div>
<hr style="margin-right:1em;">
<hr style="margin-left:1em; margin-right:1em;">
<% 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>
<b>
<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>
<% end %>
</div>
</div>
<div class="pure-u-1 pure-u-md-1-5">
<div class="l-box">
<% rvs.each do |rv| %>
<% if rv.has_key?("id") %>
<a href="/watch?v=<%= rv["id"] %>">
@ -131,3 +140,4 @@ function toggle(target) {
<% end %>
</div>
</div>
</div>