59 lines
1.6 KiB
Plaintext
59 lines
1.6 KiB
Plaintext
---
|
|
import { v4 as uuidv4 } from "uuid";
|
|
|
|
const popoverUUID = uuidv4();
|
|
|
|
const keys: { [key: string]: string } = {
|
|
ADCP: "Acoustic doppler current profiler",
|
|
COTS: "Consumer off-the-shelf",
|
|
CTD: "Conductivity, temperature, and depth sensor",
|
|
DUTs: "Devices under test",
|
|
GUI: "Graphical user interface",
|
|
NUC: "A small and low-power computer made by Intel",
|
|
PCBs: "Printed circuit boards",
|
|
SCARA: "Selective Compliance Assembly Robot Arm",
|
|
TDD: "Test driven development",
|
|
UPS: "Uninterruptible power supply",
|
|
VISA: "Virtual instrument software architecture",
|
|
VPS: "Virtual private server",
|
|
};
|
|
|
|
const key: string | undefined = Astro.props.key;
|
|
let word: string | undefined = Astro.props.word;
|
|
let definition: string | undefined = Astro.props.definition;
|
|
|
|
if (key && keys.hasOwnProperty(key)) {
|
|
word = key;
|
|
definition = keys[key];
|
|
}
|
|
|
|
if (!word || !definition) {
|
|
throw new Error(
|
|
`Popover definition is missing! Inputs were\nkey: ${key}\nword: ${word}\ndefinition: ${definition}`,
|
|
);
|
|
}
|
|
---
|
|
|
|
<>
|
|
<a
|
|
href="#"
|
|
class="text-fg-brand decoration-caperren-green font-medium underline decoration-dashed hover:no-underline"
|
|
data-popover-target={popoverUUID}>{word}</a
|
|
>
|
|
<div
|
|
data-popover
|
|
id={popoverUUID}
|
|
role="tooltip"
|
|
class="text-body border-caperren-green invisible absolute z-90 inline-block w-fit max-w-96 rounded-lg border border-dashed bg-black p-3 text-sm opacity-0 shadow-xs transition-opacity duration-300"
|
|
>
|
|
<div>
|
|
<h3
|
|
class="text-heading border-b-caperren-green-dark mb-1 border-b font-semibold"
|
|
>
|
|
{word}
|
|
</h3>
|
|
<p>{definition}</p>
|
|
</div>
|
|
</div>
|
|
</>
|