From 579677e11c009478ccdecd686a9ff771aab2f479 Mon Sep 17 00:00:00 2001 From: Timo <6156589+Shik3i@users.noreply.github.com> Date: Mon, 18 May 2026 20:43:02 +0200 Subject: [PATCH] feat(website): overhaul interactive extension mockup alignment and update server docker/caddy examples --- website/index.html | 224 +++++++++++++++++++++++++-------------------- website/style.css | 5 + 2 files changed, 129 insertions(+), 100 deletions(-) diff --git a/website/index.html b/website/index.html index 972e6f9..a12b27c 100644 --- a/website/index.html +++ b/website/index.html @@ -112,123 +112,151 @@
-
- brave-eagle-80 - Official Server +
+
+ Active RoomAktiver Raum + brave-eagle-80 +
+ Official ServerOffizieller Server
-
Invite Link
+
Invite LinkEinladungs-Link
- +
-
-
Peers in Room
+
+
Peers in RoomTeilnehmer im Raum
CoolUsername - YOU + YOUICH
🎬 Germany's Next Flopmodel - S21E12
-
● 0:55 • Playing
+
● 0:55 • PlayingWiedergabe
KoalaPC - Peer + PeerPartner
🎬 Germany's Next Flopmodel - S21E12
-
● 0:55 • Playing
+
● 0:55 • PlayingWiedergabe
- +
-
- ⭐ MATCH: Germany's Next Flopmodel - S21E12 +
+ +
-
-
Remote Control
-
- - - -
+ + +
+ +
-
-
Last Activity Status
-
- PAUSE - ● In Sync + + + +
+
+ PAUSE + ● In Sync
-
- Pause triggered by CoolUsername +
+ Pause triggered by CoolUsernamePause ausgelöst durch CoolUsername
-
-
Your Username
- +
+ +
-
-
Preferences
-
- -
- -

Hide common non-video websites from the target selector.

-
-
-
- -
- -

Automatically sync transitions between series episodes.

-
-
+ +
+ + +
+ +
+ + +
+ +
+

• Username helps others identify you.Benutzername hilft anderen, dich zu erkennen.

+

• Noise filtering hides common non-video sites.Noise-Filterung blendet allgemeine Seiten aus.

+
+ +
+ +
-
-
-
Diagnostics
-
-
-
Ready State
- HAVE_ENOUGH_DATA -
-
-
Seek Delta
- 0.05s -
-
-
Buffered
- 300.2s -
-
-
Engine State
- SYNCED -
-
+ +
+ + + ConnectedVerbunden + +
-
-
Event Stream
-
-
[18:37:32] EVENT: PLAY -> ACK
-
[18:37:32] FORCE_SYNC -> 0.05s diff
-
[18:37:38] EVENT: PAUSE -> BROADCAST
-
[18:37:42] content_heartbeat: active
-
+ + +
+
readyState: HAVE_ENOUGH_DATA
+
seekDelta: 0.05s
+
buffered: 300.2s
+
engineState: SYNCED
+
+ + +
+
[18:37:32] EVENT: PLAY -> ACK
+
[18:37:32] FORCE_SYNC -> 0.05s diff
+
[18:37:38] EVENT: PAUSE -> BROADCAST
+
[18:37:42] content_heartbeat: active
@@ -417,36 +445,32 @@
- 
version: "3.8"
-
-services:
-  koalasync:
+                        
services:
+  koala-sync:
     image: ghcr.io/shik3i/koalasync:latest
-    container_name: koalasync-relay
-    ports:
-      - "3000:3000"
-    environment:
-      - NODE_ENV=production
-      - PORT=3000
+    container_name: KoalaSync
     restart: always
-    logging:
-      driver: "json-file"
-      options:
-        max-size: "10m"

+    # Access internally by proxying to container port 3000
+    environment:
+      - TZ=Europe/Berlin
+      - PORT=3000
+      - MIN_VERSION=1.0.0
+      - MAX_ROOMS=100
+      - MAX_PEERS_PER_ROOM=50
+    pids_limit: 2048
- 
# Reverse proxy for your secure WebSocket relay server
-sync.yourdomain.com {
-    reverse_proxy localhost:3000
+                        
sync.koalastuff.net {
+    # Specify the web root inside the container
+    root * /var/www/html
 
-    header {
-        # Security policies
-        Permissions-Policy "interest-cohort=()"
-        Strict-Transport-Security "max-age=31536000; includeSubDomains; preload"
-        X-Content-Type-Options "nosniff"
-        X-Frame-Options "DENY"
-    }
+    # Enable static file server to deliver HTML, CSS, JS
+    file_server
+}
+
+syncserver.koalastuff.net {
+    reverse_proxy KoalaSync:3000
 }
diff --git a/website/style.css b/website/style.css index 0f7f06a..61d1813 100644 --- a/website/style.css +++ b/website/style.css @@ -335,6 +335,11 @@ nav { flex-direction: column; gap: 0.85rem; font-size: 0.8rem; + scrollbar-width: none; /* Firefox */ +} + +.mock-body::-webkit-scrollbar { + display: none; /* Chrome, Safari, Opera */ } .mock-screen {