Update widgets

2022-09-22 23:06:49 +10:00
parent dcfd738c75
commit 781d782a70
11 changed files with 243 additions and 77 deletions
@@ -1,11 +1,25 @@
 import type React from "react";

-export interface PositionWidgetProps {}
+import { MapPinIcon } from "@heroicons/react/24/outline";

-export const PositionWidget = ({}: PositionWidgetProps): JSX.Element => {
+import { Card } from "../Card.js";
+
+export interface PositionWidgetProps {
+  grid: string;
+}
+
+export const PositionWidget = ({ grid }: PositionWidgetProps): JSX.Element => {
  return (
-    <div className="mb-4 flex flex-col space-y-3 rounded-2xl bg-[#f9e3aa] p-6 text-sm text-black">
-      position
-    </div>
+    <Card>
+      <div className="flex w-20 bg-teal-600 p-3">
+        <MapPinIcon className="m-auto h-12 text-white" />
+      </div>
+      <div className="flex w-full flex-col">
+        <div className="flex h-8 bg-slate-100">
+          <span className="m-auto text-lg font-medium">Position</span>
+        </div>
+        <span className="m-auto text-lg">{grid}</span>
+      </div>
+    </Card>
  );
 };