PrivateCoffee/invidious
4
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

Merge pull request #1976 from syeopite/fixfooter

Browse source 
Fix footer position to bottom of page
This commit is contained in:
TheFrenchGhosty 2021-04-08 06:23:19 +00:00 committed by GitHub
commit cd1e478b95
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
assets/css/default.css
View file

@ -5,6 +5,12 @@ body {
Arial, sans-serif; Arial, sans-serif;
} }
#contents {
display: flex;
flex-direction: column;
height: 100vh;
}
.deleted { .deleted {
background-color: rgb(255, 0, 0, 0.5); background-color: rgb(255, 0, 0, 0.5);
} }
@ -280,14 +286,16 @@ input[type="search"]::-webkit-search-cancel-button {
* Footer * Footer
*/ */
.footer { footer {
color: #666666; color: #919191;
margin: 2em 0; margin-top: auto;
padding: 1.5em 0;
text-align: center; text-align: center;
max-height: 30vh;
} }
body .footer a { footer a {
color: inherit; color: #919191 !important;
text-decoration: underline; text-decoration: underline;
} }
@ -654,3 +662,10 @@ body.dark-theme {
content: "[ - ]"; content: "[ - ]";
font-size: 1.5em; font-size: 1.5em;
} }
/*With commit d9528f5 all contents of the page is now within a flexbox. However,
the hr element is rendered improperly within one.
See https://stackoverflow.com/a/34372979 for more info */
hr {
margin: auto 0 auto 0;
}

6
src/invidious/views/template.ecr
View file

@ -26,7 +26,7 @@
<span style="display:none" id="dark_mode_pref"><%= env.get("preferences").as(Preferences).dark_mode %></span> <span style="display:none" id="dark_mode_pref"><%= env.get("preferences").as(Preferences).dark_mode %></span>
<div class="pure-g"> <div class="pure-g">
<div class="pure-u-1 pure-u-md-2-24"></div> <div class="pure-u-1 pure-u-md-2-24"></div>
<div class="pure-u-1 pure-u-md-20-24"> <div class="pure-u-1 pure-u-md-20-24", id="contents">
<div class="pure-g navbar h-box"> <div class="pure-g navbar h-box">
<div class="pure-u-1 pure-u-md-4-24"> <div class="pure-u-1 pure-u-md-4-24">
<a href="/" class="index-link pure-menu-heading">Invidious</a> <a href="/" class="index-link pure-menu-heading">Invidious</a>
@ -106,7 +106,7 @@
<%= content %> <%= content %>
<div class="footer"> <footer>
<div class="pure-g"> <div class="pure-g">
<div class="pure-u-1 pure-u-md-1-3"> <div class="pure-u-1 pure-u-md-1-3">
<a href="https://github.com/iv-org/invidious"> <a href="https://github.com/iv-org/invidious">
@ -140,7 +140,7 @@
<%= translate(locale, "Current version: ") %> <%= CURRENT_VERSION %>-<%= CURRENT_COMMIT %> @ <%= CURRENT_BRANCH %> <%= translate(locale, "Current version: ") %> <%= CURRENT_VERSION %>-<%= CURRENT_COMMIT %> @ <%= CURRENT_BRANCH %>
</div> </div>
</div> </div>
</div> </footer>
</div> </div>
<div class="pure-u-1 pure-u-md-2-24"></div> <div class="pure-u-1 pure-u-md-2-24"></div>
</div> </div>