client: Make home page tiles regular links

js/src/main/scala/cs214/webapp/client/Pages.scala

@@ -28,16 +28,16 @@ object Page:
 abstract class AppCatalogPage extends Page:
   def render(apps: Seq[AppInfo]): Frag
 
-  def selectApp(appId: AppId): Unit =
-    WebClient.navigateTo(InstanceCreationPage(appId))
-
-  def renderApp(appInfo: AppInfo): Frag =
-    figure(
-      onclick := (() => selectApp(appInfo.id)),
-      img(src := s"/static/${appInfo.id}.png"),
-      figcaption(
-        h4(appInfo.name),
-        p(appInfo.description)
+  def renderApp(appInfo: AppInfo, classes: String): Frag =
+    a(
+      cls := "app " + classes,
+      href := WebClient.url(InstanceCreationPage(appInfo.id)),
+      figure(
+        img(src := s"/static/${appInfo.id}.png"),
+        figcaption(
+          h4(appInfo.name),
+          p(appInfo.description)
+        )
       )
     )
 
@@ -57,7 +57,7 @@ object HomePage extends AppCatalogPage:
           h2(year.toString),
           section(cls := "app-grid",
             apps.sortBy(_.name).map: appInfo =>
-              renderApp(appInfo)
+              renderApp(appInfo, classes="")
           )
       )
     )

jvm/src/main/resources/www/static/main.css

@@ -171,6 +171,14 @@ form > *:last-child {
     grid-gap: 1rem;
 }
 
+.app-grid > a {
+    color: inherit;
+    display: grid;
+    text-decoration: none;
+    grid-template-columns: minmax(0, 1fr);
+    grid-template-rows: minmax(0, 1fr);
+}
+
 .app-grid figure {
     word-wrap: break-word;
     border-radius: 0.5rem;