From f3442b162a18eb157c555765c7767b5ce1dd48af Mon Sep 17 00:00:00 2001
From: Anton Livaja <anton@livaja.me>
Date: Fri, 14 Mar 2025 20:20:13 -0700
Subject: [PATCH] make cool arrows

---
 _layouts/roadmap.html | 45 ++++++++++++++++++++++++++++++++++---------
 _sass/base.scss       |  8 ++++++++
 2 files changed, 44 insertions(+), 9 deletions(-)

diff --git a/_layouts/roadmap.html b/_layouts/roadmap.html
index 0c132b8..3f9f3c1 100644
--- a/_layouts/roadmap.html
+++ b/_layouts/roadmap.html
@@ -68,7 +68,10 @@
 									<h5>Solution</h5>
 									<p>Standardize code to remove all version control system specific items, leaving only functionality related code and produce a hash based on the tree of all necessary files.</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -91,7 +94,10 @@
 									<h5>Solution</h5>
 									<p>Create a crowdsourcing framework which makes it easy to publish signed review of code</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -114,7 +120,10 @@
 									<h5>Solution</h5>
 									<p>Bootstrap a compiler in a detrministic manner, then use that compiler to build all packages, reproduce the work on different systems, and cryptoraphically sign resulting hashes.</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -137,7 +146,10 @@
 									<h5>Solution</h5>
 									<p>Create a bare-bones uni-kernel operating system which spins up a new VM for each build, and discards everything afterwards</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -159,7 +171,10 @@
 									<h5>Solution</h5>
 									<p>Create a tool for using a single source of entropy to derive all cryptographic algorithms required</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -181,7 +196,10 @@
 									<h5>Solution</h5>
 									<p>A framework for rapidly developing applications to perform transfer and staking cryptocurrency operations.</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -203,7 +221,10 @@
 									<h5>Solution</h5>
 									<p>A minimal deterministic unikernel Linux distribution designed for managing secrets offline.</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -225,7 +246,10 @@
 									<h5>Solution</h5>
 									<p>Leverage TPM2 to cryptoraphically attest to software that's running on a server</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
@@ -247,7 +271,10 @@
 									<h5>Solution</h5>
 									<p>A minimal, immutable, and deterministic Linux unikernel build system targeting various Trusted Execution Environments for use cases that require high security and accountability.</p>
 									<br>
-									<p class="learn-more">Learn more</p>
+									<a href="#roadmap" class="arrow-link">
+										Learn more
+										<span class="arrow">&#x2192;</span>
+									</a>
 								</div>
 							</a>
 						</div>
diff --git a/_sass/base.scss b/_sass/base.scss
index 3bbd919..5278b75 100644
--- a/_sass/base.scss
+++ b/_sass/base.scss
@@ -215,6 +215,13 @@ a:hover {
 	color: white !important;
 }
 
+.text-well:hover .arrow {
+  transform: translateX(5px);
+	background: none !important;
+  background-color: var(--base-color);
+	color: white !important;
+}
+
 .arrow-link:hover {
 	background: none !important;
   background-color: var(--base-color);
@@ -276,6 +283,7 @@ a:hover {
 	background: #1e1e1e;
 	transform: scale(1.01);
 	filter: unset;
+	cursor: pointer;
 }
 
 .roadmap .flex-container .flex-container-inner .text-well:hover .learn-more {