Commit c3efbcf8 authored by jkerr's avatar jkerr
Browse files

Finished css, made massive progress

parent 13453c66
......@@ -2,11 +2,14 @@
<project version="4">
<component name="ChangeListManager">
<list default="true" id="cccfd40b-d5c2-4431-bcfd-f34d25764049" name="Default Changelist" comment="">
<change beforePath="$PROJECT_DIR$/._campsites.json" beforeDir="false" />
<change afterPath="$PROJECT_DIR$/scripts/data/cabinInfo.html" afterDir="false" />
<change afterPath="$PROJECT_DIR$/scripts/data/tentInfo.html" afterDir="false" />
<change afterPath="$PROJECT_DIR$/scripts/data/vanInfo.html" afterDir="false" />
<change afterPath="$PROJECT_DIR$/scripts/jquery-3.3.1.min.js" afterDir="false" />
<change afterPath="$PROJECT_DIR$/scripts/switchbooking.js" afterDir="false" />
<change afterPath="$PROJECT_DIR$/style/siteInfoStyle.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/campsites.json" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/index.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/reviews.json" beforeDir="false" />
<change beforePath="$PROJECT_DIR$/style/style.css" beforeDir="false" afterPath="$PROJECT_DIR$/style/style.css" afterDir="false" />
</list>
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
......@@ -20,54 +23,95 @@
<executable />
</execution>
</component>
<component name="DockManager">
<window id="2">
<content type="file-editors">
<state>
<leaf>
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/style/style.css">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="568">
<caret line="68" column="15" selection-start-line="68" selection-start-column="15" selection-end-line="68" selection-end-column="15" />
</state>
</provider>
</entry>
</file>
</leaf>
</state>
</content>
</window>
</component>
<component name="FileEditorManager">
<leaf>
<file pinned="false" current-in-tab="true">
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/index.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="402">
<caret line="27" column="16" selection-start-line="27" selection-start-column="16" selection-end-line="27" selection-end-column="16" />
<state relative-caret-position="240">
<caret line="16" column="51" lean-forward="true" selection-start-line="16" selection-start-column="51" selection-end-line="16" selection-end-column="51" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/style/style.css">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="26" selection-start-column="26" selection-end-column="26" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/scripts/switchbooking.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="255">
<caret line="17" column="89" selection-start-line="17" selection-start-column="89" selection-end-line="17" selection-end-column="89" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/style/siteInfoStyle.css">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="2" selection-start-column="2" selection-end-column="2" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/scripts/data/tentInfo.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="30">
<caret line="2" column="43" selection-start-line="2" selection-start-column="43" selection-end-line="2" selection-end-column="43" />
</state>
</provider>
</entry>
</file>
</leaf>
</component>
<component name="FileTemplateManagerImpl">
<option name="RECENT_TEMPLATES">
<list>
<option value="JavaScript File" />
<option value="AMD JavaScript File" />
<option value="HTML File" />
<option value="CSS File" />
</list>
</option>
</component>
<component name="FindInProjectRecents">
<findStrings>
<find>border</find>
</findStrings>
</component>
<component name="Git.Settings">
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
</component>
<component name="IdeDocumentHistory">
<option name="CHANGED_PATHS">
<list>
<option value="$PROJECT_DIR$/scripts/jquery-3.3.1.min.js" />
<option value="$PROJECT_DIR$/scripts/data/cabinInfo.html" />
<option value="$PROJECT_DIR$/scripts/data/vanInfo.html" />
<option value="$PROJECT_DIR$/index.html" />
<option value="$PROJECT_DIR$/style/style.css" />
<option value="$PROJECT_DIR$/style/siteInfoStyle.css" />
<option value="$PROJECT_DIR$/scripts/switchbooking.js" />
<option value="$PROJECT_DIR$/scripts/data/tentInfo.html" />
</list>
</option>
</component>
<component name="ProjectFrameBounds">
<option name="y" value="23" />
<option name="width" value="978" />
<option name="width" value="1059" />
<option name="height" value="1347" />
</component>
<component name="ProjectLevelVcsManager">
<ConfirmationsSetting value="2" id="Add" />
</component>
<component name="ProjectView">
<navigator proportions="" version="1">
<foldersAlwaysOnTop value="true" />
......@@ -83,6 +127,12 @@
<path>
<item name="assignment-1" type="b2602c69:ProjectViewProjectNode" />
<item name="assignment-1" type="462c0819:PsiDirectoryNode" />
<item name="scripts" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="assignment-1" type="b2602c69:ProjectViewProjectNode" />
<item name="assignment-1" type="462c0819:PsiDirectoryNode" />
<item name="scripts" type="462c0819:PsiDirectoryNode" />
<item name="data" type="462c0819:PsiDirectoryNode" />
</path>
<path>
......@@ -98,8 +148,10 @@
</panes>
</component>
<component name="PropertiesComponent">
<property name="DefaultHtmlFileTemplate" value="HTML File" />
<property name="SHARE_PROJECT_CONFIGURATION_FILES" value="true" />
<property name="WebServerToolWindowFactoryState" value="false" />
<property name="list.type.of.created.stylesheet" value="CSS" />
<property name="node.js.detected.package.eslint" value="true" />
<property name="node.js.detected.package.tslint" value="true" />
<property name="node.js.path.for.package.eslint" value="project" />
......@@ -109,6 +161,7 @@
</component>
<component name="RecentsManager">
<key name="MoveFile.RECENT_KEYS">
<recent name="$PROJECT_DIR$/scripts" />
<recent name="$PROJECT_DIR$" />
</key>
</component>
......@@ -135,7 +188,9 @@
<option name="presentableId" value="Default" />
<updated>1565679156857</updated>
<workItem from="1565679158954" duration="177000" />
<workItem from="1565755309208" duration="4358000" />
<workItem from="1565755309208" duration="4420000" />
<workItem from="1565927840184" duration="2912000" />
<workItem from="1566271563452" duration="7254000" />
</task>
<task id="LOCAL-00001" summary="First Commit">
<created>1565679239864</created>
......@@ -144,17 +199,24 @@
<option name="project" value="LOCAL" />
<updated>1565679239864</updated>
</task>
<option name="localTasksCounter" value="2" />
<task id="LOCAL-00002" summary="Added form, image and some text">
<created>1565759992852</created>
<option name="number" value="00002" />
<option name="presentableId" value="LOCAL-00002" />
<option name="project" value="LOCAL" />
<updated>1565759992852</updated>
</task>
<option name="localTasksCounter" value="3" />
<servers />
</component>
<component name="TimeTrackingManager">
<option name="totallyTimeSpent" value="4535000" />
<option name="totallyTimeSpent" value="14763000" />
</component>
<component name="ToolWindowManager">
<frame x="0" y="23" width="978" height="1347" extended-state="0" />
<frame x="0" y="23" width="1059" height="1347" extended-state="0" />
<editor active="true" />
<layout>
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.032051284" />
<window_info content_ui="combo" id="Project" order="0" weight="0.24680433" />
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
<window_info id="Favorites" order="2" side_tool="true" />
<window_info anchor="bottom" id="Message" order="0" />
......@@ -166,7 +228,7 @@
<window_info anchor="bottom" id="TODO" order="6" />
<window_info anchor="bottom" id="Docker" order="7" show_stripe_button="false" />
<window_info anchor="bottom" id="Database Changes" order="8" />
<window_info anchor="bottom" id="Version Control" order="9" visible="true" weight="0.32988048" />
<window_info anchor="bottom" id="Version Control" order="9" weight="0.32988048" />
<window_info anchor="bottom" id="Terminal" order="10" />
<window_info anchor="bottom" id="Event Log" order="11" side_tool="true" />
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" />
......@@ -174,33 +236,92 @@
<window_info anchor="right" content_ui="combo" id="Hierarchy" order="2" weight="0.25" />
<window_info anchor="right" id="Database" order="3" />
</layout>
<layout-to-restore>
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.24680433" />
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
<window_info id="Favorites" order="2" side_tool="true" />
<window_info anchor="bottom" id="Message" order="0" />
<window_info anchor="bottom" id="Find" order="1" />
<window_info anchor="bottom" id="Run" order="2" />
<window_info anchor="bottom" id="Debug" order="3" weight="0.4" />
<window_info anchor="bottom" id="Cvs" order="4" weight="0.25" />
<window_info anchor="bottom" id="Inspection" order="5" weight="0.4" />
<window_info anchor="bottom" id="TODO" order="6" />
<window_info anchor="bottom" id="Docker" order="7" show_stripe_button="false" />
<window_info anchor="bottom" id="Database Changes" order="8" />
<window_info anchor="bottom" id="Version Control" order="9" weight="0.32988048" />
<window_info anchor="bottom" id="Terminal" order="10" />
<window_info anchor="bottom" id="Event Log" order="11" side_tool="true" />
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" />
<window_info anchor="right" id="Ant Build" order="1" weight="0.25" />
<window_info anchor="right" content_ui="combo" id="Hierarchy" order="2" weight="0.25" />
<window_info anchor="right" id="Database" order="3" />
</layout-to-restore>
</component>
<component name="TypeScriptGeneratedFilesManager">
<option name="version" value="1" />
</component>
<component name="VcsManagerConfiguration">
<MESSAGE value="First Commit" />
<option name="LAST_COMMIT_MESSAGE" value="First Commit" />
<MESSAGE value="Added form, image and some text" />
<option name="LAST_COMMIT_MESSAGE" value="Added form, image and some text" />
</component>
<component name="editorHistoryManager">
<entry file="file://$PROJECT_DIR$/data/bookings.json">
<entry file="file://$PROJECT_DIR$/scripts/data/bookings.json">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-570">
<caret line="5" selection-start-line="5" selection-end-line="6" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/scripts/jquery-3.3.1.min.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="30">
<caret line="2" selection-start-line="2" selection-end-line="2" />
<folding>
<element signature="n#!!doc" expanded="true" />
</folding>
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/scripts/data/cabinInfo.html">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/scripts/data/vanInfo.html">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/index.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="402">
<caret line="27" column="16" selection-start-line="27" selection-start-column="16" selection-end-line="27" selection-end-column="16" />
<state relative-caret-position="240">
<caret line="16" column="51" lean-forward="true" selection-start-line="16" selection-start-column="51" selection-end-line="16" selection-end-column="51" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/style/siteInfoStyle.css">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="2" selection-start-column="2" selection-end-column="2" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/style/style.css">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="568">
<caret line="68" column="15" selection-start-line="68" selection-start-column="15" selection-end-line="68" selection-end-column="15" />
<state>
<caret column="26" selection-start-column="26" selection-end-column="26" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/scripts/switchbooking.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="255">
<caret line="17" column="89" selection-start-line="17" selection-start-column="89" selection-end-line="17" selection-end-column="89" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/scripts/data/tentInfo.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="30">
<caret line="2" column="43" selection-start-line="2" selection-start-column="43" selection-end-line="2" selection-end-column="43" />
</state>
</provider>
</entry>
......
......@@ -4,55 +4,57 @@
<meta charset="UTF-8">
<title>QuickCamp</title>
<link rel="stylesheet" href="style/style.css">
<script src="scripts/jquery-3.3.1.min.js"></script>
<script src="scripts/switchbooking.js"></script>
</head>
<body>
<header>
<h1>QuickCamp</h1>
</header>
<header>
<h1>QuickCamp</h1>
</header>
<div id="bookingTypes">
<div>
<h2 class="bookType">Book Cabin</h2>
<h2 class="bookType">Book Van Site</h2>
<h2 class="bookType">Book Tent Site</h2>
</div>
</div>
<main>
<section>
<section id="bookingTypes">
<div>
<h2 id="cabinButton">Book Cabin</h2>
<h2 id="vanButton">Book Van Site</h2>
<h2 id="tentButton">Book Tent Site</h2>
</div>
</section>
<main>
<section id="info">
<h2>Our Cabins:</h2>
<p>All of our cabins include great views, comfortable beds, and best of all hot showers.
If you are looking for a more comfortable camping experience, our luxury cabins are for you.</p>
If you are looking for a more comfortable camping experience, our luxury cabins are for you.</p>
</section>
<section id="book">
<h2>Book a Cabin:</h2>
<form>
<input id="name" name="name" type="text"><label for="name">Full Name</label>
<input id="checkIn" name="checkIn" type="date"><label for="checkIn">Check In Date</label>
<input id="checkOut" name="checkIn" type="date"><label for="checkOut">Check Out Date</label>
<input id="submit" name="submit" type="submit">
<input id="name" name="name" type="text"><label id="first" for="name">Full Name</label>
<input id="checkIn" name="checkIn" type="date"><label for="checkIn">Check In</label>
<input id="checkOut" name="checkIn" type="date"><label for="checkOut">Check Out</label>
<input id="siteType" name="siteType' type='text">
</form>
</section>
<figure alt="A picture of one of our fantastic cabins"><img src="images/cabin.jpg"></figure>
</section>
</main>
<figure id="map"></figure>
<figure id="photo"></figure>
</main>
<section id="palette">
<section id="black"></section>
<section id="darkblue"></section>
<section id="medblue"></section>
<section id="lightblue"></section>
<section id="white"></section>
<p id="lato">Lato Text</p>
<p id="opensans">Opensans text</p>
<p id="quicksand">Quicksand text</p>
<p id="ubuntu">Ubuntu text</p>
</section>
<section id="palette">
<section id="black"></section>
<section id="darkblue"></section>
<section id="medblue"></section>
<section id="lightblue"></section>
<section id="white"></section>
<p id="lato">Lato Text</p>
<p id="opensans">Opensans text</p>
<p id="quicksand">Quicksand text</p>
<p id="ubuntu">Ubuntu text</p>
</section>
</body>
</html>
\ No newline at end of file
<link rel="stylesheet" href="../../style/style.css">
<h2>Our Tent Sites</h2>
<p>And some well-writen info about them</p>
\ No newline at end of file
This diff is collapsed.
var changeType = (function () {
pub = {};
pub.setup = function() {
var i;
buttons = $(".bookType");
for (i = 0; i < buttons.length; i++) {
buttons[i].onclick = changeSiteType;
buttons[i].style.cursor = "pointer";
}
}
function changeSiteType(a) {
if (this.innerHTML.toLowerCase().includes("cabin")) {
console.log("Cabin");
} else if (this.innerHTML.toLowerCase().includes("van")) {
console.log("Van");
} else if (this.innerHTML.toLowerCase().includes("tent")) {
console.log("Tent");
document.getElementById("info").innerHTML ='<object type="text/html" data="scripts/data/tentInfo.html"></object>';
}
}
return pub;
})();
$(document).ready(changeType.setup);
\ No newline at end of file
h2
\ No newline at end of file
@import "siteInfoStyle.css";
/* ======== FONTS ======== */
@font-face {
font-family: "Lato";
......@@ -29,20 +30,22 @@
--medblue: #00B6FF;
--lightblue: #5BC0EB;
--white: #FFFFFF;
--defaultSeperation: 20px;
}
/* ======== Variables ======== */
/* ======== Styling ======== */
/* Top Level Elements*/
/* Header & Header bar Elements*/
html {
background-color: var(--white);
min-width: 780px;
}
body {
margin: 0;
width: 100%;
}
/* Header */
header {
/* Position*/
padding: 10px;
......@@ -61,22 +64,7 @@ header h1 {
font-size: 40pt;
border: solid 2px;
}
/*Global*/
main section {
/* Position */
overflow: hidden;
padding: 0 0 20px;
width: auto;
margin: 20px 50px 20px 50px; /*MULTIPLE MARGIN DECLARATIONS, COULD IMPROVE*/
margin-top: 20px;
margin-bottom: 20px;
border: solid 2px;
/* Styling */
font-family: Opensans, serif;
background-color: var(--lightblue);
}
h2 {
#bookingTypes h2 {
/*Position*/
margin: 0;
/*Style*/
......@@ -84,17 +72,18 @@ h2 {
text-align: center;
}
/* Booking Section */
main #bookingTypes {
#bookingTypes {
overflow: hidden;
margin: 0;
width: 100%;
background-color: var(--black);
}
main #bookingTypes div {
#bookingTypes div {
margin: auto;
width: 646px;
overflow: hidden;
}
main #bookingTypes h2 {
#bookingTypes h2 {
/* Position */
width: 190px;
border: solid var(--black) 1px;
......@@ -108,44 +97,89 @@ main #bookingTypes h2 {
font-family: Quicksand, serif;
font-size: 20pt;
}
main #bookingTypes div h2:last-child { /*NEED TO MAKE WORK*/
#bookingTypes div h2:last-child { /*NEED TO MAKE WORK*/
margin-right: 0;
}
/* Site Specific Styling */
#siteSpecific {
/*Position*/
/* Main */
main {
overflow: hidden;
width: auto;
margin: 30px;
border: solid 1px;
margin: 20px;
padding: 20px;
/*Style*/
background-color: var(--lightblue);
}
main section {
background-color: var(--white);
}
/* Campsite info*/
#info {
margin: 0 0 var(--defaultSeperation) 0;
padding: 10px;
}
#info h2 {
font-family: Quicksand, serif;
margin: 0;
}
#info p {
font-family: Opensans, serif;
}
/* Booking form*/
#book {
width: 30%;
width: calc(40% - var(--defaultSeperation)*2);
float: left;
margin: 0 20px 0 50px;
margin: 0 0 20px 0;
padding: var(--defaultSeperation);
}
#book form {
#book h2 {
margin: 0 0 var(--defaultSeperation) 0;
float: left;
height: 30px;
font-family: Quicksand, serif;
}
#book input {
float: right;
width: 60%;
}
#book label {
width: auto;
display: block;
text-align: right;
margin: 0 5px 0 0;
width: calc(40% - 15px);
font-family: Quicksand, serif;
}
#book #first {
clear: left;
}
#book #submit {
margin: 0 0 var(--defaultSeperation) 0;
width: 70px;
height: 30px;
font-size: 105%;
font-family: Ubuntu, serif;
float: right;
display: block;
}
/* ======== Styling ======== */
img {
border: solid 1px;
width: 60%;
float: right;
margin: 0 10px 0 0;
/* Map */
#map {
border: solid 1px orange;
margin: 0;
float: right;
width: calc(60% - 30px);
height: 0;
padding: 0 0 calc(56.4%) 0;
overflow: hidden;
}
#photo {
margin: 0;
overflow: hidden;
width: 40%;