vmcgargill · vmcgargill · Oct 3, 2020 · Oct 3, 2020 · Oct 3, 2020 · Oct 3, 2020
diff --git a/models/user.js b/models/user.js
@@ -53,7 +53,7 @@ module.exports = function(sequelize, DataTypes) {
         len: [0, 5000]
       }
     },
-    intrests: {
+    interests: {
       type: DataTypes.TEXT,
       allowNull: true,
       validate: {

diff --git a/public/js/users/editprofile.js b/public/js/users/editprofile.js
@@ -9,7 +9,7 @@ $(document).ready(function() {
         formData.append("title", $("#title").val())
         formData.append("bio", $("#bio").val())
         formData.append("hobbies", $("#hobbies").val())
-        formData.append("intrests", $("#intrests").val())
+        formData.append("interests", $("#interests").val())
         formData.append("website", $("#website").val())
 
         const image = document.getElementById("picture");

diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
@@ -1,3 +1,7 @@
+/* Todo: Card layout for profiles
+        align PROFILE to center*/
+
+
 form.signup,
 form.login {
   margin-top: 50px;
@@ -33,22 +37,34 @@ form.login {
   color: white;
 }
 
-.nav-link:hover, #SearchBlogBtn:hover, .btn:hover, button:hover  {
+.nav-link:hover  {
   color: white;
   background-color: rgb(21, 28, 48);
   transition-duration: 1s;
 }
 
-/* Includes Search bar and buttons */
-button, input, #SearchBlogInput, select, .btn {
+button:hover, .btn:hover {
+  background-color: rgb(43, 80, 87);
+}
+
+#SearchBlogBtn:hover {
+  background-color: rgb(21, 28, 48);
+}
+
+/* search bar / selection */
+input, #SearchBlogInput, select {
   border-style: solid;
-  border-radius: 8px;
+  border-radius: 3px;
   border-color: rgb(43, 80, 87);
 }
 
 /* Specifies buttons only */
 button, #SearchBlogBtn, .btn {
   background-color: rgb(74, 158, 151);
+  border-style: solid;
+  border-radius: 5px;
+  border-color: rgb(43, 80, 87);
+  color: white;
 }
 
 .hidden {
@@ -97,6 +113,15 @@ body {
   text-align: center;
 }
 
+.form-group {
+  margin-top: 20px;
+}
+
+/* Aligns sign up / login page to center */
+.row {
+  justify-content: center;
+}
+
 .todo-list {
   margin: 0 auto;
   margin-top: 75px;

diff --git a/routes/users-api-routes.js b/routes/users-api-routes.js
@@ -27,7 +27,7 @@ module.exports = function(app) {
       title: req.body.title,
       bio: req.body.bio,
       hobbies: req.body.hobbies,
-      intrests: req.body.intrests
+      interests: req.body.interests
     }
 
     // Function that DOBLE checks if string is URL so query does not crash

diff --git a/routes/users-html-routes.js b/routes/users-html-routes.js
@@ -13,7 +13,11 @@ module.exports = function(app) {
           id: user.id,
           name: user.name,
           email: user.email,
-          picture: user.picture
+          picture: user.picture,
+          bio: user.bio,
+          hobbies: user.hobbies,
+          interests: user.interests,
+          title: user.title
         })
       });
       res.render("users/members", {
@@ -67,7 +71,7 @@ module.exports = function(app) {
         bio: member.bio,
         website: member.website,
         hobbies: member.hobbies,
-        intrests: member.intrests
+        interests: member.interests
       };
 
       let handlebarTemp = "partials/viewmember";
@@ -95,7 +99,7 @@ module.exports = function(app) {
         title: user.title,
         bio: user.bio,
         hobbies: user.hobbies,
-        intrests: user.intrests,
+        interests: user.interests,
         website: user.website
       }
       res.render("users/editprofile", {

diff --git a/seed.sql b/seed.sql
@@ -1,5 +1,5 @@
 -- Insert into Categories
-INSERT INTO category (name)
+INSERT INTO Categories (name)
 VALUES 
 ("General"), 
 ("Social"),
@@ -8,4 +8,4 @@ VALUES
 ("Movies"),
 ("Sports"),
 ("Video Games"),
-("Recreational Activities")
+("Recreational Activities");
diff --git a/views/blogs/blogs.handlebars b/views/blogs/blogs.handlebars
@@ -1,4 +1,4 @@
-<h1>View All Blogs and Filter Here</h1><br>
+<h1>View All Blogs</h1><br>
 
 <label for="users">Filter by Author</label>
 <select name="users" id="users" class="DropDowns">

diff --git a/views/blogs/postblog.handlebars b/views/blogs/postblog.handlebars
@@ -1,7 +1,7 @@
-<h1>Post new blogs here</h1>
+<h1>Post New Blogs</h1>
 
 <div class="row">
-	<div class="col-md-6 offset-md-3">
+	<div class="col-md-6">
 		<form id="submitForm">
 			<div class="form-group">
 				{{!-- Enter Title --}}

diff --git a/views/login.handlebars b/views/login.handlebars
@@ -1,5 +1,5 @@
 <div class="row">
-      <div class="col-md-6 col-md-offset-3">
+      <div class="col-md-6">
         <h2>Login Form</h2>
         <form class="login">
           <div class="form-group">

diff --git a/views/partials/filterblogs.handlebars b/views/partials/filterblogs.handlebars
@@ -1,4 +1,4 @@
-<ul id="BlogList">
+{{!-- <ul id="BlogList">
   {{#each blog }}
     <li class='list-group-item blog-item'>
       <a href="/blog/{{ id }}" class="blogTitle">{{title}}</a><br>
@@ -7,4 +7,22 @@
       Category: <a>{{ category }}</a><br>
       <a>Mood: {{ mood }}</a></li>
   {{/each}}
-</ul>
+</ul> --}}
+
+{{#each blog }}
+  <div class="card" style="width: 18rem;">
+    <img class="card-img-top" src="{{ memberPicture }}" alt="Card image cap">
+    <div class="card-body">
+      <h5 class="card-title">{{title}}</h5>
+      <p class="blogBody card-text">{{ body }}</p>
+    </div>
+    <ul class="list-group list-group-flush">
+      <li class="list-group-item">Category: {{ category }}</li>
+      <li class="list-group-item">Mood: {{ mood }}</li>
+    </ul>
+    <div class="card-body">
+      <a href="/blog/{{ id }}" class="card-link">View Blog</a>
+      <a href="/member/{{ UserId }}" class="card-link">View Author</a>
+    </div>
+  </div>
+{{/each}}
diff --git a/views/partials/viewmember.handlebars b/views/partials/viewmember.handlebars
@@ -1,4 +1,4 @@
-<h1>See a specific member profiles here</h1>
+<h1>Member Profile</h1>
 
 <img src="{{ member.picture }}" alt="Profile Picture" width="250"> <br><br>
 
@@ -7,8 +7,7 @@ Email: {{ member.email }} <br>
 Title: {{ member.title }} <br>
 Bio: {{ member.bio }} <br>
 Hobbies: {{ member.hobbies }} <br>
-Intrests: {{ member.intrests }} <br>
+Interests: {{ member.interests }} <br>
 Website: <a href="{{ member.website }}" target="_blank">{{ member.website }}</a> <br>
 
-
 <div id="UserBlogs">{{> filterblogs}}</div>
diff --git a/views/users/editprofile.handlebars b/views/users/editprofile.handlebars
@@ -1,4 +1,5 @@
-<h1>Edit user profile here</h1>
+<h1>Edit User Profile</h1>
+
 <br>
 <br>
 <form id="updateprofile">
@@ -12,11 +13,11 @@
   <textarea type="text" placeholder="Bio" name="bio" id="bio" rows="5" maxlength="1000">{{user.bio}}</textarea><br><br>
   <label for="hobbies">Hobbies:</label><br>
   <textarea type="text" placeholder="Hobbies" name="hobbies" id="hobbies" rows="3" maxlength="5000">{{user.hobbies}}</textarea><br><br>
-  <label for="intrests">Intrests:</label><br>
-  <textarea type="text" placeholder="Intrests" name="intrests" id="intrests" rows="3" maxlength="5000">{{user.intrests}}</textarea><br><br>
+  <label for="interests">Interests:</label><br>
+  <textarea type="text" placeholder="Interests" name="interests" id="interests" rows="3" maxlength="5000">{{user.interests}}</textarea><br><br>
   <label for="website">Website:</label><br>
   <input type="text" placeholder="Website" name="website" id="website" maxlength="300" value="{{user.website}}"><br><br>
-  <label for="picture">Upload Ne Profile Picture:</label><br>
+  <label for="picture">Upload New Profile Picture:</label><br>
   <input type="file" name="picture" id="picture" ><br><br>
   <input type="submit">
 </form>
diff --git a/views/users/members.handlebars b/views/users/members.handlebars
@@ -1,5 +1,33 @@
-<h1>See All members here</h1>
+<h1>See All Members</h1>
 
-{{#each user }}
+{{!-- {{#each user }}
   <li class='list-group-item'><img src="{{ picture }}" alt="Profile Picture" width="100"><a href="/member/{{ id }}">{{ name }}, {{ email }}</a></li>
+{{/each}} --}}
+{{!-- 
+{{#each user }}
+  <div class="card" style="width: 18rem;">
+    <img class="card-img-top" src="{{ picture }}" alt="Card image cap">
+    <div class="card-body">
+      <h5 class="card-title">{{ name }}</h5>
+      <p class="card-text">{{ bio }}</p>
+    </div>
+  </div>
+{{/each}} --}}
+
+{{#each user }}
+<div class="card" style="width: 18rem;">
+  <img class="card-img-top" src="{{ picture }}" alt="Card image cap">
+  <div class="card-body">
+    <h5 class="card-title">{{name}}</h5>
+    <p class="card-text">{{ bio }}</p>
+  </div>
+  <ul class="list-group list-group-flush">
+    <li class="list-group-item">Title: {{title}}</li>
+    <li class="list-group-item">Hobbies: {{hobbies}}</li>
+    <li class="list-group-item">Interests: {{interests}}</li>
+  </ul>
+  <div class="card-body">
+    <a href="/member/{{ id }}" class="card-link">View Profile</a>
+  </div>
+</div>
 {{/each}}