From fa1933986867f6d531b639d5f026567f6217c0d4 Mon Sep 17 00:00:00 2001
From: WBHarry <williambjrklund@gmail.com>
Date: Wed, 11 Feb 2026 23:34:10 +0100
Subject: [PATCH] Fixed better sceneNavigation compatability

---
 .../ui/scene-navigation/scene-navigation.less | 55 ++++++++++---------
 .../ui/sceneNavigation/scene-navigation.hbs   | 30 +++++-----
 2 files changed, 46 insertions(+), 39 deletions(-)

diff --git a/styles/less/ui/scene-navigation/scene-navigation.less b/styles/less/ui/scene-navigation/scene-navigation.less
index 6b97ddec..38768658 100644
--- a/styles/less/ui/scene-navigation/scene-navigation.less
+++ b/styles/less/ui/scene-navigation/scene-navigation.less
@@ -1,36 +1,39 @@
 #ui-left #ui-left-column-2 {
     flex: 0 0 230px;
 
-    .scene-navigation {
-        .scene-wrapper {
-            display: flex;
-            gap: 2px;
-            height: var(--control-size);
-            width: 100%;
+    .scene-wrapper {
+        display: flex;
+        gap: 2px;
+        height: var(--control-size);
+        width: 100%;
 
-            .scene-environment {
-                padding: 0;
+        > ul {
+            margin: 0;
+            padding: 0;
+        }
 
-                img {
-                    border-radius: 4px;
-                }
+        .scene-environment {
+            padding: 0;
+
+            img {
+                border-radius: 4px;
             }
         }
+    }
 
-        .scene {
-            justify-content: center;
-            align-content: center;
-            background: var(--control-bg-color);
-            border: 1px solid var(--control-border-color);
-            border-radius: 4px;
-            color: var(--control-icon-color);
-            pointer-events: all;
-            transition:
-                border 0.25s,
-                color 0.25s;
-            text-shadow: none;
-            width: 200px;
-            max-width: 200px;
-        }
+    .scene {
+        justify-content: center;
+        align-content: center;
+        background: var(--control-bg-color);
+        border: 1px solid var(--control-border-color);
+        border-radius: 4px;
+        color: var(--control-icon-color);
+        pointer-events: all;
+        transition:
+            border 0.25s,
+            color 0.25s;
+        text-shadow: none;
+        width: 200px;
+        max-width: 200px;
     }
 }
diff --git a/templates/ui/sceneNavigation/scene-navigation.hbs b/templates/ui/sceneNavigation/scene-navigation.hbs
index 41e9e3e8..0bd59465 100644
--- a/templates/ui/sceneNavigation/scene-navigation.hbs
+++ b/templates/ui/sceneNavigation/scene-navigation.hbs
@@ -7,17 +7,19 @@
     <menu id="scene-navigation-active" class="scene-navigation-menu flexcol">
         {{#each scenes.active as |scene|}}
             <li class="scene-wrapper">
-                <div class="ui-control scene {{scene.cssClass}}" data-scene-id="{{scene.id}}" data-action="viewScene" {{#if scene.tooltip}}data-tooltip-text="{{scene.tooltip}}"{{/if}}>
-                    <span class="scene-name ellipsis">{{scene.name}}</span>
-                    {{#if scene.users}}
-                    <ul class="scene-players">
-                        {{#each scene.users as |user|}}
-                        <li class="scene-player" style="--color-bg:{{user.color}}; --color-border:{{user.border}}"
-                            data-tooltip aria-label="{{user.name}}">{{user.letter}}</li>
-                        {{/each}}
-                    </ul>
-                    {{/if}}
-                </div>
+                <ul>
+                    <li class="ui-control scene {{scene.cssClass}}" data-scene-id="{{scene.id}}" data-action="viewScene" {{#if scene.tooltip}}data-tooltip-text="{{scene.tooltip}}"{{/if}}>
+                        <span class="scene-name ellipsis">{{scene.name}}</span>
+                        {{#if scene.users}}
+                        <ul class="scene-players">
+                            {{#each scene.users as |user|}}
+                            <li class="scene-player" style="--color-bg:{{user.color}}; --color-border:{{user.border}}"
+                                data-tooltip aria-label="{{user.name}}">{{user.letter}}</li>
+                            {{/each}}
+                        </ul>
+                        {{/if}}
+                    </li>
+                </ul>
                 {{#if scene.hasEnvironments}}
                     <button class="ui-control scene-environment {{#if (gt scene.environments.length 1)}}many-environments{{/if}}" data-action="openSceneEnvironment" data-scene-id="{{scene.id}}"><img src="{{scene.environmentImage}}" /> </button>
                 {{/if}}
@@ -27,9 +29,11 @@
     <menu id="scene-navigation-inactive" class="scene-navigation-menu flexcol">
         {{#each scenes.inactive as |scene|}}
             <li class="scene-wrapper">
-                <div class="ui-control scene {{scene.cssClass}}" data-scene-id="{{scene.id}}" data-action="viewScene" {{#if scene.tooltip}}data-tooltip-text="{{scene.tooltip}}"{{/if}}>
+                <ul>
+                <li class="ui-control scene {{scene.cssClass}}" data-scene-id="{{scene.id}}" data-action="viewScene" {{#if scene.tooltip}}data-tooltip-text="{{scene.tooltip}}"{{/if}}>
                     <span class="scene-name ellipsis">{{scene.name}}</span>
-                </div>
+                </li>
+                </ul>
             </li>
         {{/each}}
     </menu>