mirror of
https://github.com/web3privacy/explorer-app.git
synced 2024-10-15 16:46:26 +02:00
Merge pull request #26 from web3privacy/dk/rating-mobile-hover
Dk/rating mobile hover
This commit is contained in:
commit
896154d1f9
3 changed files with 3134 additions and 1707 deletions
|
@ -31,24 +31,11 @@ const backgroundColorByScore = computed(() => {
|
||||||
const colorIndex = Math.floor(normalizedPercentage / 10)
|
const colorIndex = Math.floor(normalizedPercentage / 10)
|
||||||
return colors[colorIndex]
|
return colors[colorIndex]
|
||||||
})
|
})
|
||||||
const isLargeScreen = useMediaQuery('(min-width: 1024px)')
|
|
||||||
|
|
||||||
function onClick() {
|
|
||||||
if (isLargeScreen.value)
|
|
||||||
return
|
|
||||||
if (props.disablePopover)
|
|
||||||
emits('selected')
|
|
||||||
else
|
|
||||||
isPopoverVisible.value = !isPopoverVisible.value
|
|
||||||
}
|
|
||||||
|
|
||||||
const isPopoverVisible = ref(false)
|
const isPopoverVisible = ref(false)
|
||||||
|
|
||||||
let hideTimeout: ReturnType<typeof setTimeout> | null = null
|
let hideTimeout: ReturnType<typeof setTimeout> | null = null
|
||||||
const showPopover = () => {
|
const showPopover = () => {
|
||||||
if (!isLargeScreen.value)
|
|
||||||
return
|
|
||||||
console.log('show')
|
|
||||||
if (hideTimeout) {
|
if (hideTimeout) {
|
||||||
clearTimeout(hideTimeout)
|
clearTimeout(hideTimeout)
|
||||||
hideTimeout = null
|
hideTimeout = null
|
||||||
|
@ -57,8 +44,6 @@ const showPopover = () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const hidePopover = () => {
|
const hidePopover = () => {
|
||||||
if (!isLargeScreen.value)
|
|
||||||
return
|
|
||||||
hideTimeout = setTimeout(() => {
|
hideTimeout = setTimeout(() => {
|
||||||
isPopoverVisible.value = false
|
isPopoverVisible.value = false
|
||||||
}, 100) // Delay of 200ms before hiding
|
}, 100) // Delay of 200ms before hiding
|
||||||
|
@ -83,7 +68,7 @@ const hidePopover = () => {
|
||||||
cursor-pointer
|
cursor-pointer
|
||||||
@mouseenter="showPopover"
|
@mouseenter="showPopover"
|
||||||
@mouseleave="hidePopover"
|
@mouseleave="hidePopover"
|
||||||
@click.prevent="onClick()"
|
@click.prevent=" emits('selected')"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
v-for="point of [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]"
|
v-for="point of [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]"
|
||||||
|
|
|
@ -73,7 +73,7 @@ export const useData = defineStore('data', () => {
|
||||||
features.value = data.features
|
features.value = data.features
|
||||||
ranks.value = data.ranks
|
ranks.value = data.ranks
|
||||||
|
|
||||||
projectPhase.value = data.project_phase.map(p => ({ id: p.id.toLowerCase(), name: p.name }))
|
projectPhase.value = data.project_phase?.map(p => ({ id: p.id.toLowerCase(), name: p.name }))
|
||||||
assetCustody.value = data.asset_custody_type.map(a => ({ id: a.id.toLowerCase(), name: a.name }))
|
assetCustody.value = data.asset_custody_type.map(a => ({ id: a.id.toLowerCase(), name: a.name }))
|
||||||
signInRequirments.value = data.sign_in_type_requirments.map(s => ({ id: s.id.toLowerCase(), name: s.name }))
|
signInRequirments.value = data.sign_in_type_requirments.map(s => ({ id: s.id.toLowerCase(), name: s.name }))
|
||||||
}
|
}
|
||||||
|
|
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue