first commit

src/components/Plants.js

@@ -0,0 +1,17 @@
+import { Link } from "preact-router/match"
+import {getPicture} from "../utilities/pictures";
+
+export const PlantThumb = ({ plant, children }) => {
+
+    return <Link href={`/plant/${plant.id}`} class="block h-48">
+            <div className="bg-green-400 relative rounded shadow-lg flex flex-col">
+                <img src={getPicture(plant.id)} alt="" className="object-cover h-48 w-full rounded" />
+                <div className="bg-green-700 text-white p-2 text-center absolute bottom-0 w-full rounded-bl rounded-br">
+                    {children}
+                </div>
+                <div title="Actions" className="absolute right-2 top-2 rounded-full flex justify-center items-center bg-green-700 w-6 h-6">
+                    {plant.actions.length}
+                </div>
+            </div>
+    </Link>
+}