mirror of
https://github.com/kccleoc/seedpgp-web.git
synced 2026-03-07 09:57:50 +08:00
Fix TypeScript errors, remove non-functional Empty button, right-align Network Block toggle
- Fix CameraEntropy and DiceEntropy import errors - Fix unused variable warnings in App.tsx and Header.tsx - Remove non-functional Empty storage button from Header - Right-align Network Block toggle button with flex-1 spacer - Add NetworkBlockBadge component file
This commit is contained in:
28
src/components/badges/NetworkBlockBadge.tsx
Normal file
28
src/components/badges/NetworkBlockBadge.tsx
Normal file
@@ -0,0 +1,28 @@
|
||||
import React from 'react';
|
||||
import { Wifi, WifiOff } from 'lucide-react';
|
||||
|
||||
interface NetworkBlockBadgeProps {
|
||||
isBlocked: boolean;
|
||||
onToggle: () => void;
|
||||
}
|
||||
|
||||
const NetworkBlockBadge: React.FC<NetworkBlockBadgeProps> = ({ isBlocked, onToggle }) => {
|
||||
return (
|
||||
<button
|
||||
onClick={onToggle}
|
||||
className={`flex items-center gap-1.5 px-2 py-1 rounded-lg text-xs font-medium transition-all ${
|
||||
isBlocked
|
||||
? 'bg-[#ff006e20] border border-[#ff006e] text-[#ff006e] hover:bg-[#ff006e30]'
|
||||
: 'bg-[#39ff1420] border border-[#39ff14] text-[#39ff14] hover:bg-[#39ff1430]'
|
||||
}`}
|
||||
title={isBlocked ? 'Network is BLOCKED' : 'Network is ACTIVE'}
|
||||
>
|
||||
{isBlocked ? <WifiOff size={12} /> : <Wifi size={12} />}
|
||||
<span className="hidden sm:inline">
|
||||
{isBlocked ? 'Blocked' : 'Active'}
|
||||
</span>
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
export default NetworkBlockBadge;
|
||||
Reference in New Issue
Block a user