openstatus.dev
Openstatus
www.openstatus.dev
1---
2import { getStatus, statusDictionary } from "./utils";
3const { status } = await getStatus("openstatus");
4const { label, color } = statusDictionary[status];
5---
6
7<a
8class="inline-flex max-w-fit items-center gap-2 rounded-md border border-gray-200 px-3 py-1 text-gray-700 text-sm hover:bg-gray-100 hover:text-black dark:border-gray-800 dark:text-gray-300 dark:hover:bg-gray-900 dark:hover:text-white no-underline"
9href="https://status.openstatus.dev"
10target="_blank"
11rel="noreferrer"
12>
13{label}
14<span class="relative flex h-2 w-2">
15 {status === "operational" ? (
16 <span
17 class={`absolute inline-flex h-full w-full animate-ping rounded-full ${color} opacity-75 duration-1000`}
18 />
19 ) : null}
20 <span
21 class={`relative inline-flex h-2 w-2 rounded-full ${color}`}
22 />
23</span>
24</a>