bytelyst/learning_ai_invt_trdg
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(simple): restore form contrast

Browse Source
This commit is contained in:
root 2026-05-06 02:31:34 +00:00
parent 90e733b46c
commit 9021df19ad
1 changed files with 25 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
web/src/views/SimpleView.tsx
View File

@ -473,13 +473,13 @@ export function SimpleView() {
</header> </header>
<div className="grid gap-8 xl:grid-cols-[minmax(0,1.1fr)_minmax(0,0.9fr)]"> <div className="grid gap-8 xl:grid-cols-[minmax(0,1.1fr)_minmax(0,0.9fr)]">
<section className="rounded-[2rem] border border-white/8 bg-[#0b0d10] p-6 shadow-[0_30px_80px_rgba(0,0,0,0.35)]"> <section className="rounded-[2rem] border border-black/10 bg-zinc-50 p-6 shadow-[0_30px_80px_rgba(0,0,0,0.16)]">
<div className="mb-6 flex items-center justify-between gap-4"> <div className="mb-6 flex items-center justify-between gap-4">
<div> <div>
<h2 className="text-lg font-black uppercase tracking-tight text-white"> <h2 className="text-lg font-black uppercase tracking-tight text-zinc-950">
{editingSetupId ? 'Edit setup' : 'New setup'} {editingSetupId ? 'Edit setup' : 'New setup'}
</h2> </h2>
<p className="text-xs uppercase tracking-[0.24em] text-zinc-500"> <p className="text-xs uppercase tracking-[0.24em] text-zinc-600">
Saved trigger workflow, not an immediate broker order Saved trigger workflow, not an immediate broker order
</p> </p>
</div> </div>
@ -494,7 +494,7 @@ export function SimpleView() {
setMessage(null); setMessage(null);
setError(null); setError(null);
}} }}
className="rounded-full border border-white/10 px-4 py-2 text-xs font-bold uppercase tracking-[0.2em] text-zinc-400 hover:border-white/20 hover:text-white" className="rounded-full border border-black/10 bg-white px-4 py-2 text-xs font-bold uppercase tracking-[0.2em] text-zinc-700 hover:border-black/20 hover:text-zinc-950"
> >
Reset Reset
</button> </button>
@ -503,7 +503,7 @@ export function SimpleView() {
<form className="space-y-6" onSubmit={handleSubmit}> <form className="space-y-6" onSubmit={handleSubmit}>
<div className="grid gap-4 md:grid-cols-2"> <div className="grid gap-4 md:grid-cols-2">
<label className="space-y-2"> <label className="space-y-2">
<span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500">Symbol</span> <span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">Symbol</span>
<input <input
value={draft.symbol} value={draft.symbol}
onChange={(e) => setDraft((prev) => ({ onChange={(e) => setDraft((prev) => ({
@ -512,16 +512,16 @@ export function SimpleView() {
currentMarketPrice: '', currentMarketPrice: '',
}))} }))}
placeholder="AAPL" placeholder="AAPL"
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition placeholder:text-zinc-400 focus:border-[#2f9e62]"
/> />
</label> </label>
<label className="space-y-2"> <label className="space-y-2">
<span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500">Setup type</span> <span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">Setup type</span>
<select <select
value={draft.side} value={draft.side}
onChange={(e) => updateDraft('side', e.target.value as SimpleSide)} onChange={(e) => updateDraft('side', e.target.value as SimpleSide)}
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition focus:border-[#2f9e62]"
> >
<option value="buy">Buy the dip + profit exit</option> <option value="buy">Buy the dip + profit exit</option>
<option value="sell">Sell existing Simple holding at profit</option> <option value="sell">Sell existing Simple holding at profit</option>
@ -531,17 +531,17 @@ export function SimpleView() {
<div className="grid gap-4 md:grid-cols-[minmax(0,1fr)_auto]"> <div className="grid gap-4 md:grid-cols-[minmax(0,1fr)_auto]">
<label className="space-y-2"> <label className="space-y-2">
<span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500">Market price (auto-fetched)</span> <span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">Market price (auto-fetched)</span>
<input <input
value={draft.currentMarketPrice} value={draft.currentMarketPrice}
readOnly readOnly
className="w-full rounded-2xl border border-white/10 bg-white/[0.03] px-4 py-3 text-white/90 outline-none" className="w-full rounded-2xl border border-black/10 bg-zinc-100 px-4 py-3 text-zinc-800 outline-none"
/> />
</label> </label>
<button <button
type="button" type="button"
onClick={() => void handleLoadMarketPrice()} onClick={() => void handleLoadMarketPrice()}
className="self-end rounded-2xl border border-white/10 bg-white/[0.03] px-4 py-3 text-xs font-black uppercase tracking-[0.2em] text-zinc-300 hover:border-white/20 hover:text-white disabled:opacity-50" className="self-end rounded-2xl border border-black/10 bg-white px-4 py-3 text-xs font-black uppercase tracking-[0.2em] text-zinc-700 hover:border-black/20 hover:text-zinc-950 disabled:opacity-50"
disabled={loadingPrice || !normalizedSymbol} disabled={loadingPrice || !normalizedSymbol}
> >
<span className="inline-flex items-center gap-2"> <span className="inline-flex items-center gap-2">
@ -560,69 +560,69 @@ export function SimpleView() {
value={draft.side === 'sell' && matchingHolding ? String(matchingHolding.size) : draft.quantity} value={draft.side === 'sell' && matchingHolding ? String(matchingHolding.size) : draft.quantity}
onChange={(e) => updateDraft('quantity', e.target.value)} onChange={(e) => updateDraft('quantity', e.target.value)}
readOnly={draft.side === 'sell' && !!matchingHolding} readOnly={draft.side === 'sell' && !!matchingHolding}
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60 read-only:bg-white/[0.03] read-only:text-zinc-300" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition placeholder:text-zinc-400 focus:border-[#2f9e62] read-only:bg-zinc-100 read-only:text-zinc-700"
placeholder="10" placeholder="10"
/> />
</label> </label>
<label className="space-y-2"> <label className="space-y-2">
<span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500">Notes</span> <span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">Notes</span>
<input <input
value={draft.notes} value={draft.notes}
onChange={(e) => updateDraft('notes', e.target.value)} onChange={(e) => updateDraft('notes', e.target.value)}
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition placeholder:text-zinc-400 focus:border-[#2f9e62]"
placeholder="Optional context" placeholder="Optional context"
/> />
</label> </label>
</div> </div>
{draft.side === 'buy' && ( {draft.side === 'buy' && (
<div className="grid gap-4 rounded-[1.75rem] border border-white/8 bg-white/[0.02] p-5 md:grid-cols-[0.55fr_0.45fr]"> <div className="grid gap-4 rounded-[1.75rem] border border-black/10 bg-white p-5 md:grid-cols-[0.55fr_0.45fr]">
<div className="space-y-3"> <div className="space-y-3">
<p className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500">Drop trigger</p> <p className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">Drop trigger</p>
<select <select
value={draft.dropMode} value={draft.dropMode}
onChange={(e) => updateDraft('dropMode', e.target.value as TriggerMode)} onChange={(e) => updateDraft('dropMode', e.target.value as TriggerMode)}
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition focus:border-[#2f9e62]"
> >
<option value="dollar">Dollar drop from current market</option> <option value="dollar">Dollar drop from current market</option>
<option value="percent">Percent drop from current market</option> <option value="percent">Percent drop from current market</option>
</select> </select>
</div> </div>
<label className="space-y-3"> <label className="space-y-3">
<span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500"> <span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">
{draft.dropMode === 'dollar' ? 'Drop amount ($)' : 'Drop amount (%)'} {draft.dropMode === 'dollar' ? 'Drop amount ($)' : 'Drop amount (%)'}
</span> </span>
<input <input
value={draft.dropValue} value={draft.dropValue}
onChange={(e) => updateDraft('dropValue', e.target.value)} onChange={(e) => updateDraft('dropValue', e.target.value)}
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition placeholder:text-zinc-400 focus:border-[#2f9e62]"
placeholder={draft.dropMode === 'dollar' ? '5.00' : '8'} placeholder={draft.dropMode === 'dollar' ? '5.00' : '8'}
/> />
</label> </label>
</div> </div>
)} )}
<div className="grid gap-4 rounded-[1.75rem] border border-white/8 bg-white/[0.02] p-5 md:grid-cols-[0.55fr_0.45fr]"> <div className="grid gap-4 rounded-[1.75rem] border border-black/10 bg-white p-5 md:grid-cols-[0.55fr_0.45fr]">
<div className="space-y-3"> <div className="space-y-3">
<p className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500">Profit exit</p> <p className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">Profit exit</p>
<select <select
value={draft.profitMode} value={draft.profitMode}
onChange={(e) => updateDraft('profitMode', e.target.value as TriggerMode)} onChange={(e) => updateDraft('profitMode', e.target.value as TriggerMode)}
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition focus:border-[#2f9e62]"
> >
<option value="dollar">Dollar gain from purchase</option> <option value="dollar">Dollar gain from purchase</option>
<option value="percent">Percent gain from purchase</option> <option value="percent">Percent gain from purchase</option>
</select> </select>
</div> </div>
<label className="space-y-3"> <label className="space-y-3">
<span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-500"> <span className="text-[11px] font-black uppercase tracking-[0.24em] text-zinc-700">
{draft.profitMode === 'dollar' ? 'Profit target ($)' : 'Profit target (%)'} {draft.profitMode === 'dollar' ? 'Profit target ($)' : 'Profit target (%)'}
</span> </span>
<input <input
value={draft.profitValue} value={draft.profitValue}
onChange={(e) => updateDraft('profitValue', e.target.value)} onChange={(e) => updateDraft('profitValue', e.target.value)}
className="w-full rounded-2xl border border-white/10 bg-black/30 px-4 py-3 text-white outline-none transition focus:border-[#71f6a8]/60" className="w-full rounded-2xl border border-black/10 bg-white px-4 py-3 text-zinc-950 outline-none transition placeholder:text-zinc-400 focus:border-[#2f9e62]"
placeholder={draft.profitMode === 'dollar' ? '7.50' : '10'} placeholder={draft.profitMode === 'dollar' ? '7.50' : '10'}
/> />
</label> </label>
@ -641,7 +641,7 @@ export function SimpleView() {
)} )}
{previewText && ( {previewText && (
<div className="rounded-[1.75rem] border border-[#71f6a8]/15 bg-[#0a1710] px-5 py-4 text-sm text-zinc-200"> <div className="rounded-[1.75rem] border border-[#71f6a8]/20 bg-[#eefbf3] px-5 py-4 text-sm text-zinc-900">
{previewText} {previewText}
</div> </div>
)} )}