platformps · PhillipKinney · Jul 9, 2020 · Jul 9, 2020 · Jul 9, 2020 · Jul 10, 2020
diff --git a/Durham.html b/Durham.html
@@ -0,0 +1,143 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<!-- ----------------------------------------------------------------- -->
+<!-- ----------------------------------------------------------------- -->
+<!-- ----------------------------------------------------------------- -->
+<head> <!-- header begins here -->
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="description" content="">
+  <meta name="author" content="">
+
+  <link href="./css/style.css" rel="stylesheet">
+  <script type="text/javascript" src="./js/header-functions.js"></script>
+  <style>
+    @import url('https://fonts.googleapis.com/css2?family=Bangers&family=Roboto&display=swap');
+    </style>
+  <title>Durham</title>  
+</head> <!-- header ends here -->
+<!-- ----------------------------------------------------------------- -->
+<!-- ----------------------------------------------------------------- -->
+<!-- ----------------------------------------------------------------- -->
+<body> <!-- body begins here -->
+
+<div class="jumbotron text-center text-primary .bg-primary">
+    <h1>Durham</h1>
+</div>
+
+
+
+<div class="containter-fluid">
+<div class="row">
+    <div class= "col-xs-2 col-sm-2 col-md-2 col-lg-6">
+        <p> <h3 style="font-family: Bangers; color:blue;"><b>The Results are in!</b></h3></p>
+        <p><h4>The Top 5 Restaurants in Durham are:</h4></p>
+        <table class="table">
+            <thead>
+                <tr>
+                    <th>Rank</th>
+                    <th>Restaurant</th>
+                    <th>Cuisine</th>
+                    <th>Best Seller</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td>1</td>
+                    <td>Chicken Hut</td>
+                    <td>Southern</td>
+                    <td>Fried Chicken Plate</td>
+                </tr>
+                <tr>
+                    <td>2</td>
+                    <td>Bocci</td>
+                    <td>Pizza</td>
+                    <td>Nonnas Pizza</td>  
+                </tr> 
+                <tr>   
+                    <td>3</td>
+                    <td>Nantucket</td>
+                    <td>American Fare</td>
+                    <td>Prime Rib Plate</td>    
+                </tr>
+                <tr>    
+                    <td>4</td>
+                    <td>Nzingas</td>
+                    <td>Like Mamma's House</td>
+                    <td>Shrimp and Grits</td>
+                </tr>
+                <tr>    
+                    <td>5</td>
+                    <td>Fosters</td>
+                    <td>Modern</td>
+                    <td>Grit Bowl</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+
+    <div class= "row col-xs-2 col-sm-2 col-md-6 col-lg-6">
+        <div id= form class="form-group">
+            <h3>Tell us about your favorite Durham restaurant</h3>
+            <form>
+                <label for= "rname">Restaurant Name</label><br>
+                <input class= "form-control" type="text" id="rname" name="rname"><br>
+                <label for= "location">In what part of Raleigh is it located?</label><br>
+                <input class= "form-control" type="text" id="location" name="location"><br>
+                <label for= "favdish">Favorite Dish</label><br>
+                <input class= "form-control" type="favdish" id="favdish" name="favdish"><br>
+            </form>
+       </div> 
+    </div>
+ </div>
+    <div id= search class= "row col-xs-2 col-sm-2 col-md-2 col-lg-6">
+        <label for="search">Search one of the Top 5 Restaurants to see their weekly special</label><br>
+        <input id="search" type="text"><br>
+        <button>Search</button>
+        <div id= answerDiv2></div><br><br><br><br>
+    </div>
+</div>
+
+
+
+
+
+
+
+
+
+
+
+
+
+<!-- ---------------------------------------------------------------------------------- -->
+<!-- ---------------------------------------------------------------------------------- -->
+<!-- ---------------------------------------------------------------------------------- -->
+
+
+
+
+
+
+
+  <!-- ====================================================== -->
+  <!-- ====================================================== -->
+  <footer>
+    <!-- footer of page begins here -->
+    <script type="text/javascript" src="./js/footer-functions.js"></script>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> 
+    <script type="text/javascript" src="./js/Durham.js"></script>
+    <link href="./css/style.css" rel="stylesheet">
+  </footer> <!-- footer of page ends here -->
+  <!-- ====================================================== -->
+  <!-- ====================================================== -->
+
+</body>
+<!-- ---------------------------------------------------------------------------------- -->
+<!-- ---------------------------------------------------------------------------------- -->
+<!-- ---------------------------------------------------------------------------------- -->
+
+</html>
diff --git a/README.md b/README.md
diff --git a/README/README.md b/README/README.md
@@ -0,0 +1,44 @@
+# AD - SBA - HTML/CSS/JavaScript
+
+* Access my site by navigating to the following link: https://phillipkinney.github.io/sba.javascript_3-page-website/ 
+
+
+### Description
+* I decided to design a 3 page website the allows a user to see the top 5 restartants, submit thier favorite restaurants, and search for the weekly deals at one of the top 5 restaurants in Raleigh or Durham, NC.
+
+## Technologies Used
+*HTML
+*CSS
+*Bootstrap
+*Java Script
+
+## Design Process
+* I started by building a skeleton of the website using html and bootstrap elements. I then added in photos, tables, and made adjustments in CSS to bring the appearance more closely in line with what I wanted.
+
+* Once that was completed I added in the JavaScript element. I used JavaScript to add a search feature (see citation below) to my Raleigh and Durham pages that allows users to search for the weekly specials at the top 5 restaurants in each respective city.
+
+## Challenges
+* I ran into an issue with one of the links on my homepage not working. I did some research on StackOverflow and learned that the issue could be due a <Div> covering the link up. I checked my <Div>'s, and realized that this was the issue so I made the necessary adjustment.
+* Implementing and troubleshooting the JavaScript ended up being pretty time consuming. I had trouble deciding what to feature to add. The search feature I decided to add worked initially, but stopped working after I made some adjustments to the code. I reverted elements that could have caused the error, but still could not get it back working properly. On the upside, I feel like I gained a much better understanding of the eventhandler and how it interacts with HTML through this process.
+
+# Citation
+* Idea for the search feature came from the Mozilla Developer site. I adjusted the HTML and JavaSpript code where needed to fit my project.
+https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code
+
+
+### Deliverable:
+* A theme for your site that you feel comfortable with
+  * Complete all technical requirements for HTML, CSS, and Javascript
+  * Have markups of your pages
+  * Research for a public API that can provide you with content (Optional)
+  * Include a README file. The file should include technical specifications and description of your website.
+  * Host on GitHub,  include the link to your GitHub account in the README file(optional)
+  * Submit the project in a ZIP file
+
+
+
+
+
+
+
+