From 6fc8157ab11258b718d1eb8ac93dad9b36935bdc Mon Sep 17 00:00:00 2001
From: Azeem Fidahusein <azeem.fidahusein@gmail.com>
Date: Tue, 29 Jul 2025 00:15:40 +0100
Subject: [PATCH] added home button

---
 app/src/main.ts   | 12 ++++++++++
 app/src/style.css | 61 +++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 73 insertions(+)

diff --git a/app/src/main.ts b/app/src/main.ts
index 19b3a77..4991c06 100644
--- a/app/src/main.ts
+++ b/app/src/main.ts
@@ -52,10 +52,22 @@ class AAFHomepage {
       this.renderer
     )
 
+    // Setup home button functionality
+    this.setupHomeButton()
+
     // Initialize the scene
     this.init()
   }
 
+  private setupHomeButton(): void {
+    const homeButton = document.getElementById('home-button')
+    if (homeButton) {
+      homeButton.addEventListener('click', () => {
+        window.location.href = 'https://home.aaf.systems/'
+      })
+    }
+  }
+
   private init(): void {
     // Setup renderer
     this.renderer.setSize(window.innerWidth, window.innerHeight)
diff --git a/app/src/style.css b/app/src/style.css
index 56c7041..29969d2 100644
--- a/app/src/style.css
+++ b/app/src/style.css
@@ -38,10 +38,71 @@ html, body {
   cursor: crosshair;
 }
 
+.home-button {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 100;
+  
+  /* Frosted glass effect */
+  background: rgba(255, 255, 255, 0.1);
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  border-radius: 12px;
+  
+  /* Typography */
+  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
+  font-size: 1rem;
+  font-weight: 1000;
+  color: rgb(255, 255, 255);
+  letter-spacing: 1px;
+  
+  /* Layout */
+  padding: 1rem 2rem;
+  cursor: pointer;
+  user-select: none;
+  
+  /* Transitions */
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  
+  /* Remove default button styles */
+  border: none;
+  outline: none;
+}
+
+.home-button:hover {
+  background: rgba(255, 255, 255, 0.15);
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  transform: translate(-50%, -50%) translateY(-1px);
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
+}
+
+.home-button:active {
+  transform: translate(-50%, -50%) translateY(0);
+  background: rgba(255, 255, 255, 0.2);
+}
+
+.home-button span {
+  display: block;
+  position: relative;
+  color: rgba(255, 255, 255, 0.15);
+  filter: blur(0.3px);
+  -webkit-filter: blur(0.3px);
+}
+
 @media (max-width: 768px) {
   .logo {
     top: 1rem;
     left: 1rem;
     font-size: 1.25rem;
   }
+  
+  .home-button {
+    padding: 1.5rem 3rem;
+    font-size: 1.5rem;
+    letter-spacing: 3px;
+    /* Keep centered positioning on mobile */
+  }
 }