Added Footer and css

4 years ago · a7d6ab27e6
parent 40cf26d81f
commit a7d6ab27e6
2 changed files with 37 additions and 6 deletions
--- a/html/css/styles.css
+++ b/html/css/styles.css
@ -0,0 +1,31 @@
+/* Sticky footer styles
+-------------------------------------------------- */
+html {
+	position: relative;
+	min-height: 100%;
+}
+body {
+	margin-bottom: 60px; /* Margin bottom by footer height */
+}
+.footer {
+	position: absolute;
+	bottom: 0;
+	width: 100%;
+	height: 60px; /* Set the fixed height of the footer here */
+	line-height: 60px; /* Vertically center the text there */
+	background-color: #f5f5f5;
+}
+
+
+/* Custom page CSS
+-------------------------------------------------- */
+/* Not required for template or sticky footer method. */
+
+.container {
+	width: auto;
+	padding: 0 15px;
+}
+
+nowrap {
+	white-space:nowrap
+}
--- a/html/index.html
+++ b/html/index.html
@ -22,11 +22,7 @@
 		<script type="text/javascript" src="js/config.js"></script>
 		<script type="text/javascript" src="metar.js/metar.js"></script>
 		<script type="text/javascript" src="js/functions.js"></script>
-		<style>
-			nowrap {
-				white-space:nowrap
-			}
-		</style>
+		<link rel="stylesheet" href="css/styles.css">
 		<title>DG9VH - MMDVM-Dashboard by DG9VH</title>
 	</head>
 	<body>
@ -161,7 +157,11 @@
 				</div>
 			</div>
 		</div>
-		
+		<footer class="footer">
+			<div class="container">
+				<span class="text-muted">MMDVM-Dashboard by DG9VH | get your own at: <a href="https://github.com/dg9vh/MMDVMHost-Websocketboard">https://github.com/dg9vh/MMDVMHost-Websocketboard</a> | Follow me <a href="https://twitter.com/DG9VH">@DG9VH</a></span>
+			</div>
+		</footer>
 		<script>
 			var t_lh = $('#lastHeard').DataTable( {
 				"order": [[ 0, "desc" ]]