Pages: no horizontal overflow at 360px; trial hint names the play-both rule #31
3 changed files with 4 additions and 2 deletions
|
|
@ -5,8 +5,10 @@ main { max-width:1200px; margin:0 auto; padding:24px; }
|
|||
.eyebrow { margin:0; color:var(--acc); text-transform:uppercase; letter-spacing:.12em; font-size:12px; }
|
||||
h1 { margin:.1em 0 .2em; } h2 { font-size:16px; margin:0 0 8px; } small { color:var(--dim); font-weight:400; }
|
||||
.lede { color:var(--dim); max-width:70ch; }
|
||||
.bar label { min-width:0; max-width:100%; }
|
||||
.bar { display:flex; flex-wrap:wrap; gap:12px 16px; align-items:center; padding:12px 0; border-block:1px solid var(--line); margin-bottom:16px; }
|
||||
button, select { background:#10242b; color:var(--fg); border:1px solid var(--line); padding:6px 14px; border-radius:4px; font:inherit; }
|
||||
select { max-width:100%; }
|
||||
button:hover { border-color:var(--acc); } button:disabled { opacity:.4; }
|
||||
#status { color:var(--dim); }
|
||||
.cols { display:grid; grid-template-columns:minmax(280px,1fr) minmax(320px,1.4fr); gap:24px; }
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@
|
|||
</div>
|
||||
<button id="stop" type="button">Stop</button>
|
||||
<button id="next" type="button" disabled>Next</button>
|
||||
<p class="hint">Rate both sounds and give each exactly one word (no spaces) to continue. You can replay as often as you like.</p>
|
||||
<p class="hint">Play both sounds at least once, rate both and give each exactly one word (no spaces) to continue. You can replay as often as you like.</p>
|
||||
</section>
|
||||
|
||||
<section id="done" hidden>
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ page = f'''<!doctype html>
|
|||
body{{margin:0 auto;max-width:60rem;padding:1rem;font:1.05rem/1.5 system-ui,sans-serif;color:var(--fg);background:var(--bg)}}
|
||||
h1{{font-size:1.5rem}}h2{{font-size:1.2rem;margin-top:2rem}}h3{{font-size:1.05rem}}.sub{{font-size:.9rem;color:var(--mut);font-weight:400}}
|
||||
.notice{{border:2px solid var(--acc);padding:.75rem 1rem;border-radius:.4rem}}.caption{{margin:.25rem 0 .75rem}}
|
||||
table{{border-collapse:collapse;width:100%}}th,td{{border-top:1px solid var(--line);padding:.4rem .5rem;text-align:left;vertical-align:top}}
|
||||
table{{border-collapse:collapse;width:100%}}@media (max-width:40rem){{table{{display:block;overflow-x:auto}}}}th,td{{border-top:1px solid var(--line);padding:.4rem .5rem;text-align:left;vertical-align:top}}
|
||||
audio{{width:100%;min-width:10rem}}img{{max-width:100%;height:auto;width:48%}}figure{{margin:1rem 0}}a,summary{{color:var(--acc)}}:focus-visible{{outline:3px solid var(--acc);outline-offset:2px}}.sr{{position:absolute;left:-9999px}}label{{display:block;margin:.5rem 0}}
|
||||
</style></head><body>
|
||||
<header><h1>Ratatoskr dings: what changed after v3 (v4)</h1>
|
||||
|
|
|
|||
Loading…
Reference in a new issue