forked from
npmx.dev/npmx.dev
[READ-ONLY]
a fast, modern browser for the npm registry
fix: set glassomorphism directly on the chart's tooltip customFormat (#179)
authored by
Alec Lloyd Probert
and committed by
GitHub
8b8eff40
2e5345c2
+3
-1
+3
-1
app/components/PackageDownloadAnalytics.vue
+3
-1
app/components/PackageDownloadAnalytics.vue
···
422
422
},
423
423
tooltip: {
424
424
borderColor: '#2A2A2A',
425
+
backdropFilter: false,
426
+
backgroundColor: 'transparent',
425
427
customFormat: ({
426
428
absoluteIndex,
427
429
datapoint,
···
431
433
}) => {
432
434
if (!datapoint) return ''
433
435
const displayValue = formatter({ value: datapoint[0]?.value ?? 0 })
434
-
return `<div class="flex flex-col font-mono text-xs p-3">
436
+
return `<div class="flex flex-col font-mono text-xs p-3 bg-[#0A0A0A]/10 backdrop-blur-md">
435
437
<span class="text-fg-subtle">${chartData.value?.dates[absoluteIndex]}</span>
436
438
<span class="text-xl">${displayValue}</span>
437
439
</div>