thowitz-work/tremor-tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

new the team image

Browse Source
This commit is contained in:
Emily Neighbour 2025-05-28 08:52:30 +01:00
parent d5da39d812
commit c3ecca40f2
3 changed files with 88 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/tectonicPlates.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 85 KiB

2
src/app/the-team/page.tsx
View File

@ -33,7 +33,7 @@ export default function Page() {
return (
<div
className="min-h-screen relative flex flex-col items-center justify-center px-4 py-30"
style={{ backgroundImage: "url('tectonicPlate.jpg')", backgroundSize: "cover", backgroundPosition: "center" }}
style={{ backgroundImage: "url('tectonicPlates.png')", backgroundSize: "cover", backgroundPosition: "center" }}
>
{/* Overlay */}
<div className="absolute inset-0 bg-black bg-opacity-50 pointer-events-none"></div>

87
src/components/LoggingModal.tsx Normal file
View File

@ -0,0 +1,87 @@
import Link from "next/link";
import React, { Dispatch, SetStateAction, useState } from "react";
import { TbHexagon } from "react-icons/tb";
import Event from "@appTypes/Event";
import getMagnitudeColor from "@utils/getMagnitudeColour";
function setButton1(button1Name) {
const [modalOpen, setModalOpen] = useState(false);
return (
modalOpen && (
<div className="fixed z-50 inset-0 bg-black bg-opacity-50 flex items-center justify-center">
<div className="bg-white rounded-lg shadow-lg max-w-6xl w-full p-10">
<div className="flex items-center justify-between mb-3">
<h2 className="text-2xl font-extrabold">Log New Earthquake</h2>
<button
onClick={() => setModalOpen(false)}
className="text-2xl font-bold text-gray-500 hover:text-gray-900"
aria-label="Close modal"
>
&times;
</button>
</div>
{/* Blank Table */}
<table className="w-full border mb-4">
<thead>
<tr>
<th className="border px-2 py-1">Date</th>
<th className="border px-2 py-1">Code</th>
<th className="border px-2 py-1">Magnitude</th>
<th className="border px-2 py-1">Observatory</th>
<th className="border px-2 py-1">Type</th>
<th className="border px-2 py-1">Latitude</th>
<th className="border px-2 py-1">Longitude</th>
<th className="border px-2 py-1">Location</th>
<th className="border px-2 py-1">Observatory</th>
<th className="border px-2 py-1">Depth</th>
</tr>
</thead>
<tbody>
<tr>
<td className="border px-2 py-1">
<input type="date" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="number" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="text" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="text" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="text" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="date" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="number" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="text" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="text" className="border p-1 w-full" disabled />
</td>
<td className="border px-2 py-1">
<input type="text" className="border p-1 w-full" disabled />
</td>
</tr>
</tbody>
</table>
<div className="flex justify-end gap-4">
<button onClick={() => setModalOpen(true)} className="bg-blue-600 text-white px-10 py-2 rounded">
Add
</button>
<button onClick={() => setModalOpen(false)} className="bg-blue-600 text-white px-4 py-2 rounded">
Close
</button>
</div>
</div>
</div>
)
);
}