matei/zeroone
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UPD: DevicePreview transitions

Browse Source
This commit is contained in:
Robert Kossessa
2024-02-04 00:30:13 +01:00
parent abfab1589e
commit 5f3c31a315
4 changed files with 7 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/device/DeviceKeys.vue
View File

@@ -4,11 +4,11 @@
v-for="(color, key) in keys"
:key="key" :class="{'outline outline-white ' : key === selected,
'hover:outline outline-zinc-400' : key !== selected}"
class="aspect-square flex-1 rounded-[2px] flex items-center justify-center"
class="aspect-square flex-1 rounded-[2px] flex items-center justify-center transition-all"
:style="`box-shadow: 0 0 20px 0 ${color.hex()}`"
@click="$emit('select', key)">
<span
class="font-heading text-2xl"
class="font-heading text-2xl transition-colors"
:class="{'opacity-30 text-black': key!==selected}">{{ key }}
</span>
</button>

2
src/components/device/DevicePreview.vue
View File

@@ -25,7 +25,7 @@
</div>
</div>
<button
class="rounded-full outline-2 absolute h-[41.5%] top-[24.5%] aspect-square left-0 right-0 mx-auto"
class="rounded-full outline-2 absolute h-[41.5%] top-[24.5%] aspect-square left-0 right-0 mx-auto transition-all"
:class="{'outline outline-white': selected==='ring',
'hover:outline outline-zinc-400': selected!=='ring'}"
@click="selected='ring'" />