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

UPD: Device button elements

Browse Source
This commit is contained in:
Robert Kossessa
2024-02-03 23:17:14 +01:00
parent 4398cd2492
commit b16d9729dc
2 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,17 +1,17 @@
<template> <template>
<div class="flex"> <div class="flex">
<div <button
v-for="(color, key) in keys" v-for="(color, key) in keys"
:key="key" :class="{'outline outline-white ' : key === selected, :key="key" :class="{'outline outline-white ' : key === selected,
'hover:outline outline-zinc-400' : 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"
:style="`box-shadow: 0 0 20px 0 ${color.hex()}`" :style="`box-shadow: 0 0 20px 0 ${color.hex()}`"
@click="$emit('select', key)"> @click="$emit('select', key)">
<div <span
class="font-heading text-2xl" class="font-heading text-2xl"
:class="{'opacity-30 text-black': key!==selected}">{{ key }} :class="{'opacity-30 text-black': key!==selected}">{{ key }}
</div> </span>
</div> </button>
</div> </div>
</template> </template>

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

@@ -24,7 +24,7 @@
</span> </span>
</div> </div>
</div> </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"
:class="{'outline outline-white': selected==='ring', :class="{'outline outline-white': selected==='ring',
'hover:outline outline-zinc-400': selected!=='ring'}" 'hover:outline outline-zinc-400': selected!=='ring'}"