diff --git a/static/Manage_Coworking_Spaces.css b/static/Manage_Coworking_Spaces.css
index 45f7b3fc7235e7db8221659b381317165b18d223..5baf2cd5e7df5fae09e5fe228914332055b5a376 100644
--- a/static/Manage_Coworking_Spaces.css
+++ b/static/Manage_Coworking_Spaces.css
@@ -47,25 +47,42 @@ a {
/* [#1] Page header styling. Uses [#2].
header #pageHeader
- main #headerMain
+ div #headerDiv
nav #headerNav .navBar
ul .Right, ul .Left
li a
*/
-#headerMain {
+#headerDiv {
text-align: center;
background-color: white;
padding: 20px 0px;
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
}
-#headerMain a {
+#headerDiv a {
font-size: 30px;
font-weight: bold;
color: black;
}
+#headerText {
+ width: 100%;
+ margin-left: -220px;
+}
+
+#headerImg {
+ width: 180px;
+ height: 65px;
+ margin-top: -10px;
+ margin-right: 20px;
+ margin-bottom: -17.5px;
+ margin-left: 20px;
+}
+
#headerNav {
width: 100%;
position: absolute;
@@ -76,6 +93,11 @@ header #pageHeader
padding: 7.5px 10px;
}
+#headerNav img {
+ width: 55px;
+ height: 20px;
+}
+
/* [#2] Page navigation styling. Used in [#1] and [#4]. */
.navBar {
@@ -101,6 +123,9 @@ header #pageHeader
/* [#3] Page main styling.
main #pageMain
+ form #recordForm
+ label
+ input .formTextInput
*/
@@ -109,7 +134,6 @@ main #pageMain
/* [#4] Page footer styling. Uses [#2].
footer #pageFooter
- main #footerMain
nav #footerNav .navBar
ul .Center
li a
diff --git a/static/Manage_Coworking_Spaces.html b/static/Manage_Coworking_Spaces.html
index 52f9ea310c31e22ce615946a554b14cccfe092e3..d954c47c2030030941d6fa190fe37ed2e4e27a05 100644
--- a/static/Manage_Coworking_Spaces.html
+++ b/static/Manage_Coworking_Spaces.html
@@ -9,12 +9,19 @@
<body onLoad="pageLoad()">
<header id="pageHeader" class="pageHeader">
- <main id="headerMain">
- <a href="Manage_Coworking_Spaces.html">Manage Coworking Spaces</a>
- </main>
+ <div id="headerDiv">
+ <a href="Manage_Coworking_Spaces.html">
+ <img id="headerImg" class="headerImg"
+ src="Tramshed-Logo-Main-Black.png"></img></a>
+ <a id="headerText" class="headerText"
+ href="Manage_Coworking_Spaces.html">
+ Manage Coworking Spaces</a>
+ </div>
<nav id="headerNav" class="navBar">
<ul class="Left">
- <li><a href="Manage_Coworking_Spaces.html">Home</a></li>
+ <li><a href="Manage_Coworking_Spaces.html">
+ <img id="navImg" class="navImg"
+ src="Tramshed-Logo-Main-White.png"></img></a></li>
<li><a href="Manage_Coworking_Spaces.html">Left</a></li>
<li><a href="Manage_Coworking_Spaces.html">Home</a></li>
<li><a href="Manage_Coworking_Spaces.html">Left</a></li>
@@ -31,29 +38,29 @@
</nav>
</header>
- <main id="recordSection">
+ <main id="pageMain">
<br>
<form id="recordForm" title="Record Form">
- <label>Name: <input name="record_name" id="recordName"
- type="text"></label><br>
- <label>Address: <input name="record_address" id="recordAddress"
- type="text"></label><br>
- <label>Main Photograph: <input name="record_MP" id="recordMainPhotos"
- type="text"></label><br>
- <label>Additional Photographs: <input name="record_AP" id="recordAdditionalPhotos"
- type="text"></label><br>
- <label>Description: <input name="record_description" id="recordDescription"
- type="text"></label><br>
- <label>Website: <input name="record_website" id="recordWebsite"
- type="text"></label><br>
- <label>Email: <input name="record_email" id="recordEmail"
- type="text"></label><br>
- <label>Phone Number: <input name="record_PN" id="recordPhoneNumber"
- type="text"></label><br>
- <label>Opening Hours: <input name="record_OH" id="recordOpeningHours"
- type="text"></label><br>
- <label>Checkin Instructions: <input name="record_CI" id="recordCheckinInstructions"
- type="text"></label>
+ <label>Name: <input id="recordName" class="formTextInput"
+ name="record_name" type="text"></label><br>
+ <label>Address: <input id="recordAddress" class="formTextInput"
+ name="record_address" type="text"></label><br>
+ <label>Main Photograph: <input id="recordMainPhotos" class="formTextInput"
+ name="record_MP" type="text"></label><br>
+ <label>Additional Photographs: <input id="recordAdditionalPhotos" class="formTextInput"
+ name="record_AP" type="text"></label><br>
+ <label>Description: <input id="recordDescription" class="formTextInput"
+ name="record_description" type="text"></label><br>
+ <label>Website: <input id="recordWebsite" class="formTextInput"
+ name="record_website" type="text"></label><br>
+ <label>Email: <input id="recordEmail" class="formTextInput"
+ name="record_email" type="text"></label><br>
+ <label>Phone Number: <input id="recordPhoneNumber" class="formTextInput"
+ name="record_PN" type="text"></label><br>
+ <label>Opening Hours: <input id="recordOpeningHours" class="formTextInput"
+ name="record_OH" type="text"></label><br>
+ <label>Checkin Instructions: <input id="recordCheckinInstructions" class="formTextInput"
+ name="record_CI" type="text"></label>
<br><br>
<button id="addButton" type="submit">Add</button>
@@ -68,19 +75,17 @@
</main>
<footer id="pageFooter">
- <main id="footerMain">
- <nav id="footerNav" class="navBar">
- <ul class="Center">
- <li><a href="Manage_Coworking_Spaces.html">Left</a></li>
- </ul>
- <ul class="Center">
- <li><a href="Manage_Coworking_Spaces.html">Center</a></li>
- </ul>
- <ul class="Center">
- <li><a href="Manage_Coworking_Spaces.html">Right</a></li>
- </ul>
- </nav>
- </main>
+ <nav id="footerNav" class="navBar">
+ <ul class="Center">
+ <li><a href="Manage_Coworking_Spaces.html">Left</a></li>
+ </ul>
+ <ul class="Center">
+ <li><a href="Manage_Coworking_Spaces.html">Center</a></li>
+ </ul>
+ <ul class="Center">
+ <li><a href="Manage_Coworking_Spaces.html">Right</a></li>
+ </ul>
+ </nav>
</footer>
<script src="Manage_Coworking_Spaces.js"></script>
diff --git a/static/Manage_Coworking_Spaces.js b/static/Manage_Coworking_Spaces.js
index cd99c349a737f789d40218bbba02f7717693ef13..3a9e6070fcff3b4c264109164f520faf0b5ce7ac 100644
--- a/static/Manage_Coworking_Spaces.js
+++ b/static/Manage_Coworking_Spaces.js
@@ -5,19 +5,19 @@ function onSubmitLoad() {
function headerLoad() {
- let headerMain = document.querySelector('#headerMain');
- let headerMainHeight = headerMain.offsetHeight;
+ let headerDiv = document.querySelector('#headerDiv');
+ let headerDivHeight = headerDiv.offsetHeight;
let headerNav = document.querySelector('#headerNav');
let headerNavHeight = headerNav.offsetHeight;
- let pageHeaderHeight = headerMainHeight + headerNavHeight;
+ let pageHeaderHeight = headerDivHeight + headerNavHeight;
document.getElementById("pageHeader").style.height = pageHeaderHeight + "px";
}
window.onscroll = function() {parallaxNavScroll()};
function parallaxNavScroll() {
- let headerMain = document.querySelector('#headerMain');
- let headerHeight = headerMain.offsetHeight;
+ let headerDiv = document.querySelector('#headerDiv');
+ let headerHeight = headerDiv.offsetHeight;
if (document.body.scrollTop > headerHeight || document.documentElement.scrollTop > headerHeight) {
document.getElementById("headerNav").style.top = "0";
document.getElementById("headerNav").style.position = "fixed";
diff --git a/static/Tramshed-Logo-Main-Black.png b/static/Tramshed-Logo-Main-Black.png
new file mode 100644
index 0000000000000000000000000000000000000000..455f7390c61fde648e50fd2a762d15feba6337dd
Binary files /dev/null and b/static/Tramshed-Logo-Main-Black.png differ
diff --git a/static/Tramshed-Logo-Main-White.png b/static/Tramshed-Logo-Main-White.png
new file mode 100644
index 0000000000000000000000000000000000000000..b446f08b72112aef326461887d89437c3eeb901d
Binary files /dev/null and b/static/Tramshed-Logo-Main-White.png differ