From aa93ae6918d125544313a0b977f5392ded760147 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Fri, 26 Jan 2024 21:34:40 -0600
Subject: [PATCH] feat: better tool titles

---
 src/app/tools/layout.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/app/tools/layout.tsx b/src/app/tools/layout.tsx
index 9b7ee134d..fcd926dcc 100644
--- a/src/app/tools/layout.tsx
+++ b/src/app/tools/layout.tsx
@@ -1,5 +1,6 @@
 'use client';
 
+import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 import { ReactNode, Suspense } from 'react';
 import { TOOLS } from '../../constants/tools';
@@ -24,7 +25,6 @@ export default function ToolsLayout({ children }: ToolsLayoutProps) {
           display: 'flex',
           alignItems: 'center',
           justifyContent: 'center',
-          gap: 4,
           flexDirection: 'column',
           position: 'relative',
           overflow: 'hidden',
@@ -46,14 +46,18 @@ export default function ToolsLayout({ children }: ToolsLayoutProps) {
           }}
         />
 
-        <span
+        <Link
+          href={`/tools/${toolId}`}
           style={{
+            textDecoration: 'none',
+            fontWeight: 900,
             color: theme.colors.textHighContrast,
             fontSize: 32,
+            letterSpacing: -1,
           }}
         >
           {tool?.title}
-        </span>
+        </Link>
         <span
           style={{
             color: theme.colors.textLowContrast,