Everyone signs in to a list of their own: feeds down the side, episodes in a table with each one's notes below, and the player along the bottom, as iPodderX laid them out.
diff --git a/site/site.css b/site/site.css index bdde2d9..7eda3f7 100644 --- a/site/site.css +++ b/site/site.css @@ -62,12 +62,12 @@ h1{margin:0;color:var(--navy);font-weight:900;font-size:clamp(6.5rem,24vw,15rem) @media (prefers-reduced-motion:reduce){.needle,.stations .tuned{animation-duration:0s;animation-delay:0s}} figcaption{margin:.7rem 0 0;color:var(--muted);font-size:.9rem} -/* The app as it looks. The window in a navy panel, the dial's material, rising out of its bottom - edge; the phone in a row of its own beside what it shows, not over the window's corner. */ +/* The app as it looks. The window framed in a navy panel, the dial's material, even on every + side; the phone in a row of its own beside what it shows, not over the window's corner. */ .shots{padding-block:4.5rem 0} .shotlede{max-width:40rem;margin:-.5rem 0 1.75rem} -.window{margin:0;padding:clamp(1rem,3.2vw,2.5rem) clamp(1rem,3.2vw,2.5rem) 0;background:var(--navy);border-radius:1.25rem;overflow:hidden} -.window img{display:block;width:100%;height:auto;border-radius:.6rem .6rem 0 0;box-shadow:0 0 0 1px rgba(143,194,234,.22)} +.window{margin:0;padding:clamp(1rem,3.2vw,2.5rem);background:var(--navy);border-radius:1.25rem} +.window img{display:block;width:100%;height:auto;border-radius:.6rem;box-shadow:0 0 0 1px rgba(143,194,234,.22)} .pocket{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr);gap:clamp(2rem,7vw,5.5rem);align-items:center;padding-block:4rem 0} .pocket img{display:block;width:100%;height:auto;border-radius:1.9rem;border:.45rem solid var(--navy)} .pocket h2{margin-bottom:.75rem}