-body{
- font-family:arial,sans-serif;
- margin-top: 20px;
- margin-bottom: 40px;
- margin-left: 0px;
- margin-right 0px;
- background-color: #fff8ff;
- color: #00000;
- width: 100%;
+/* Sticky footer styles
+-------------------------------------------------- */
+html {
+ position: relative;
+ min-height: 100%;
}
-.actions{
- font-family:arial,sans-serif;
- font-size: .95em;
- text-align: left;
-}
-#content{
- text-align: left;
- width: 100%;
-}
-.pagedate{
- font-family: times;
- font-size: .8em;
-}
-
-/*Elements*/
-hr{
- width: 50%;
- border: solid 1px black;
-}
-blockquote{
- border: dashed 1px;
- padding-left: 20px;
- margin-left: 15px;
- background-color: #ccc;
-}
-p{
- margin-bottom: 1.2em;
- margin-left: 1.5em;
-}
-ol{
- margin-left: 2em;
-}
-/* Counter Headings */
body {
-counter-reset : h1;
- }
-
-h1 {
-counter-reset : h2;
- }
-
-h2 {
-counter-reset : h3;
- }
-
-h3 {
-counter-reset : h4;
- }
-
-h4 {
-counter-reset : h5;
- }
-
-h5 {
-counter-reset : h6;
- }
-
-#content h1:before {
-content : counter(h1,decimal) ". ";
-counter-increment : h1;
- }
-
-#content h2:before {
-content : counter(h1,decimal) "." counter(h2,decimal) ". ";
-counter-increment : h2;
- }
-
-#content h3:before {
-content : counter(h1,decimal) "." counter(h2,decimal) "." counter(h3,decimal) ". ";
-counter-increment : h3;
- }
-
-#content h4:before {
-content : counter(h1,decimal) "." counter(h2,decimal) "." counter(h3,decimal) "." counter(h4,decimal) ". ";
-counter-increment : h4;
- }
-
-#content h5:before {
-content : counter(h1,decimal) "." counter(h2,decimal) "." counter(h3,decimal) "." counter(h4,decimal) "." counter(h5,decimal) ". ";
-counter-increment : h5;
- }
-
-#content h6:before {
-content : counter(h1,decimal) "." counter(h2,decimal) "." counter(h3,decimal) "." counter(h4,decimal) "." counter(h5,decimal) "." counter(h6,decimal) ". ";
-counter-increment : h6;
- }
-
-h1.nocount:before, h2.nocount:before, h3.nocount:before, h4.nocount:before, h5.nocount:before, h6.nocount:before {
-content : "";
-counter-increment : none;
- }
-
-
-/* Headings */
-
-.pageheader { min-height: 100px; overflow: none; width: 95%; margin: 4px; }
-.header {
- height: 50px;
- background: #4b6983;
- /*border: 2px solid #7590ae; */
- color: #ffffff;
- font-family: sans-serif;
- width: 100%;
- margin: 4px;
- padding: -4px;
+ /* Margin bottom by footer height */
+ margin-bottom: 60px;
}
-.header a { margin-right: 1ex; color: #ffffff; font-family: sans-serif;}
-
-/*.header{
- font-family: georgia;
- font-size: 1.25em;
- line-height: 1em;
- font-weight: bolder;
-}
-*/
-h1{
- font-size: 1.5em;
- font-weight: bold;
- line-height: 1em;
- margin-left: 1em;
- text-indent: -1em;
-}
-h2{
- font-size: 1.4em;
- line-height: 1em;
- font-weight: bold;
- margin-left: 1em;
- text-indent: -1em;
-}
-h3{
- font-size: 1.3em;
- font-weight: bold;
- line-height: 1em;
- margin-left: 1em;
- text-indent: -1em;
-}
-h4{
- font-size: 1.2em;
- font-weight: bold;
- line-height: 1em;
- margin-left: 1em;
- text-indent: -1em;
-}
-h5{
- font-size: 1.1em;
- font-weight: bold;
- line-height: 1em;
- margin-left: 1em;
- text-indent: -1em;
-}
-h6{
- font-size: 1em;
- font-weight: bold;
- line-height: 1em;
- margin-left: 1em;
- text-indent: -1em;
-}
-/*Forums*/
-form{
- font-size: .9em;
- font-family: "Inconsolata", "monaco", "droid sans mono",fixed;
- margin-left: 0em;
- margin-top: 1.2em;
- padding-bottom: 2em;
-}
-textarea{
- /*font-family: "Inconsolata", "monaco", "droid sans mono",fixed;*/
- /*font-size: .9em;*/
- border: solid 1px;
- width: 100%;
- margin-bottom: 10px;
-}
-input#comments{
- font-family: "Inconsolata", "monaco", "droid sans mono",fixed;
- font-size: .9em;
- width: 550px;
- line-height: 1em;
- background-color: #fff;
- border: solid 1px;
-}
-input#comments{
- font-family: "Inconsolata", "monaco", "droid sans mono",fixed;
- font-size: .9em;
- width: 550px;
- line-height: 1em;
- background-color: #fff;
- border: solid 1px;
-}
-input[type="submit"]{
- font-family:
- font-size: .9em;
- font-weight: bold;
- line-height: 1em;
- background-color: #ddd;
- margin-right: 1.1em;
- margin-top: 10px;
- padding: 3px;
- text-align: center;
- width: 9.5em;
- border: solid 1px;
+.footer {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ /* Set the fixed height of the footer here */
+ height: 60px;
+ background-color: #f5f5f5;
}
-#blogform input[name="title"]{
- font-family: "inconsolata", "monaco", "droid sans mono",fixed;
- font-size: .9em;
- line-height: 1.2em;
- font-size: 1.1em;
- margin-left: .4em;
- margin-right: .4em;
- border: solid 1px;
-}
-#blogform input[type="submit"]{
- font-family: "Inconsolata", "monaco", "droid sans mono",fixed;
- font-size: .9em;
- line-height: 1em;
- font-size: 1em;
- background-color: #ddd;
- border: solid 1px;
-}
-div.thumb {
- margin-bottom: .5em;
- border-style: solid;
- border-color: white;
- width: auto;
-}
-div.thumbinner {
- border: 1px solid #ccc;
- padding: 3px !important;
- background-color: #f9f9f9;
- font-size: 94%;
- text-align: center;
- overflow: hidden;
-}
-html .thumbimage {
- border: 1px solid #ccc;
-}
-img.thumbborder {
- border: 1px solid #dddddd;
-}
+/* Custom page CSS
+-------------------------------------------------- */
+/* Not required for template or sticky footer method. */
-div.tright {
- clear: right;
- float: right;
- border-width: .5em 0 .8em 1.4em;
+body > .container {
+ padding: 60px 15px 0;
}
-
-pre {
- margin-left: 45px;
+.container .text-muted {
+ margin: 20px 0;
}
-
-table {
- margin-left: 35px;
+.footer > .container {
+ padding-right: 15px;
+ padding-left: 15px;
}
-table, th, td {
- border: 1px solid black;
+code {
+ font-size: 80%;
}
-td {
- padding: 4px;
-}
+
--- /dev/null
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+ <head>
+ <meta charset="utf-8" />
+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+ <meta name="description" content="Personal Website" />
+ <meta name="author" content="Julian Andres Klode" />
+
+ <title><TMPL_LOOP NAME="PARENTLINKS"><TMPL_VAR NAME=PAGE>/</TMPL_LOOP><TMPL_VAR TITLE></title>
+
+ <TMPL_IF NAME="META"><TMPL_VAR META></TMPL_IF>
+
+ <!-- ikiwiki CSS -->
+ <link href="<TMPL_VAR BASEURL>style.css" rel="stylesheet" />
+
+ <!-- Bootstrap core CSS -->
+ <link href="<TMPL_VAR BASEURL>bootstrap.min.css" rel="stylesheet" />
+
+ <!-- Custom styles for this template -->
+ <link href="<TMPL_VAR BASEURL>local.css" rel="stylesheet" />
+
+ </head>
+ <body>
+
+ <nav class="navbar navbar-inverse navbar-fixed-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="<TMPL_VAR BASEURL>"><TMPL_VAR WIKINAME></a>
+ </div>
+ <div id="navbar" class="collapse navbar-collapse">
+ <ul class="nav navbar-nav">
+ <TMPL_LOOP BOOTMENU>
+ <TMPL_IF FIRSTNAV>
+ <li <TMPL_IF ACTIVE>class="active"</TMPL_IF>><a href="<TMPL_VAR URL>"><TMPL_VAR PAGE></a></li>
+ </TMPL_IF>
+ </TMPL_LOOP>
+ </ul>
+ <ul class="nav navbar-nav navbar-right">
+ <TMPL_LOOP BOOTMENU>
+ <TMPL_IF FIRSTNAV>
+ <TMPL_ELSE>
+ <li <TMPL_IF ACTIVE>class="active"</TMPL_IF>><a href="<TMPL_VAR URL>"><TMPL_VAR PAGE></a></li>
+ </TMPL_IF>
+ </TMPL_LOOP>
+ </ul>
+ </div>
+ </div>
+ </nav>
+
+ <div class="container">
+
+
+ <header class="page-header">
+ <h1><TMPL_VAR TITLE></h1>
+ </header>
+
+ <TMPL_VAR CONTENT>
+
+ </div> <!-- /container -->
+
+ <footer class="footer">
+ <div class="container">
+ <p class="text-muted">
+ Copyright © 2007-2018 Julian Andres Klode - License: <a href="http://jak-linux.org/LICENSE">Creative Commons 3.0 BY-SA (content) / MIT (theme)</a>
+ <span class="pull-right">Powered by <a href="http://ikiwiki.info/">ikiwiki</a> -
+ <a href="http://validator.w3.org/check?uri=referer">Valid (X)HTML 5</a></span>
+ </p>
+ </div>
+ </footer>
+
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="<TMPL_VAR BASEURL>jquery.min.js"></script>
+ <script src="<TMPL_VAR BASEURL>bootstrap.min.js"></script>
+
+ </body>
+</html>