34 lines
1.2 KiB
TypeScript
34 lines
1.2 KiB
TypeScript
import { Link } from "react-router";
|
|
|
|
export function Header() {
|
|
return (
|
|
<header className="bg-white border-b border-slate-200 sticky top-0 z-10">
|
|
<div className="max-w-6xl mx-auto px-4 py-3 h-auto min-h-16 flex items-center justify-between">
|
|
<div className="flex items-center space-x-3">
|
|
<div className="bg-blue-600 p-2 rounded-lg shrink-0">
|
|
<img
|
|
src="https://img.icons8.com/ios-filled/50/ffffff/flash-on.png"
|
|
className="w-5 h-5 object-contain"
|
|
alt="logo"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<h1 className="font-bold text-lg leading-tight">
|
|
Distributed Systems and Blockchain
|
|
</h1>
|
|
<p className="text-xs text-slate-500">Brainster Next College</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex items-center space-x-4">
|
|
<p className="text-sm text-slate-500 hidden md:block">Chain: Next Testnet</p>
|
|
|
|
<Link to="/status" className="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-xl text-sm font-semibold transition-all shadow-sm">
|
|
Connect Wallet
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|