1
0
Fork 0
forked from ilot/ilot-io

templates/page.tmpl: fix sticky footer

This commit is contained in:
Antoine Martin 2024-09-16 17:40:10 -04:00
parent 94a8b58355
commit e8602aa59d
Signed by: ayakael
GPG key ID: D62A472A4AA7D541
2 changed files with 9 additions and 29 deletions

View file

@ -9,42 +9,18 @@ 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%;
padding-bottom: 15px;
background-color: #f5f5f5;
}
/* Custom page CSS /* Custom page CSS
-------------------------------------------------- */ -------------------------------------------------- */
/* Not required for template or sticky footer method. */ /* Not required for template or sticky footer method. */
body > .container { main > .container {
padding: 80px 15px 15px; padding: 60px 15px 15px;
} }
.pagedate { .pagedate {
font-size: 14px; font-size: 14px;
} }
.footer > .container {
padding-right: 15px;
padding-left: 15px;
}
textarea { textarea {
width: 100%; width: 100%;
} }

View file

@ -1,5 +1,5 @@
<!DOCTYPE html> <!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> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
@ -38,7 +38,8 @@
</TMPL_IF> </TMPL_IF>
</head> </head>
<body> <body class="d-flex flex-column h-100">
<header>
<nav class="navbar fixed-top navbar-expand-lg navbar-light bg-light border"> <nav class="navbar fixed-top navbar-expand-lg navbar-light bg-light border">
<div class="container-fluid"> <div class="container-fluid">
<a class="navbar-brand me-auto" href="<TMPL_VAR BASEURL>"> <a class="navbar-brand me-auto" href="<TMPL_VAR BASEURL>">
@ -82,7 +83,9 @@
</div> </div>
</div> </div>
</nav> </nav>
</header>
<main class="flex-shrink-0">
<div class="container" id="content"> <div class="container" id="content">
<TMPL_VAR CONTENT> <TMPL_VAR CONTENT>
<TMPL_IF ENCLOSURE> <TMPL_IF ENCLOSURE>
@ -93,8 +96,9 @@
<TMPL_IF TRAILS><TMPL_VAR TRAILS></TMPL_IF> <TMPL_IF TRAILS><TMPL_VAR TRAILS></TMPL_IF>
</div> <!-- /container --> </div> <!-- /container -->
</main>
<footer class="footer" role="contentinfo"> <footer class="footer mt-auto py-2 bg-light" role="contentinfo">
<div class="container"> <div class="container">
<TMPL_IF FOOTER><TMPL_VAR FOOTER></TMPL_IF> <TMPL_IF FOOTER><TMPL_VAR FOOTER></TMPL_IF>
</div> </div>