Michael/CollectFlow
1
0 Fork 0
mirror of https://github.com/R0m1k3/CollectFlow.git synced 2026-10-19 05:06:56 +02:00
Code Issues Packages Projects Releases Wiki Activity

style(ux): final refinements to inline selection and visual balance

Browse Source
This commit is contained in:
Michael committed 2026-02-21 18:53:22 +01:00
1 parent c2dbaa7fbc
commit 86c6946c3e
1 file changed
+7 -7
Download Patch File Download Diff File Expand all files Collapse all files
src/features/grid/components/gamme-select.tsx
+7 -7
View File
@@ -10,10 +10,10 @@ interface GammeSelectProps {
} }
const GAMME_STYLES: Record<GammeCode, string> = { const GAMME_STYLES: Record<GammeCode, string> = {
A: "border-[2px] border-emerald-500 bg-emerald-50 text-emerald-900 dark:border-emerald-400 dark:bg-emerald-900/40 dark:text-emerald-100", A: "border-[1px] border-emerald-500/30 bg-emerald-500/10 text-emerald-700 dark:border-emerald-500/30 dark:bg-emerald-500/20 dark:text-emerald-400",
B: "border-[2px] border-blue-500 bg-blue-50 text-blue-900 dark:border-blue-400 dark:bg-blue-900/40 dark:text-blue-100", B: "border-[1px] border-blue-500/30 bg-blue-500/10 text-blue-700 dark:border-blue-500/30 dark:bg-blue-500/20 dark:text-blue-400",
C: "border-[2px] border-amber-500 bg-amber-50 text-amber-900 dark:border-amber-400 dark:bg-amber-900/40 dark:text-amber-100", C: "border-[1px] border-amber-500/30 bg-amber-500/10 text-amber-700 dark:border-amber-500/30 dark:bg-amber-500/20 dark:text-amber-400",
Z: "border-[2px] border-rose-600 bg-rose-50 text-rose-900 dark:border-rose-500 dark:bg-rose-900/50 dark:text-rose-100", Z: "border-[1px] border-rose-500/30 bg-rose-500/10 text-rose-700 dark:border-rose-500/30 dark:bg-rose-500/20 dark:text-rose-400",
}; };
export function GammeSelect({ value, isDraft, onChange }: GammeSelectProps) { export function GammeSelect({ value, isDraft, onChange }: GammeSelectProps) {
@@ -22,12 +22,12 @@ export function GammeSelect({ value, isDraft, onChange }: GammeSelectProps) {
value={value ?? ""} value={value ?? ""}
onChange={(e) => onChange(e.target.value as GammeCode)} onChange={(e) => onChange(e.target.value as GammeCode)}
className={cn( className={cn(
"w-full text-xs font-black rounded-lg py-2 px-2 outline-none cursor-pointer shadow-sm transition-all text-center", "w-full text-xs font-bold rounded-lg py-1.5 px-2 outline-none cursor-pointer shadow-sm transition-all text-center",
"focus:ring-2 focus:ring-brand-500/20", "focus:ring-2 focus:ring-brand-500/20",
value value
? GAMME_STYLES[value] ? GAMME_STYLES[value]
: "border-2 border-slate-300 dark:border-slate-700 bg-white dark:bg-slate-800 text-slate-500", : "border-[1px] border-slate-300 dark:border-slate-700 bg-white dark:bg-slate-800 text-slate-500",
isDraft && "shadow-[0_0_10px_rgba(251,191,36,0.5)] border-amber-400" isDraft && "shadow-[0_0_8px_rgba(251,191,36,0.3)] border-amber-400/50"
)} )}
> >
<option value="" disabled>—</option> <option value="" disabled>—</option>