zenno/mspeed: fix display on mobile, maybe

This commit is contained in:
2026-05-25 22:49:27 -04:00
parent 6a30b1d6f0
commit efb36f705c

View File

@@ -68,7 +68,10 @@
: null,
]);
const lcY: Array<ComputedSeries | null> = $derived([
{ label: 'Ideal Lane Combo', y: (x) => speedGain(moveLaneModifier(x), lcDur, accel[0], decel[0]) / HORSE_LENGTH },
{
label: 'Ideal Lane Combo',
y: (x) => speedGain(moveLaneModifier(x), lcDur, acceleration(x, style, surfApt, Phase.EarlyRace), decel[0]) / HORSE_LENGTH,
},
]);
const pcRuler = $derived({
y: speedGain(0.35, skillDuration(2.4, raceLen), accel[1], decel[1]) / HORSE_LENGTH,
@@ -121,23 +124,23 @@
</div>
</div>
<span class="mt-8 block w-full text-center text-lg">Mechanics</span>
<div class="mx-auto flex w-full flex-col md:flex-row md:justify-center">
<div class="mx-auto flex w-full flex-col place-items-center md:flex-row md:justify-center">
<SpeedDur speed={ssBoost} dur={ssDur} accel={accel[0]} decel={[decel[0], decel[1]]}>Spot Struggle</SpeedDur>
<SpeedDur speed={lcBoost} dur={lcDur} accel={accel[0]} decel={decel[0]}>Idealized Lane Combo (DDPP)</SpeedDur>
</div>
<span class="mt-8 block w-full text-center text-lg">Unique Skills</span>
<div class="mx-auto flex flex-col md:flex-row md:justify-center">
<div class="mx-auto flex flex-col place-items-center md:flex-row md:justify-center">
{#each uniques as [name, boost, dur, phase] (name)}
<SpeedDur speed={boost} dur={skillDuration(dur, raceLen)} accel={accel[phase]} decel={decel[phase]}>{name}</SpeedDur>
{/each}
</div>
<span class="mt-8 block w-full text-center text-lg">Inherited Uniques &amp; Other Skills</span>
<div class="mx-auto flex flex-col md:flex-row md:justify-center">
<div class="mx-auto flex flex-col place-items-center md:flex-row md:justify-center">
{#each skills as [name, boost, dur, phase] (name)}
<SpeedDur speed={boost} dur={skillDuration(dur, raceLen)} accel={accel[phase]} decel={decel[phase]}>{name}</SpeedDur>
{/each}
</div>
<div class="mx-auto h-60 py-4 md:h-96 md:w-3xl">
<div class="mx-auto grid h-96 grid-cols-1 py-4 md:grid-cols-2">
<StatChart
class="flex-1"
stat={Stat.Guts}
@@ -147,8 +150,6 @@
xRule={gutsStat}
yRule={ssYRule}
/>
</div>
<div class="mx-auto mt-4 h-60 py-4 md:mt-0 md:h-96 md:w-3xl">
<StatChart
class="flex-1"
stat={Stat.Power}
@@ -159,7 +160,7 @@
yRule={lcYRule}
/>
</div>
<div class="mx-auto mt-12 w-full max-w-4xl border-t md:mt-8">
<div class="mx-auto mt-12 w-full max-w-4xl border-t pt-4 md:mt-8">
<ul class="ml-4 list-disc">
<li>All lengths gained include acceleration at the beginning of each speed boost and deceleration after its end.</li>
<li>Each effect is assumed to be isolated and executed on level ground.</li>