imi-bas/pronature-platform
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

styling of locked games

Browse Source
This commit is contained in:
goynov
2026-04-15 21:34:57 +03:00
parent bb2af28b48
commit 2f0d33d431
2 changed files with 27 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/AssetsManagement/AssetPreview.vue
+19 -17
View File
@@ -1,23 +1,25 @@
<template> <template>
<div v-show="forRendering"> <div class="asset-preview">
<div class="position-relative"> <div v-show="forRendering">
<div ref="target"></div> <div class="position-relative">
<div class="renderer-gizmo"></div> <div ref="target"></div>
<div class="renderer-gizmo"></div>
</div>
<v-slide-group show-arrows>
<v-slide-group-item v-for="(a, i) in animations" :key="i" v-slot="{ isSelected }">
<v-btn :color="isSelected ? 'primary' : undefined" class="ma-2"
:prepend-icon="'mdi-' + (a.playing ? 'stop' : 'play')" rounded @click="toggleAnimation(a)">
{{ a.name }}
</v-btn>
</v-slide-group-item>
</v-slide-group>
</div> </div>
<v-slide-group show-arrows> <img v-if="obj && !forRendering && obj.type == 'object2d'" :src="`/asset/default/${obj.asset?.name}`" />
<v-slide-group-item v-for="(a, i) in animations" :key="i" v-slot="{ isSelected }"> <video v-if="obj && !forRendering && obj.type == 'video'" controls :autoplay="autoplay ? 'autoplay' : ''"
<v-btn :color="isSelected ? 'primary' : undefined" class="ma-2" :src="`/asset/default/${obj.asset?.name}`"></video>
:prepend-icon="'mdi-' + (a.playing ? 'stop' : 'play')" rounded @click="toggleAnimation(a)"> <audio v-if="obj && !forRendering && obj.type == 'audio'" controls :autoplay="autoplay ? 'autoplay' : ''"
{{ a.name }} :src="`/asset/default/${obj.asset?.name}`" class="d-block w-100"></audio>
</v-btn>
</v-slide-group-item>
</v-slide-group>
</div> </div>
<img v-if="obj && !forRendering && obj.type == 'object2d'" :src="`/asset/default/${obj.asset?.name}`" />
<video v-if="obj && !forRendering && obj.type == 'video'" controls :autoplay="autoplay ? 'autoplay' : ''"
:src="`/asset/default/${obj.asset?.name}`"></video>
<audio v-if="obj && !forRendering && obj.type == 'audio'" controls :autoplay="autoplay ? 'autoplay' : ''"
:src="`/asset/default/${obj.asset?.name}`" class="d-block w-100"></audio>
</template> </template>
<script> <script>
src/styles/style.scss
+8 -2
View File
@@ -84,16 +84,22 @@ video{
} }
} }
.asset-preview {
img {
max-width: 100%;
}
}
.locked { .locked {
pointer-events: none; pointer-events: none;
opacity: 0.5;
position: relative; position: relative;
&::after{ &::after{
background-color: rgba(0,0,0,0.22);
content:"\F033E"; content:"\F033E";
text-align: center; text-align: center;
font-family: "Material Design Icons"; font-family: "Material Design Icons";
font-size: 111px; font-size: 111px;
opacity: 0.5; color: rgba(255, 255, 255, 0.33);
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;