Skip to content

Commit

Permalink
workout details css added
Browse files Browse the repository at this point in the history
  • Loading branch information
pik-nik committed Mar 17, 2023
1 parent 30ed89a commit bbf6ac7
Show file tree
Hide file tree
Showing 7 changed files with 184 additions and 57 deletions.
13 changes: 4 additions & 9 deletions controllers/workout_controller.js
Original file line number Diff line number Diff line change
Expand Up @@ -210,15 +210,10 @@ router.put("/workouts/:workoutid/exercise/:exerciseid", (req, res) => {
})

router.put("/workouts/:id", (req, res) => {
if (!req.body.name || !req.body.workout_date) {
res.redirect(`/workouts/${req.params.id}/edit`)
return
} else {
const sql = "UPDATE workouts SET name = $1, workout_date = $2 WHERE workout_id = $3;"
db.query(sql, [req.body.name, req.body.date, req.params.id], (err, dbRes) => {
res.redirect(`/workouts/${req.params.id}`)
})
}
const sql = "UPDATE workouts SET name = $1, workout_date = $2 WHERE workout_id = $3;"
db.query(sql, [req.body.name, req.body.date, req.params.id], (err, dbRes) => {
res.redirect(`/workouts/${req.params.id}`)
})
})

router.delete("/workouts/:workoutid/exercise/:exerciseid/log/:logid", (req, res) => {
Expand Down
6 changes: 3 additions & 3 deletions public/css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -141,14 +141,14 @@ main {

main h2 {
margin: 0px;
padding: 15px 0;
padding: 30px 0 20px 0;
color: #4B0082;
font-size: 1.5em;
font-size: 3em;
}

footer {
border-top: 1px solid #4B0082;
background-color: #ffffff;
padding: 15px 0;
padding: 15px 10px;
font-size: 1em;
}
119 changes: 117 additions & 2 deletions public/css/workout_details.css
Original file line number Diff line number Diff line change
@@ -1,11 +1,126 @@
.workout_details h3 {
font-family: 'Bebas Neue', cursive;
color: #522d80;
font-size: 3em;
}

.btn-workout {
width: 30%;
display: grid;
margin: 10px auto 20px auto;
grid-template-columns: 50% 50%;
}

.btn-workout button {
background: #32174d;
border-radius: 3px;
color: #fff;
}

.btn-workout button:hover {
background-color: #621da8;
color: #fff;
}

.exercises {
border: 1px solid black;
width: 80%;
margin: 20px auto;

background: #FAFAFA;
padding: 20px;
box-shadow: 1px 1px 25px rgba(0, 0, 0, 0.35);
border-radius: 10px;
border: 6px solid #4B0082;
}

.exercises h4 {
color: #522d80;
font-size: 2em;
}

.exercise_log {
border: 2px solid pink;
margin: 20px auto;
width: 80%;
border:1px solid #DDDDDD;
border-radius: 3px;
display: grid;
grid-template-columns: 40% 60%;
}

.btn-exercises {
width: 80%;
display: grid;
margin: 0 auto;
grid-template-columns: 50% 50%;
}

.btn-exercises button {
/* background: #32174d; */
background-color: #621da8;
border-radius: 3px;
color: #fff;
}

.btn-exercises button:hover {
/* background-color: #621da8; */
background: #32174d;
color: #fff;
}

.exercise_name {
padding: 20px 0;
color: #522d80;
font-size: 2em;
}

.sets_list {
border: 2px solid skyblue;
padding: 0;
display: grid;
margin: 0 auto;
grid-template-columns: 50% 50%;

}

.sets_list {
list-style: none;
}

.sets_detail {
padding: 10px;

}

.btn-sets form {
margin: 6px;
}


.btn_add_set {
/* background: #32174d; */
background-color: #621da8;
border-radius: 3px;
color: #fff;
margin:10px;
}

.btn_add_set:hover {
/* background-color: #621da8; */
background: #32174d;
color: #fff;
}


.btn_add_exercise {
/* background: #32174d; */
background-color: #621da8;
border-radius: 3px;
color: #fff;
margin:10px;
}

btn_add_exercise:hover {
/* background-color: #621da8; */
background: #32174d;
color: #fff;
}
1 change: 1 addition & 0 deletions views/edit_log.ejs
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@
</li>
</ul>
</form>
<!-- <a href="/workouts/%=workoutId%>">Back to workout details</a> -->
</section>
</body>

Expand Down
6 changes: 3 additions & 3 deletions views/edit_workout.ejs
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,18 @@
<body>
<section class="form_container">
<h2>Edit workout</h2>
<form action="/workouts/<%= workout.workout_id%>/?_method=PUT" method="post">
<form action="/workouts/<%= workout.workout_id%>?_method=PUT" method="post">
<!-- <input type="hidden" name="_method" value="put"/> -->
<input type="hidden" name="workout_id" value="<%=workout.workout_id%>"/>
<ul>
<li>
<label for="date">Date</label>
<input type="date" name="date" value="<%=workout.to_char%>">
<input type="date" name="date" value="<%=workout.to_char%>" required/>
<span>Update the workout date</span>
</li>
<li>
<label for="">Workout Name</label>
<input type="text" name="name" value="<%=workout.name%>"/>
<input type="text" name="name" value="<%=workout.name%>" required/>
<span>Update the workout name</span>
</li>
<li>
Expand Down
1 change: 1 addition & 0 deletions views/new_log.ejs
Original file line number Diff line number Diff line change
Expand Up @@ -27,5 +27,6 @@
</li>
</ul>
</form>
<a href="/workouts/<%=workoutId%>">Back to workout details</a>
</section>
</body>
95 changes: 55 additions & 40 deletions views/workout_details.ejs
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,10 @@
<p><%= workout.to_char %></p>

<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<div>
<button><a href="/workouts/<%=workout.workout_id%>/edit">edit workout name/date</a></button>
<div class="btn-workout">
<form action="/workouts/<%=workout.workout_id%>/edit">
<button>edit workout name/date</button>
</form>
<form action="/workouts/<%=workout.workout_id%>?_method=DELETE" method="post">
<!-- <input type="hidden" name="_method" value="delete" /> -->
<button>delete workout</button>
Expand All @@ -23,53 +25,66 @@
<h4>Exercises</h4>
<% for (const exercise of exercises){%>
<div class="exercise_log">
<p><%=exercise.name%></p>
<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<div>
<button><a href="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>/edit">edit exercise name</a></button>
<form action="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>?_method=DELETE" method="post">
<!-- <input type="hidden" name="_method" value="delete" /> -->
<button>delete exercise</button>
</form>
</div>
<% } %>
<div class="exercise_details">
<p class="exercise_name"><%=exercise.name%></p>
<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<div class="btn-exercises">
<form action="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>/edit">
<button>edit exercise name</button>
</form>
<form action="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>?_method=DELETE" method="post">
<button>delete exercise</button>
</form>
</div>
<% } %>
</div>
<div class="log_details">
<% for (const logdata of logdatas){ %>
<% if (logdata.junction_id === exercise.junction_id) {%>
<ul class="sets_list">
<li>sets: <%= logdata.sets%></li>
<li>reps:<%= logdata.reps%> </li>
<li>weight: <%= logdata.weight%></li>
<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<div>
<li><button><a href="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>/log/<%=logdata.log_id%>/edit">edit this set</a></button></li>
<li><form action="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>/log/<%=logdata.log_id%>?_method=DELETE" method="post">
<!-- <input type="hidden" name="_method" value="delete" /> -->
<button>delete this set</button>
</form></li>
</div>
<% } %>
<div class="sets_detail">
<li>sets: <%= logdata.sets%></li>
<li>reps: <%= logdata.reps%> </li>
<li>weight: <%= logdata.weight%> kg</li>
</div>
<div class="btn-sets">
<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<li>
<form action="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>/log/<%=logdata.log_id%>/edit">
<button>edit this set</button>
</form>
<form action="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>/log/<%=logdata.log_id%>?_method=DELETE" method="post">
<!-- <input type="hidden" name="_method" value="delete" /> -->
<button>delete this set</button>
</form>
</li>
<% } %>
</div>
</ul>
<% } %>
<% } %>
<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<div>
<button><a href="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>">add set</a></button>
</div>
<% } %>
</div>
<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<form action="/workouts/<%=workout.workout_id%>/exercise/<%=exercise.exercise_id%>">
<button class="btn_add_set">add set</button>
</form>
<% } %>
</div>
</div>
<% } %>

<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<form action="/workouts/<%=workout.workout_id%>/exercise/new">
<button class="btn_add_exercise">
add exercise
</button>
</form>
<% } %>
</div>
<% if (Number(userIdLoggedIn) === workout.user_id) { %>
<div>
<button> <a href="/workouts/<%=workout.workout_id%>/exercise/new">Add Exercise</a> </button>
</div>
<% } %>

</body>


Expand Down

0 comments on commit bbf6ac7

Please sign in to comment.