Change channel banner to be CSS background image

This is to allow for contents to be placed on the channel banner itself;
something that is required for the links widget shown on Youtube.
This commit is contained in:
syeopite 2021-04-16 00:27:37 -07:00
parent 9c3a932217
commit 04cc15500f
No known key found for this signature in database
GPG key ID: 6FA616E5A5294A82
4 changed files with 14 additions and 4 deletions

View file

@ -15,6 +15,16 @@ body {
background-color: rgb(255, 0, 0, 0.5); background-color: rgb(255, 0, 0, 0.5);
} }
#channel-banner-container {
margin-bottom: 1em;
}
#banner {
height: calc(100vw / 6.2 - 1px);
background-size: cover !important;
background-repeat: no-repeat !important;
}
.channel-profile > * { .channel-profile > * {
font-size: 1.17em; font-size: 1.17em;
font-weight: bold; font-weight: bold;

View file

@ -1488,7 +1488,6 @@ get "/fetch_link_favicon" do |env|
env.response.headers["Access-Control-Allow-Origin"] = "*" env.response.headers["Access-Control-Allow-Origin"] = "*"
proxy_file(favicon_response, env) proxy_file(favicon_response, env)
end end
rescue ex rescue ex
end end
end end

View file

@ -195,6 +195,6 @@ def get_about_info(ucid, locale)
allowed_regions: allowed_regions, allowed_regions: allowed_regions,
related_channels: related_channels, related_channels: related_channels,
tabs: tabs, tabs: tabs,
links: links links: links,
}) })
end end

View file

@ -4,8 +4,9 @@
<% end %> <% end %>
<% if channel.banner %> <% if channel.banner %>
<div class="h-box"> <div class="pure-g" id="channel-banner-container">
<img style="width:100%" src="/ggpht<%= URI.parse(channel.banner.not_nil!.gsub("=w1060-", "=w1280-")).request_target %>"> <div class="pure-u-1" id="banner" style='background: url(/ggpht<%= URI.parse(channel.banner.not_nil!.gsub("=w1060-", "=w1280-")).request_target %>)'>
</div>
</div> </div>
<div class="h-box"> <div class="h-box">