separate scene and panorama

src/components/SceneDesigner/Scene.vue

@@ -9,9 +9,15 @@
         </g>
     </teleport>
     <v-card :title="modelValue.title" v-if="selected" class="mx-2" variant="text">
-        <asset-selector @select="assignEnvironment" :type="['Scene']">
+        <asset-selector @select="assignEnvironment" :type="['Panorama']">
             <template v-slot:activator="props">
-                <v-btn v-bind="props" prepend-icon="mdi-panorama-outline" block color="success" class="py-4">Choose environment</v-btn>
+                <v-btn v-bind="props" prepend-icon="mdi-panorama-sphere-outline" block color="light-blue-darken-4">Choose environment</v-btn>
+            </template>
+        </asset-selector>
+
+        <asset-selector @select="assignScene" :type="['Scene']">
+            <template v-slot:activator="props">
+                <v-btn v-bind="props" prepend-icon="mdi-panorama-outline" block color="orange-darken-3" class="my-4">Choose scene</v-btn>
             </template>
         </asset-selector>
 
@@ -63,10 +69,13 @@ export default {
         },
         assignEnvironment(e){
             this.modelValue.environment = e.id;
+        }, 
+        assignScene(e){
+            this.modelValue.scene = e.id;
             if (this.modelValue.id == this.modelValue.title){
                 this.modelValue.title = e.name
             }
-        }
+        }, 
     }
 }
 </script>