templates/page.tmpl: fix sticky footer
All checks were successful
/ render (push) Successful in 35s

This commit is contained in:
IkiWiki 2024-09-17 13:35:34 -04:00
parent 85bce1bdef
commit 383b331319
Signed by untrusted user who does not match committer: forge
GPG key ID: D62A472A4AA7D541
2 changed files with 8 additions and 27 deletions

View file

@ -9,24 +9,6 @@ a {
}
/* Sticky footer styles
-------------------------------------------------- */
html {
position: relative;
min-height: 100%;
}
body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
background-color: #f5f5f5;
}
/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */
@ -39,11 +21,6 @@ body > .container {
font-size: 14px;
}
.footer > .container {
padding-right: 15px;
padding-left: 15px;
}
textarea {
width: 100%;
}

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" class="h-100">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
@ -60,9 +60,10 @@
</TMPL_LOOP>
</TMPL_UNLESS>
</head>
<body>
<body class="d-flex flex-column h-100">
<nav class="navbar fixed-top navbar-expand-lg navbar-light bg-light border">
<header>
<nav class="navbar fixed-top navbar-expand-lg navbar-light bg-light border">
<div class="container-fluid">
<a class="navbar-brand me-auto" href="<TMPL_VAR BASEURL>">
<img alt="<TMPL_VAR WIKINAME>" src="<TMPL_VAR BASEURL>favicon.png" width="48" height="48" />
@ -100,7 +101,9 @@
</div>
</div>
</nav>
</header>
<main class="flex-shrink-0 mt-auto">
<div class="container" id="content">
<TMPL_VAR CONTENT>
<TMPL_IF ENCLOSURE>
@ -152,8 +155,9 @@
</div>
</TMPL_UNLESS>
</div> <!-- /container -->
</main>
<footer class="footer pb-3 pt-3" role="contentinfo">
<footer class="footer mt-auto bg-light py-2" role="contentinfo">
<div class="container">
<TMPL_IF FOOTER><TMPL_VAR FOOTER></TMPL_IF>
</div>