Fix minor usability/DOM issues
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Dominic Zimmer 2026-02-01 13:46:38 +01:00
parent abb69f45e3
commit 309db89f59
2 changed files with 9 additions and 9 deletions

View File

@ -246,6 +246,7 @@ dialog > div label {
text-align: center; text-align: center;
} }
&.heading> div { &.heading> div {
overflow: hidden;
background-color: #b6b6b6; background-color: #b6b6b6;
text-align: center; text-align: center;
} }

View File

@ -12,7 +12,6 @@ export const AdminUI: React.FC = () => {
const adminToken = useMemo(() => parseToken(location.href) ?? "", []); const adminToken = useMemo(() => parseToken(location.href) ?? "", []);
const loadPartyList = useCallback(async () => { const loadPartyList = useCallback(async () => {
console.log("load party list");
const listPartyResponse = await listPartyRequest(adminToken); const listPartyResponse = await listPartyRequest(adminToken);
if (selectedParty === undefined) if (selectedParty === undefined)
setSelectedParty(listPartyResponse.length > 0 ? 0 : undefined); setSelectedParty(listPartyResponse.length > 0 ? 0 : undefined);
@ -99,14 +98,14 @@ export const AdminUI: React.FC = () => {
: null} : null}
<dialog id="dialog-edit-party"> <dialog id="dialog-edit-party">
<div> <div>
<span className="lg">Edit Parties</span> <h1>Edit Parties</h1>
<div className="dialog-party-table"> <div className="dialog-party-table">
{partyList.map((p, _i)=> <> {partyList.map((p, i)=> <Fragment key={i}>
<b>{p.name}</b> <b>{p.name}</b>
<label htmlFor={`edit-keys-${p.name}`}>ExtraData:</label> <label htmlFor={`edit-keys-${p.name}`}>ExtraData:</label>
<input type="text" id={`payload-${p.name}`} defaultValue={JSON.stringify(p.allowed_extra)} /> <input type="text" id={`payload-${p.name}`} defaultValue={JSON.stringify(p.allowed_extra)} />
<button onClick={() => updateExtras(p.name)}>update</button> <button onClick={() => updateExtras(p.name)}>update</button>
</>)} </Fragment>)}
</div> </div>
<span className="danger-hint">To delete a party, enter <pre>deletethis</pre> and press update!</span> <span className="danger-hint">To delete a party, enter <pre>deletethis</pre> and press update!</span>
<div className="dialog-bottom"> <div className="dialog-bottom">
@ -195,10 +194,10 @@ export const ExtraDataTable : React.FC<{
<h2 style={{gridColumn:"1/span 2", textAlign: "center"}} >Extras</h2> <h2 style={{gridColumn:"1/span 2", textAlign: "center"}} >Extras</h2>
{Object.entries(allowed_extra).map(([extra, maxLen], index) => {Object.entries(allowed_extra).map(([extra, maxLen], index) =>
<> <Fragment key={index}>
<label key={`extra-${extra}-label`} htmlFor={`edit-extra-${extra}`}>{extra}</label> <label htmlFor={`edit-extra-${extra}`}>{extra}</label>
<input className={((editUserData.extra[extra]??"").length > maxLen ? "invalid" : "")} key={`extra-${extra}-input` } type="text" id={`edit-extra-${extra}`} value={editUserData.extra[extra]} onChange={(e) => { setEditUserData({ ...editUserData, extra: {...editUserData.extra, [extra]: e.target.value}}) }} /> <input className={((editUserData.extra[extra]??"").length > maxLen ? "invalid" : "")} type="text" id={`edit-extra-${extra}`} value={editUserData.extra[extra]} onChange={(e) => { setEditUserData({ ...editUserData, extra: {...editUserData.extra, [extra]: e.target.value}}) }} />
</> </Fragment>
)} )}
</>; </>;
} }
@ -262,7 +261,7 @@ export const PartyUI: React.FC<{ party: ResponseCreateParty, adminToken: string,
<div onContextMenu={(e) => { e.preventDefault(); exportPartyLink(guest); }} onClick={() => editUser(guest)}>{guest.grammatical_gender}</div> <div onContextMenu={(e) => { e.preventDefault(); exportPartyLink(guest); }} onClick={() => editUser(guest)}>{guest.grammatical_gender}</div>
<div onContextMenu={(e) => { e.preventDefault(); exportPartyLink(guest); }} onClick={() => editUser(guest)}>{guest.coming ?? "?"}</div> <div onContextMenu={(e) => { e.preventDefault(); exportPartyLink(guest); }} onClick={() => editUser(guest)}>{guest.coming ?? "?"}</div>
{hasExtras ? {hasExtras ?
<div ><ExtraTable party={party} guest={guest} onContextMenu={(e) => { e.preventDefault(); exportPartyLink(guest); }} onClick={() => editUser(guest)}/></div> <div onContextMenu={(e) => { e.preventDefault(); exportPartyLink(guest); }} onClick={() => editUser(guest)}><ExtraTable party={party} guest={guest} /></div>
: null} : null}
</Fragment> </Fragment>
)} )}