Skip to content

Score fixes & alignment #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
HeinoDev wants to merge 2 commits into from
Closed

Score fixes & alignment #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f42daa1
Score submissions rejection & NaN Values
HeinoDev Nov 10, 2026
1484224
Alignment & typography
HeinoDev Nov 10, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@ tools/art/tex_*.png

__pycache__/
*.pyc

# The built handset page. Each release builds it into its zip (.github/workflows/release.yml); to
# run a clone, `npm run build` in web/.
# run a clone, `npm run build` in `web/`.
web/build/

web/bun.lock
2 changes: 1 addition & 1 deletion server/trapphone/phones.lua
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -737,7 +737,7 @@ end)

lib.callback.register('sd-trapphone:server:submitScore', function(src, game, score)
local phone = phones.current(src)
if not phone or type(game) ~= 'string' or #game > 16 or type(score) ~= 'number' then return false end
if not phone or game ~= 'worm' or type(score) ~= 'number' or score ~= score then return false end

score = math.floor(math.max(0, math.min(999999, score)))

Expand Down
4 changes: 3 additions & 1 deletion web/src/apps/Messages.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,9 @@ export function Messages() {

return (
<Frame title={t('ui.app.messages')} softL={threads.length ? t('ui.open') : ''} softR={t('ui.back')}>
<List rows={rows} index={nav.index} onPick={i => { nav.setIndex(i); open(i); }} empty={t('ui.messages.empty')} />
<div className="messages-list">
<List rows={rows} index={nav.index} onPick={i => { nav.setIndex(i); open(i); }} empty={t('ui.messages.empty')} />
</div>
</Frame>
);
}
Expand Down
4 changes: 2 additions & 2 deletions web/src/device/Handset.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@ function KeyButton({ k, className, label, children }: { k: Key; className: strin
}

const Arrow = ({ turn }: { turn: number }) => (
<svg width="10" height="7" viewBox="0 0 10 7" style={{ transform: `rotate(${turn}deg)` }} aria-hidden="true">
<path d="M5 0 10 7H0z" fill="currentColor" />
<svg width="12" height="9" viewBox="0 0 12 9" style={{ transform: `rotate(${turn}deg)` }} aria-hidden="true">
<path d="M6 0 12 9H0z" fill="currentColor" />
</svg>
);

Expand Down
120 changes: 94 additions & 26 deletions web/src/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -522,13 +522,15 @@ button {
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
color: var(--key-ink);
border: 1px solid rgba(0, 0, 0, 0.38);
background: linear-gradient(180deg, var(--key-a), var(--key-b));
box-shadow:
0 2px 0 rgba(0, 0, 0, 0.55),
0 3px 5px rgba(0, 0, 0, 0.35),
inset 0 1px 0 rgba(255, 255, 255, 0.85),
inset 0 -2px 3px rgba(0, 0, 0, 0.18);
0 2px 0 rgba(0, 0, 0, 0.58),
0 3px 4px rgba(0, 0, 0, 0.24),
inset 0 1px 0 rgba(255, 255, 255, 0.3),
inset 0 -2px 3px rgba(0, 0, 0, 0.26);
transition: transform 60ms, box-shadow 60ms, filter 60ms;
}

Expand Down Expand Up @@ -588,9 +590,20 @@ button {
align-self: center;
width: 94px;
height: 94px;
box-sizing: border-box;
border: 1px solid rgba(0, 0, 0, 0.72);
border-radius: 50%;
background: conic-gradient(from 210deg, var(--trim-a), var(--trim-b), var(--trim-a), var(--trim-b), var(--trim-a));
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.35);
background: radial-gradient(circle at 38% 28%, #626a74, #3d444d 58%, #242930 100%);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.48), inset 0 2px 5px rgba(0, 0, 0, 0.62), inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.dpad::before {
content: '';
position: absolute;
inset: 3px;
border-radius: 50%;
background: repeating-conic-gradient(from 45deg, rgba(0, 0, 0, 0.36) 0deg 0.7deg, rgba(255, 255, 255, 0.1) 0.7deg 1.4deg, transparent 1.4deg 90deg);
pointer-events: none;
}

.dpad-dir {
Expand All @@ -600,14 +613,22 @@ button {
justify-content: center;
width: 34px;
height: 26px;
color: #232a36;
border-radius: 6px;
color: #20252b;
border: 0;
border-radius: 50%;
background: transparent;
box-shadow: none;
}

.dpad-dir svg {
filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.45));
}

.dpad-dir:active,
.dpad-dir.key-down {
color: #000;
background: rgba(0, 0, 0, 0.14);
color: #101419;
transform: translateY(1px);
filter: brightness(0.78);
}

.dpad-up { top: 2px; left: 30px; }
Expand All @@ -617,10 +638,22 @@ button {

.dpad-ok {
position: absolute;
inset: 26px;
inset: 34px;
border: 2px solid rgba(10, 12, 15, 0.8);
border-radius: 50%;
font-size: 9px;
letter-spacing: 0.08em;
color: #f1f3f5;
background: linear-gradient(145deg, #727a84, #353b43 72%);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 -2px 2px rgba(0, 0, 0, 0.28);
font-size: 8px;
font-weight: 600;
letter-spacing: 0.04em;
}

.dpad-ok:active,
.dpad-ok.key-down {
transform: translateY(1px);
filter: brightness(1.08);
box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.hs-pad {
Expand All @@ -630,14 +663,30 @@ button {
right: 34px;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 8px 9px;
gap: 10px 11px;
isolation: isolate;
}

.hs-pad::before {
content: '';
position: absolute;
inset: -7px -6px;
z-index: 0;
border-radius: 18px;
background: rgba(18, 22, 28, 0.2);
box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.34), 0 1px 0 rgba(255, 255, 255, 0.12);
}

.hs-pad .key {
z-index: 1;
}

.key-digit {
flex-direction: column;
height: 32px;
gap: 5px;
border-radius: 15px / 14px;
text-shadow: 0 0 5px var(--led);
gap: 1px;
border-radius: 12px / 11px;
text-shadow: none;
}

/* The middle column sits a touch lower: the keypad follows the curve of the chin. */
Expand All @@ -646,16 +695,20 @@ button {
}

.key-num {
font-size: 15px;
font-size: 16px;
font-weight: 600;
line-height: 1;
}

.key-abc {
font-size: 6.5px;
letter-spacing: 0.08em;
opacity: 0.75;
font-family: Arial, sans-serif;
font-size: 8px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.04em;
opacity: 0.9;
min-width: 20px;
text-align: left;
text-align: center;
}

.hs-mic {
Expand Down Expand Up @@ -692,8 +745,8 @@ button {
display: flex;
flex-direction: column;
font-family: 'Trap Digits', 'Pixelify Sans', system-ui, sans-serif;
font-size: 15px;
line-height: 1.15;
font-size: 16px;
line-height: 1.2;
color: var(--ink);
-webkit-font-smoothing: none;
}
Expand Down Expand Up @@ -805,6 +858,7 @@ button {
.frame-title {
flex: none;
padding: 3px 7px 4px;
line-height: 1.25;
font-weight: 600;
color: #fff;
background: linear-gradient(180deg, var(--title-a), var(--title-b));
Expand Down Expand Up @@ -871,6 +925,7 @@ button {
width: 100%;
min-height: 24px;
padding: 3px 7px;
line-height: 1.2;
box-sizing: border-box;
text-align: left;
border-bottom: 1px solid var(--panel-2);
Expand Down Expand Up @@ -909,10 +964,19 @@ button {
.row-label { font-weight: 600; }

.row-sub {
font-size: 13px;
font-size: 14px;
line-height: 1.2;
opacity: 0.72;
}

.messages-list .row-sub {
display: -webkit-box;
white-space: normal;
overflow-wrap: anywhere;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.row-right {
flex: none;
font-size: 13px;
Expand Down Expand Up @@ -1060,6 +1124,9 @@ button {
font-weight: 600;
}

.ticket-line span:first-child { min-width: 0; overflow-wrap: anywhere; }
.ticket-line span:last-child { flex: none; }

.ticket-meta {
display: flex;
justify-content: space-between;
Expand Down Expand Up @@ -1148,7 +1215,8 @@ button {
text-align: center;
}

.pix { display: block; image-rendering: pixelated; }
/* Pixel-art glyphs read low when their bounding boxes are mathematically centred. */
.pix { display: block; image-rendering: pixelated; transform: translateY(-1px); }

/* Toast, confirm, boot, peek */

Expand Down