dev

src/components/AssetsManagement/AssetBrowser.vue

@@ -2,17 +2,18 @@
     <v-chip-group variant="flat" v-if="!hideFilter" class="pa-4" multiple column v-model="selectedTypes">
         <v-chip v-for="(f,i) in $p.objectTypes" :key="i" :text="l[f.value]" :value="f.value" :color="f.color" filter></v-chip>
     </v-chip-group>
-    <v-container>
+    <v-container class="asset-browser">
         <v-row>
-            <v-col v-for="(v, i) in items" :key="i" cols="12" xs="6" sm="4" md="3" xl="2" class="position-relative">
-                <!-- <router-link :to="`/game-objects/${v.id}`"> -->
-                <v-img :src="`/asset/thumb/${v.asset?.thumb}`" class="cursor-pointer" @click="$emit('select', v)"></v-img>
-                <!-- </router-link> -->
+            <v-col v-for="(v, i) in items" :key="i" cols="12" xs="6" sm="4" md="3" xl="2" class="position-relative img-preview">
+                <div class="img-wrapper">
+                    <img :src="`/asset/thumb/${v.asset?.thumb}`" class="cursor-pointer" @click="$emit('select', v)"></img>
+                </div>
                 <div class="d-flex">
                     <span class="flex-grow-1">{{ v.name }}</span>
-                    <v-btn density="comfortable" size="small" :icon="`mdi-${ $p.objectTypes.find(t=>t.value == v.type).icon }`" 
-                        :color="$p.objectTypes.find(t=>t.value == v.type).color" class="position-absolute top-0 left-0 ma-6"></v-btn>
-                    <v-btn density="comfortable" size="small" icon="mdi-play-circle" @click="preview(v)" 
+                    <v-icon variant="tonal" density="comfortable" :icon="`mdi-${ $p.objectTypes.find(t=>t.value == v.type).icon }`" 
+                        :color="$p.objectTypes.find(t=>t.value == v.type).color" class="position-absolute top-0 left-0 ma-5">
+                    </v-icon>
+                    <v-btn variant="tonal" density="comfortable" size="small" icon="mdi-play" @click="preview(v)" 
                         color="light-blue-darken-4" class="position-absolute top-0 right-0 ma-6"></v-btn>
                     <slot name="action-buttons" v-bind:object="v"></slot>
                 </div>

src/components/SceneDesigner/SceneDesigner.vue

@@ -7,13 +7,12 @@
             <v-btn size="small" class="text-none" value="move" prepend-icon="mdi-cursor-move">Move</v-btn>
             <v-btn size="small" class="text-none" value="pan" prepend-icon="mdi-hand-back-right-outline">Pan</v-btn>
 
-            <v-btn size="small" class="text-none" value="Scene" prepend-icon="mdi-panorama-outline">Add scene</v-btn>
+            <v-btn size="small" class="text-none" value="Scene" prepend-icon="mdi-panorama-outline">{{ l.addScene }}</v-btn>
             <v-btn size="small" class="text-none" value="GameObject"
-                v-if="selectedItem.length == 1 && selectedItem[0].__type == 'Scene'" prepend-icon="mdi-bird">Add game
-                object</v-btn>
+                v-if="selectedItem.length == 1 && selectedItem[0].__type == 'Scene'" prepend-icon="mdi-bird">{{ l.createGameObject }}</v-btn>
             <v-btn size="small" class="text-none" value="Task"
                 v-if="selectedItem.length == 1 && selectedItem[0].__type == 'GameObject'"
-                prepend-icon="mdi-checkbox-marked-circle-plus-outline">Add task</v-btn>
+                prepend-icon="mdi-checkbox-marked-circle-plus-outline">{{ l.addTask }}</v-btn>
         </v-btn-toggle>
         <div @wheel="onWheel" @mousedown="onMouseDown" @mouseup="onMouseUp" @mousemove="onDrag"
             :class="`svg-container ${mode}`" ref="svgContainer">