Jesse.Markowitz/interactive-story
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix stat kind dropdown sizing to match number inputs

Browse Source 
The new kind <select> fell through to the generic input/select CSS
rule instead of the compact .se-num sizing, making it visually
inconsistent with the min/max/initial number boxes next to it.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
parththakkar106
2026-07-21 17:40:22 +05:30
co-authored by Claude Sonnet 5
parent 42073d5d89
commit 8c02fe30d7
2 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/SchemaEditor.jsx
+1 -1
View File
@@ -86,7 +86,7 @@ function StatEditor({ statKey, def, onRenameKey, onChange, onRemove }) {
</> </>
)} )}
<Num label="cooldown" value={def.cooldown} onChange={(v) => set('cooldown', v)} /> <Num label="cooldown" value={def.cooldown} onChange={(v) => set('cooldown', v)} />
<label className="se-num"> <label className="se-num se-kind">
<span>kind</span> <span>kind</span>
<select value={isText ? 'text' : (def.type === 'counter' ? 'counter' : 'number')} <select value={isText ? 'text' : (def.type === 'counter' ? 'counter' : 'number')}
onChange={(e) => setType(e.target.value === 'number' ? undefined : e.target.value)}> onChange={(e) => setType(e.target.value === 'number' ? undefined : e.target.value)}>
frontend/src/index.css
+2 -1
View File
@@ -781,7 +781,8 @@ button:disabled { opacity: 0.45; cursor: default; transform: none; box-shadow: n
} }
.se-num { display: flex; flex-direction: column; gap: 2px; } .se-num { display: flex; flex-direction: column; gap: 2px; }
.se-num span { font-size: 0.7rem; color: var(--text-dim); } .se-num span { font-size: 0.7rem; color: var(--text-dim); }
.se-num input { width: 72px; padding: 3px 6px; font-size: 0.82rem; } .se-num input, .se-num select { width: 72px; padding: 3px 6px; font-size: 0.82rem; border-radius: 6px; }
.se-kind select { width: 118px; }
.se-check { .se-check {
display: flex; align-items: center; gap: 5px; display: flex; align-items: center; gap: 5px;
font-size: 0.8rem; color: var(--text-dim); font-size: 0.8rem; color: var(--text-dim);