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

removed sidebar bits

Browse Source
This commit is contained in:
Emily Neighbour 2025-05-28 22:37:28 +01:00
parent 803253b96e
commit d6f7d73622
2 changed files with 0 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
src/components/sidebar_e.tsx
View File

@ -1,73 +0,0 @@
import Link from "next/link";
import React from "react";
type SidebarProps = {
logTitle: string;
logSubtitle: string;
recentsTitle: string;
events: any[]; // Or type this better if desired
button1Name: string;
button2Name: string;
onButton1Click?: () => void;
onButton2Click?: () => void;
}
const Sidebar: React.FC<SidebarProps> = ({
logTitle,
logSubtitle,
recentsTitle,
events,
button1Name,
button2Name,
onButton1Click,
onButton2Click,
}) => {
return (
<div className="flex flex-col h-full w-80 bg-white border-l border-neutral-200 shadow-md">
<div className="flex flex-col p-4 border-b border-neutral-200">
<h2 className="text-xl font-semibold mb-2">{logTitle}</h2>
<p className="text-sm text-neutral-600">{logSubtitle}</p>
<button
className="mt-4 bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded"
onClick={onButton1Click}
>
{button1Name}
</button>
<button
className="mt-2 bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded"
onClick={onButton2Click}
>
{button2Name}
</button>
</div>
<div className="flex-1 p-4 overflow-y-auto">
<h2 className="text-xl font-semibold mb-2">{recentsTitle}</h2>
<ul className="space-y-2">
{events.map((item, idx) => (
<li
className="bg-neutral-100 p-3 rounded hover:bg-neutral-200 flex items-center justify-between"
key={item.id || idx}
>
<div>
<p className="font-medium">{item.title}</p>
<p className="text-xs text-neutral-600">
{item.text2}
</p>
</div>
<div className={`ml-3 rounded-full font-semibold px-2 py-1 ${item.magnitude >= 7
? "bg-red-500 text-white"
: item.magnitude >= 6
? "bg-orange-400 text-white"
: "bg-yellow-400 text-black"
}`}>
{item.magnitude}
</div>
</li>
))}
</ul>
</div>
</div>
);
};
export default Sidebar;

40
src/components/sidebar_o.tsx
View File

@ -1,40 +0,0 @@
import Link from "next/link";
import React from "react";
const Sidebar = () => {
return (
<div className="flex flex-col h-screen w-64 bg-neutral-400 text-white border-l border-neutral-700">
<div className="flex flex-col p-4 border-b border-neutral-700">
<h2 className="text-xl font-semibold mb-2">Observatories</h2>
<p className="text-sm text-neutral-700">Observatory events - location, scientists, recent earthquakes</p>
<button className="mt-4 bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded">
<Link href="/">Observatory News</Link>
</button>
</div>
{/* Section: Recent Events - Will need to be replaced with a link to the database*/}
<div className="flex-1 p-4">
<h2 className="text-xl font-semibold mb-2">Recent Observatory Events</h2>
<ul className="space-y-2">
<li className="bg-neutral-700 p-3 rounded hover:bg-neutral-600">
<p className="text-sm">Earthquake in California</p>
<p className="text-xs text-neutral-300">Magnitude 5.3</p>
<p className="text-xs text-neutral-400">Cali Observatory</p>
</li>
<li className="bg-neutral-700 p-3 rounded hover:bg-neutral-600">
<p className="text-sm">Tremor in Japan</p>
<p className="text-xs text-neutral-300">Magnitude 4.7</p>
<p className="text-xs text-neutral-400">Kyoto Observatory</p>
</li>
<li className="bg-neutral-700 p-3 rounded hover:bg-neutral-600">
<p className="text-sm">Tremor in Spain</p>
<p className="text-xs text-neutral-300">Magnitude 2.1</p>
<p className="text-xs text-neutral-400">Madrid Observatory</p>
</li>
</ul>
</div>
</div>
);
};
export default Sidebar;