UI pass: Script as a screenplay page, clearer Setups #218

Merged

crowmaki merged 1 commit from ui-pass-script-page into main 2026-10-16 07:30:47 +00:00

Conversation 0 Commits 1 Files changed 10 +103 -84

crowmaki commented 2026-10-16 07:25:35 +00:00

Owner

Copy link

A UI pass inside ADR-0006's design language: dark, dense, neutral greys, one cool accent. It has one bold move, on the Script, and a handful of clarity fixes.

Script as a screenplay page

The Script is now set in Courier Prime, the open-licence face screenwriters use, on a centred page with Scene numbers in both margins, as in a shooting script. Lighting and flag badges move onto the heading line, so they no longer sit between the heading and the action.

The font ships as @fontsource/courier-prime, so the app stays offline. It sits behind a new --script token in app.css. In a narrow pane the page drops its border and the right-hand numbers.

This also fixes a bug: scene headings sat about 4px left of the action text, because the number's negative margin didn't account for the flex gap.

Before	After

Setups and Shots read as units

Each Setup's Subjects, Atlases, Blocking plan and Shots now hang under its letter on one left rule. Setup and Shot labels used to be the dimmest text in their blocks and are now full-strength. Each Shot has a hairline above it.

Before	After

Setup and Shot paths open the Scene

/scenes/…/setups/… and /scenes/…/shots/… still showed a "Not built yet" placeholder pointing at #40 and #41, both of which are closed. Storage's "Open Shot" led there. These paths now open the Scenes view scrolled to that Setup or Shot, with the accent on the Setup's rule or the selection tint on the Shot. PlaceholderView had no other users, so it's deleted.

Before	After

Smaller fixes

• Lighting settings: the Phrase input was cut off at "soft daylight through th" in a wide column. It now fills the column, and Name gets a fixed 14rem.
• Start screen: "App settings…" lines up with the buttons above it instead of its own invisible ghost-button padding, and the description wraps with text-wrap: pretty.

Before	After

For review

ADR-0006's type line names only system-ui and ui-monospace. If the Courier Prime page stays, the ADR should name the script face too. That can go in this PR or a follow-up.

Testing

• bun run check: 0 errors, 0 warnings.
• bun test src: 323 pass.
• Before and after screenshots were taken in the running app on the same Project (main stashed, then this branch).

A UI pass inside ADR-0006's design language: dark, dense, neutral greys, one cool accent. It has one bold move, on the Script, and a handful of clarity fixes. ## Script as a screenplay page The Script is now set in Courier Prime, the open-licence face screenwriters use, on a centred page with Scene numbers in both margins, as in a shooting script. Lighting and flag badges move onto the heading line, so they no longer sit between the heading and the action. The font ships as `@fontsource/courier-prime`, so the app stays offline. It sits behind a new `--script` token in `app.css`. In a narrow pane the page drops its border and the right-hand numbers. This also fixes a bug: scene headings sat about 4px left of the action text, because the number's negative margin didn't account for the flex gap. | Before | After | |---|---| |  |  | ## Setups and Shots read as units Each Setup's Subjects, Atlases, Blocking plan and Shots now hang under its letter on one left rule. Setup and Shot labels used to be the dimmest text in their blocks and are now full-strength. Each Shot has a hairline above it. | Before | After | |---|---| |  |  | ## Setup and Shot paths open the Scene `/scenes/…/setups/…` and `/scenes/…/shots/…` still showed a "Not built yet" placeholder pointing at #40 and #41, both of which are closed. Storage's "Open Shot" led there. These paths now open the Scenes view scrolled to that Setup or Shot, with the accent on the Setup's rule or the selection tint on the Shot. `PlaceholderView` had no other users, so it's deleted. | Before | After | |---|---| |  |  | ## Smaller fixes - **Lighting settings:** the Phrase input was cut off at "soft daylight through th" in a wide column. It now fills the column, and Name gets a fixed 14rem. - **Start screen:** "App settings…" lines up with the buttons above it instead of its own invisible ghost-button padding, and the description wraps with `text-wrap: pretty`. | Before | After | |---|---| |  |  | |  |  | ## For review ADR-0006's type line names only system-ui and ui-monospace. If the Courier Prime page stays, the ADR should name the script face too. That can go in this PR or a follow-up. ## Testing - `bun run check`: 0 errors, 0 warnings. - `bun test src`: 323 pass. - Before and after screenshots were taken in the running app on the same Project (`main` stashed, then this branch).

1-script-after.png

71 KiB

1-script-before.png

72 KiB

2-setups-after.png

81 KiB

2-setups-before.png

80 KiB

3-shot-route-after.png

77 KiB

3-shot-route-before.png

34 KiB

4-lighting-after.png

39 KiB

4-lighting-before.png

38 KiB

5-start-after.png

17 KiB

5-start-before.png

17 KiB

crowmaki added 1 commit 2026-10-16 07:25:35 +00:00

UI pass: set the Script as a screenplay page, and clarify Setups ... 2ad87d9f67

- Script: Courier Prime on a centred page, Scene numbers in both
  margins, Lighting badges on the heading line, and headings aligned
  with action (the number offset left them ~4px out).
- Scenes: a rule ties each Setup's parts together under its letter,
  and Setup and Shot labels are no longer the dimmest text.
- Setup and Shot paths open the Scenes view scrolled to and tinting
  that Setup or Shot, instead of a stale "Not built yet" placeholder
  (#40 and #41 are closed). Storage's "Open Shot" lands there.
- Lighting settings: the Phrase input fills its column.
- Start screen: "App settings…" lines up with the buttons above it.

crowmaki merged commit d32ed570da into main 2026-10-16 07:30:47 +00:00

crowmaki deleted branch ui-pass-script-page 2026-10-16 07:30:47 +00:00

crowmaki referenced this pull request from a commit 2026-10-16 07:30:49 +00:00

Merge pull request 'UI pass: Script as a screenplay page, clearer Setups' (#218) from ui-pass-script-page into main

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels   

bug

Something is not working

  

duplicate

This issue or pull request already exists

  

enhancement

New feature

  

help wanted

Need some help

  

invalid

Something is wrong

  

needs-info

Waiting on reporter for more information

  

needs-triage

Maintainer needs to evaluate this issue

  

question

More information is needed

  

ready-for-agent

Fully specified, ready for an AFK agent

  

ready-for-human

Requires human implementation

  

wayfinder:grilling

Needs a decision talked through with a human

  

wayfinder:map

Index of decisions and open questions for a large effort

  

wayfinder:prototype

Needs a rough artifact built to react to

  

wayfinder:research

Needs facts gathered from docs or external sources

  

wayfinder:task

Manual work that must happen before a decision

  

wontfix

Will not be actioned

No labels

bug

duplicate

enhancement

help wanted

invalid

needs-info

needs-triage

question

ready-for-agent

ready-for-human

wayfinder:grilling

wayfinder:map

wayfinder:prototype

wayfinder:research

wayfinder:task

wontfix

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

crowmaki/ai-studio!218

No description provided.