feat(tag): collaspable

4 files changed, 40 insertions, 3 deletions

diff --git a/index.ts b/index.ts
index f67b2c6..57e044c 100644
--- a/index.ts
+++ b/index.ts
@@ -1 +1,7 @@
-console.log("Hello via Bun!");
\ No newline at end of file
+const tags = document.querySelectorAll<HTMLElement>(".tag")
+
+tags?.forEach(t => {
+    t.addEventListener("click", _ => {
+        t.classList.toggle("active")
+    })
+})
diff --git a/package.json b/package.json
index 3f8d026..8f1a633 100644
--- a/package.json
+++ b/package.json
@@ -5,7 +5,8 @@
   "scripts": {
     "build-sass": "sass --no-source-map --style=compressed scss/main.scss dist/styles.css",
     "watch-sass": "sass --watch scss/main.scss dist/styles.css",
-    "build": "bun run build-sass"
+    "build-js": "bun build ./index.ts --outdir ./dist --minify",
+    "build": "bun run build-sass && bun run build-js"
   },
   "devDependencies": {
     "@types/bun": "latest"
diff --git a/scss/main.scss b/scss/main.scss
index 4e2e904..b24b490 100644
--- a/scss/main.scss
+++ b/scss/main.scss
@@ -107,6 +107,10 @@ h3 {
   font-size: 1.5rem;
 }
 
+h4 {
+  font-size: 1.25rem;
+}
+
 .presentation {
   position: relative;
   display: flex;
@@ -194,6 +198,32 @@ h3 {
   }
 }
 
+.tags {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  margin-top: 1rem;
+  column-gap: 2rem;
+  row-gap: 1rem;
+  & h4 {
+    //text-align: center;
+  }
+  & p {
+    display: none;
+  }
+}
+
+.tag {
+  cursor: pointer;
+  &.active {
+    & h4 {
+      margin-bottom: 0.5rem;
+    }
+    & p {
+      display: block;
+    }
+  }
+}
+
 .credits-legal {
   width: 70%;
 }
diff --git a/templates/base/base.gohtml b/templates/base/base.gohtml
index e2cbb6f..634459c 100644
--- a/templates/base/base.gohtml
+++ b/templates/base/base.gohtml
@@ -18,7 +18,7 @@
         <p><a href="{{ .Data.Legal.LegalInformationLink }}">Legal information</a></p>
         <p><a href="/credits">Credits</a></p>
     </footer>
-{{/*    <script type="module" src="{{getAssetPath "index.js"}}" defer></script>*/}}
+    <script type="module" src="{{getAssetPath "index.js"}}" defer></script>
     </body>
     </html>
 {{end}}
\ No newline at end of file