Replace generic slate/indigo dark theme with a custom editorial direction: warm paper neutrals, oxblood signal, Fraunces serif display, Inter body, JetBrains Mono for codes. SVG paper-texture noise overlay and thin rules across the app. Refactored: Home, Settings, JoinRoom, Pair, Share, plus every modal and panel (DropZone, DevicePairingPanel, PublicRoomPanel, ProfileSetup, TextShareModal, ReceiveDialog, TransferProgress, PeerList, PeerAvatar). Also drops three pre-existing Uint8Array/BlobPart strictness errors so the production build is green again. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
66 lines
2.1 KiB
TypeScript
66 lines
2.1 KiB
TypeScript
import { useState } from "react";
|
|
|
|
interface TextShareModalProps {
|
|
onSend: (text: string) => void;
|
|
onClose: () => void;
|
|
}
|
|
|
|
export default function TextShareModal({ onSend, onClose }: TextShareModalProps) {
|
|
const [text, setText] = useState("");
|
|
|
|
const handleSubmit = (e: React.FormEvent) => {
|
|
e.preventDefault();
|
|
if (text.trim()) {
|
|
onSend(text.trim());
|
|
onClose();
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div
|
|
className="fixed inset-0 z-50 flex items-center justify-center bg-ink/40 p-4"
|
|
onClick={onClose}
|
|
>
|
|
<div
|
|
className="paper-panel shadow-lift rounded-sm p-6 w-full max-w-md"
|
|
onClick={(e) => e.stopPropagation()}
|
|
>
|
|
<div className="text-xs uppercase tracking-[0.2em] text-ink-muted">
|
|
Compose
|
|
</div>
|
|
<h2 className="font-display text-2xl text-ink mt-1 mb-5">Send text</h2>
|
|
<form onSubmit={handleSubmit}>
|
|
<textarea
|
|
autoFocus
|
|
value={text}
|
|
onChange={(e) => setText(e.target.value)}
|
|
placeholder="Message, link, snippet…"
|
|
className="w-full h-32 bg-paper border border-paper-edge rounded-sm p-3
|
|
text-sm text-ink placeholder:text-ink-faint resize-none
|
|
focus:outline-none focus:border-ink transition-colors
|
|
duration-fast ease-crisp"
|
|
/>
|
|
<div className="flex justify-end gap-3 mt-5">
|
|
<button
|
|
type="button"
|
|
onClick={onClose}
|
|
className="px-3 py-2 text-sm text-ink-muted hover:text-ink transition-colors"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button
|
|
type="submit"
|
|
disabled={!text.trim()}
|
|
className="px-5 py-2 bg-ink text-paper text-sm font-medium rounded-sm
|
|
hover:bg-signal transition-colors duration-fast ease-crisp
|
|
disabled:opacity-30 disabled:cursor-not-allowed"
|
|
>
|
|
Send →
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|