exercise update

content/exercise.md

@@ -0,0 +1,4 @@
+---
+title: "Exercise"
+type: exercise
+---

data/workouts/workout-2021-03-03_08-47-Wed_morning.yaml

@@ -0,0 +1,11 @@
+---
+type: "running"
+date: 2021-03-03T09:26:31+00:00
+comment: "Wed morning "
+distance: "4.909 km"
+duration: "00:38:33"
+pace: "7:420 min/km"
+calories: "432 kcal"
+image: "/images/workouts/workout-2021-03-03_08-47-Wed_morning.jpg"
+thumb: "/images/workouts/workout-2021-03-03_08-47-Wed_morning_thumb.jpg"
+---

layouts/exercise/single.html

@@ -0,0 +1,20 @@
+{{ define "main" }}
+<section class="author" style="display:none;">
+  <a rel="author" class="p-author h-card" rel="me" href="https://jon.kelbie.scot">{{ .Site.Params.Author }}<img src="/images/profile1.jpg"/></a>
+</section>
+<section class="exercise">
+<h2>Goal: Get fit again, increase stamina and strength</h2>
+{{ range sort .Site.Data.workouts "date" "desc"}}
+<section class="exercise_grid">
+<span class="type"><b>Type</b><br/>{{ .type | humanize }}</span>
+<span class="exdate"><b>Date</b><br/>{{ dateFormat "2 Jan 2006" .date }}</span>
+<span class="comment"><b>Comment</b><br/>{{ .comment | humanize }}</span>
+<span class="image"><a href="{{ .image }}" class="u-url"><img src="{{ .thumb }}" title="{{ .comment }}" alt="route map of outdoor exercise from fitotrack app" /></a></span>
+<span class="distance"><b>Distance</b><br/>{{ .distance }}</span>
+<span class="duration"><b>Duration</b><br/>{{ .duration }}</span>
+<span class="pace"><b>Pace</b><br/>{{ .pace }}</span>
+<span class="calories"><b>Calories burned</b><br/>{{ .calories }}</span>
+</section>
+{{ end }}
+</section>
+{{ end }}

themes/nipponalba/static/css/style.css

@@ -737,6 +737,60 @@ ol li{
 .index-note img{
   max-width: 500px;
 }
+.index_exercise{
+  width: 95%;
+}
+.exercise_grid{
+  max-width: 96%;
+  display:grid;
+  grid-template-columns: 15% 20% 25% 25% auto;
+  grid-template-rows: 105px 40px;
+  border: 1px solid var(--border-colour);
+  border-radius:15px;
+  margin: 0 auto;
+  padding: 10px;
+  margin-bottom: 20px;
+}
+.exercise_grid .type, .exercise_grid .distance{
+  grid-column: 1;
+}
+.exercise_grid .exdate, .exercise_grid .duration{
+  grid-column: 2;
+}
+.exercise_grid .pace{
+  grid-column: 3;
+}
+.exercise_grid .comment{
+  grid-column-start: 3;
+  grid-column-end: span 2;
+  width: 100%;
+}
+.exercise_grid .calories{
+  grid-column: 4;
+}
+.exercise_grid .image{
+  grid-column: 5;
+  text-align: right;
+  margin: -10px;
+  height: 100%;
+}
+.exercise_grid .image img{
+  border-radius: 0px 15px 15px 0px;
+  height: 165px;
+  object-fit:cover;
+  width: 100px;
+}
+.exercise_grid .type, .exercise_grid .exdate, .exercise_grid .comment{
+  grid-row: 1;
+}
+.exercise_grid .image{
+  grid-row: 1 / 2;
+}
+.exercise_grid .distance, .exercise_grid .duration, .exercise_grid .pace, .exercise_grid .calories{
+  grid-row: 2;
+  vertical-align: bottom;
+  height: 100%l
+}
 @media screen and (max-width: 960px) {
   #page-top {
     width: 95%;
@@ -797,6 +851,48 @@ article img{
   display:block;
   margin: 0px auto;
 }
+.exercise_grid{
+  max-width: 96%;
+  display:grid;
+  grid-template-columns: 35% 40% auto;
+  grid-template-rows: 40px 75px 40px 40px;
+}
+.exercise_grid .date, .exercise_grid .distance, .exercise_grid .comment, .exercise_grid .pace{
+  grid-column: 1;
+}
+.exercise_grid .exdate, .exercise_grid .duration, .exercise_grid .calories{
+  grid-column: 2;
+}
+.exercise_grid .image{
+  grid-column: 3;
+}
+.exercise_grid .comment{
+  grid-column-start: 1;
+  grid-column-end: span 2;
+  width: 100%;
+}
+
+.exercise_grid .image img{
+  border-radius: 0px 15px 15px 0px;
+  height: 215px;
+  object-fit:cover;
+  width: 100px;
+}
+.exercise_grid .type, .exercise_grid .exdate{
+  grid-row: 1;
+}
+.exercise_grid .comment{
+  grid-row: 2;
+}
+.exercise_grid .image{
+  grid-row: 1 / 4;
+}
+.exercise_grid .distance, .exercise_grid .duration{
+  grid-row: 3;
+}
+.exercise_grid .pace, .exercise_grid .calories{
+  grid-row: 4;
+}
 }
 @media screen and (max-width: 460px) {