From 839d40447f44bec80475c9e8c74ba941dc88c81d Mon Sep 17 00:00:00 2001
From: b1rdmania <102524336+b1rdmania@users.noreply.github.com>
Date: Fri, 26 Dec 2025 20:28:23 +0000
Subject: [PATCH] Restore FAQ button at top-right.
Adds a top-right FAQ button in the hero while keeping a footer FAQ button, both opening the same modal.
---
index.html | 9 ++++++++-
src/main.ts | 3 +++
2 files changed, 11 insertions(+), 1 deletion(-)
diff --git a/index.html b/index.html
index 86c56af..d873760 100644
--- a/index.html
+++ b/index.html
@@ -67,6 +67,7 @@
.hero {
text-align: center;
margin: 0 0 calc(var(--spacing-unit) * 4) 0;
+ position: relative;
}
.hero h1 {
color: var(--color-accent-primary);
@@ -94,6 +95,11 @@
box-shadow: var(--shadow-sm);
border-color: rgba(255,255,255,0.22);
}
+ .faq-top {
+ position: absolute;
+ top: 0;
+ right: 0;
+ }
/* FAQ modal */
.modal-backdrop {
@@ -938,6 +944,7 @@
+
MOTIF
Procedural music generated from MIDI structure
@@ -1035,7 +1042,7 @@
diff --git a/src/main.ts b/src/main.ts
index 7d6889a..5d9ca2a 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -54,6 +54,7 @@ class MotifApp {
// FAQ modal
private faqBtn!: HTMLButtonElement;
+ private faqBtnFooter: HTMLButtonElement | null = null;
private faqBackdrop!: HTMLElement;
private faqCloseBtn!: HTMLButtonElement;
@@ -123,6 +124,7 @@ class MotifApp {
// FAQ modal
this.faqBtn = document.getElementById('faqBtn') as HTMLButtonElement;
+ this.faqBtnFooter = document.getElementById('faqBtnFooter') as HTMLButtonElement | null;
this.faqBackdrop = document.getElementById('faqModalBackdrop')!;
this.faqCloseBtn = document.getElementById('faqCloseBtn') as HTMLButtonElement;
}
@@ -161,6 +163,7 @@ class MotifApp {
// FAQ
this.faqBtn.addEventListener('click', () => this.openFaq());
+ this.faqBtnFooter?.addEventListener('click', () => this.openFaq());
this.faqCloseBtn.addEventListener('click', () => this.closeFaq());
this.faqBackdrop.addEventListener('click', (e) => {
if (e.target === this.faqBackdrop) this.closeFaq();