Add title to page

4 years ago · 7d0227f332
2 changed files with 23 additions and 0 deletions
--- a/client_src/css/main.css
+++ b/client_src/css/main.css
@ -1,7 +1,27 @@
				@@ -1,7 +1,27 @@
@import "../../node_modules/leaflet/dist/leaflet.css";
@import "../../node_modules/leaflet-fullscreen/dist/leaflet.fullscreen.css";

+html, body { font-size: 100%; }
+body {
+    font-family: sans-serif;
+	margin: 0; padding: 0;
+}
+
+header {
+	text-align: center;
+	z-index: 100;
+}
+h1 {
+	display: inline-block;
+	margin-top: 0; padding: 0.25em 0.45em;
+	
+	background: rgba(255, 255, 255, 0.5);
+	border-radius: 0 0 0.25em 0.25em;
+}
+
 main {
 	position: absolute;
 	top: 0; bottom: 0; left: 0; right: 0;
+	
+	z-index: -100;
 }
--- a/client_src/index.html
+++ b/client_src/index.html
@ -5,6 +5,9 @@
				@@ -5,6 +5,9 @@
 		<title>Air Quality Map | ConnectedHumber</title>
 	</head>
 	<body>
+		<header>
+			<h1>Air Quality Map</h1>
+		</header>
 		<!-- Leaflet needs an id to attach to -->
 		<main id="map">