create layout for the tiles where the boats are shown

client/src/components/RentedBoatTile.tsx

+import React from "react";
+// import { Image } from "react-bootstrap";
+// import { Link } from "react-router-dom";
+
+function RentedBoatTile(props: any) {
+    return(
+        <div className="rented-boat-tile mb-1 col-sm rounded-2" style={{height: "5rem", minWidth: "17rem", maxWidth: "100%)", margin: "10px"}}>
+            <div className="tile-body position-relative w-100 h-100">
+                <h3 className="tile-label-boatName position-absolute top-0 start-0 text-white fw-bold">{props.boatName}</h3>
+                <h4 className="tile-label-time position-absolute top-0 end-0 text-white">{props.time}</h4>
+                <h4 className="tile-label-persons position-absolute bottom-0 start-0 text-white">{props.persons}</h4>
+                <h3 className="tile-label-overdue position-absolute bottom-0 end-0 text-white fw-bold">{props.overdue}</h3>
+            </div>
+        </div>
+    );
+}
+
+export default RentedBoatTile;
\ No newline at end of file