From 1a47dea58081cd021f8b61b7c5ec1dd6b3f3ff4d Mon Sep 17 00:00:00 2001
From: Jonathan Barrow <jonbarrow1998@gmail.com>
Date: Mon, 19 Sep 2022 16:01:49 -0400
Subject: [PATCH] Added quick nav  to progress page

---
 public/assets/css/progress.css | 10 ++++++++++
 src/server.js                  |  3 +++
 views/progress.handlebars      | 15 ++++++++++++++-
 3 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/public/assets/css/progress.css b/public/assets/css/progress.css
index e6cea05..18e77df 100644
--- a/public/assets/css/progress.css
+++ b/public/assets/css/progress.css
@@ -1,3 +1,13 @@
 /*
 MOVE PROGRESS CSS HERE
 */
+#quick-nav a {
+	color: var(--text-shade-1);
+	text-decoration: none;
+	width: fit-content;
+}
+
+#quick-nav a:hover {
+	color: var(--text-shade-3);
+	text-decoration: underline;
+}
\ No newline at end of file
diff --git a/src/server.js b/src/server.js
index 002ca73..940ed15 100644
--- a/src/server.js
+++ b/src/server.js
@@ -187,6 +187,9 @@ app.engine('handlebars', handlebars({
 
 			return value;
 		},
+		slug(string) {
+			return string.toLowerCase().replaceAll(/ /g, '-');
+		}
 	}
 }));
 app.set('view engine', 'handlebars');
diff --git a/views/progress.handlebars b/views/progress.handlebars
index 0013e77..2f0f574 100644
--- a/views/progress.handlebars
+++ b/views/progress.handlebars
@@ -1,3 +1,5 @@
+<link rel="stylesheet" href="/assets/css/progress.css">
+
 <div class="wrapper">
 
 	{{> header}}
@@ -19,8 +21,19 @@
 			<p class="localeReplace">{{{ localeHelper locale "donation.progress" }}} {{{ localeHelper locale "donation.upgradePush" }}}</p>
 		</div>
 
+		<div id="quick-nav">
+			<h1 class="title dot">Quick Nav</h1>
+			<ul>
+				{{#each progressLists.sections}}
+				<li>
+					<a href="#{{slug this.title}}">{{this.title}}</a>
+				</li>
+				{{/each}}
+			</ul>
+		</div>
+		<br>
 		{{#each progressLists.sections}}
-		<div class="purple-card">
+		<div class="purple-card" id="{{slug this.title}}">
 			{{> progress-list data=this }}
 		</div>
 		{{/each}}