ui(properties): no raw typography left in the panel, and one heading rank

The earlier pass checked wiring only; this is the typography sweep. Raw Foreground/FontSize
labels are gone from the elements panel:

- Opacity, Timer (minutes) and URI are headings above their control (PropertyHeader), with the
  control row on the panel's 10px indent — the same shape as Border Thickness/Opacity.
- Scroll speed, scoreboard Opacity/Text size and their value readouts are PropertyFieldLabel.
- The drag hint and the scoreboard sign-in note are PropertyHint.
- Simulate (dev) keeps its orange, gains the field-label typography.
- Edge, Text colour and Background were PropertySubHeader/SubHeader: ONE heading rank now, so
  PropertySubHeader and the legacy SubHeader are deleted from Themes/Controls.xaml.
- DeveloperPanel — the last panel with raw typography and an unstyled CheckBox — now uses the
  same styles, and PropertiesStyleTests accepts PropertyPillCheck (the guard went stale when
  every check box became a pill switch). 18 tests pass; Release 0 warnings.
This commit is contained in:
2026-11-01 16:26:20 -08:00
parent 790cff45c2
commit 54902cb838
4 changed files with 47 additions and 48 deletions
+8 -15
View File
@@ -147,9 +147,11 @@
(the guard test in ytLive.Tests/PropertiesStyleTests.cs enforces it). -->
<!-- ═══ Property-panel typography (2026-11-01) ═══
One hierarchy for every properties section, so no panel invents its own:
PropertyHeader — the category (bright, 11px, semibold)
PropertySubHeader — a field label inside it (dim, 10px, indented)
PropertyHint — the explanatory sentence under a control (dim, 10px, wrapped)
PropertyHeader — the heading of a group (bright, 11px, semibold)
PropertyFieldLabel — the label in a row with its control (dim, 10px, semibold)
PropertyHint — the explanatory sentence under a control (dim, 10px, wrapped)
ONE heading rank: a group is never sometimes a header and sometimes a sub-header, which
is what put Ticker out of step with Geometry (creator ruling, 2026-11-01).
Colour does the grouping: bright for the thing you are editing, dim for its labels and
help. No new palette entries; these are the existing OnSurface / OnSurfaceVariant tokens. -->
<Style x:Key="PropertyHeader" TargetType="TextBlock">
@@ -159,18 +161,9 @@
<Setter Property="Margin" Value="0,0,0,6"/>
</Style>
<!-- Sub-headings sit FLUSH LEFT, level with the category header; it is their smaller size and
dimmer colour that make them subordinate, not an indent. Only the controls indent. -->
<Style x:Key="PropertySubHeader" TargetType="TextBlock">
<Setter Property="Foreground" Value="{StaticResource Brush.OnSurfaceVariant}"/>
<Setter Property="FontSize" Value="10"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="Margin" Value="0,6,0,3"/>
</Style>
<!-- A field label that sits in a row with its control (DockPanel.Dock="Left", fixed Width).
Same typography as PropertySubHeader, but vertically centred and marginless so the rows
stay on a grid. -->
<!-- A field label that sits in a row with its control (DockPanel.Dock="Left", fixed Width),
or a value readout beside a slider. Vertically centred and marginless so the rows stay on
a grid. -->
<Style x:Key="PropertyFieldLabel" TargetType="TextBlock">
<Setter Property="Foreground" Value="{StaticResource Brush.OnSurfaceVariant}"/>
<Setter Property="FontSize" Value="10"/>