From 471cc3b6d745993fb8eb85534aa17a86fefec72d Mon Sep 17 00:00:00 2001
From: Raphael Forment <raphael.forment@gmail.com>
Date: Sat, 5 Aug 2023 19:39:13 +0200
Subject: [PATCH] cosmetic changes

---
 index.html  | 29 ++++++++++++++++-------------
 src/main.ts |  8 +++++++-
 2 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/index.html b/index.html
index 39df0d3..4ce081a 100644
--- a/index.html
+++ b/index.html
@@ -161,20 +161,23 @@
       <!-- This modal pops up when the page is first loaded and then disappears forever -->
       <div id="modal-container" class="motion-safe:animate-pulse flex min-h-screen flex flex-col">
       <div id="modal" class="bg-neutral-900 bg-opacity-50 flex justify-center items-center absolute top-0 right-0 bottom-0 left-0">
-        <div id="start-button" class="bg-white px-16 py-14 rounded-md text-center">
-         <h1 class="text-xl mb-4 font-bold text-white rounded bg-gray-800 py-4">Topos Prototype</h1>
-				 <div id="social-links" class="pb-4 font-bold flex flex-row space-x-4 justify-center">
-					<a href="https://google.fr">Website</a>
-					<a href="https://google.fr">Discord</a>
-					<a href="https://google.fr">Documentation</a>
-					<a href="https://google.fr">About</a>
-				 </div>
-         <div id="disclaimer" class="pb-4">
-          <p>This is Topos, an experimental live coding platform.</p>
-          <p>Switch to the <b>Help</b> (<b>Ctrl+b</b>) universe for a tutorial!</p>
-          <p>Have fun, press <b>Enter/Space</b> to get started!</p>
-          </div>
+        <div id="start-button" class="bg-white px-12 py-12 rounded-md text-center">
+         <h1 class="text-xl mb-4 font-bold text-white rounded bg-gray-800 py-4 mb-8">Topos Prototype</h1>
+          <div class="flex ml-0 lg:flex-row space-y-4 lg:space-y-0 flex-col w-auto min-w-screen px-0 lg:space-x-8 space-x-0">
+            <a href="https://github.com/Bubobubobubobubo/Topos" class="block max-w-sm p-6 border border-gray-200 rounded-lg shadow bg-gray-800 border-gray-700 hover:bg-gray-700">
+              <h5 class="mb-2 lg:text-2xl text-xl font-bold tracking-tight text-gray-900 dark:text-white">GitHub</h5>
+              <p class="font-normal text-gray-700 dark:text-gray-400">Get involved in the dev process and or file an issue for a broken feature</p>
+            </a>
+            <a href="https://discord.gg/aPgV7mSFZh" class="block max-w-sm p-6  border border-gray-200 rounded-lg shadow bg-gray-800 border-gray-700 hover:bg-gray-700">
+              <h5 class="mb-2 lg:text-2xl text-xl font-bold tracking-tight text-gray-900 dark:text-white">Discord</h5>
+              <p class="font-normal text-gray-700 dark:text-gray-400">Join the community on the official Topos/Sardine Discord Server.</p>
+            </a>
+            <a href="https://topos.raphaelforment.fr" class="block max-w-sm p-6 border border-gray-200 rounded-lg shadow bg-gray-800 border-gray-800 hover:bg-gray-700">
+              <h5 class="mb-2 text-xl lg:text-2xl font-bold tracking-tight text-gray-900 dark:text-white">Website</h5>
+              <p class="font-normal text-gray-700 dark:text-gray-400">Documentation, videos and more on the official website.</p>
+            </a>
           </div>
+        </div>
       </div>
 
       <div class="flex flex-row">
diff --git a/src/main.ts b/src/main.ts
index 1e82771..5ba19ac 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -693,6 +693,8 @@ function startClock() {
   document
     .getElementById("start-button")!
     .removeEventListener("click", startClock);
+  document
+    .removeEventListener("click", startClock);
   document.removeEventListener("keydown", startOnEnter);
   app.clock.start();
   app.view.focus();
@@ -702,9 +704,13 @@ function startClock() {
 function startOnEnter(e: KeyboardEvent) {
   if (e.code === "Enter" || e.code === "Space") startClock();
 }
+function startOnClick(e: MouseEvent) {
+  if (e.button === 0) startClock();
+}
 
 document.addEventListener("keydown", startOnEnter);
-document.getElementById("start-button")!.addEventListener("click", startClock);
+document.addEventListener("click", startOnClick);
+// document.getElementById("start-button")!.addEventListener("click", startClock);
 
 /**
  * @param event The mouse event