From ad542d20f93705305c7a4ce2f0afd6093c35934a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cl=C3=A9ment=20Pit-Claudel?= <clement.pit-claudel@epfl.ch>
Date: Tue, 24 Dec 2024 12:59:56 +0100
Subject: [PATCH] client: Make home page tiles regular links
---
.../scala/cs214/webapp/client/Pages.scala | 22 +++++++++----------
jvm/src/main/resources/www/static/main.css | 8 +++++++
2 files changed, 19 insertions(+), 11 deletions(-)
diff --git a/js/src/main/scala/cs214/webapp/client/Pages.scala b/js/src/main/scala/cs214/webapp/client/Pages.scala
index 99c093e..c94551b 100644
--- a/js/src/main/scala/cs214/webapp/client/Pages.scala
+++ b/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="")
)
)
)
diff --git a/jvm/src/main/resources/www/static/main.css b/jvm/src/main/resources/www/static/main.css
index 0f301ef..e7531e7 100644
--- a/jvm/src/main/resources/www/static/main.css
+++ b/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;
--
GitLab