feat(ui): the creator's six corrections
1. Stream Info + YPP rails are YouTube surfaces → new `youtube` token #ff0000. It is documented as brand-only: live state stays `primary`, so the two reds never mean the same thing. 2. EDIT toggle: the checked trigger set the SAME colour as the resting face, so clicking it changed nothing visible. Resting is now the neutral surface with muted text; armed is blue with dark text, and the label follows the fill. 3. Active scene outline is orange again (`attention`) — it marks the scene you work on, not a selection; blue made it read as "selected". Live stays red. 4. Scene names wear the same pill as the hotkey chips (black, 10px radius, 8×2 padding), so both labels stay readable over any thumbnail. 5. REC / ON-AIR pills and the running stop button read red while armed/live — including test mode, where the top bar is gold. New `RecordPillToggle` style (its own template, because SegmentToggle hard-codes a transparent face); the stop button's grey `#333` literal is gone. 6. The properties list had `MaxHeight="420"` inside an Auto row, so it scrolled while the window had space left. The row is `*` now and the cap is gone. Guard: UiShellTests pins all six to the markup and names the one that regresses.
This commit is contained in:
@@ -0,0 +1,63 @@
|
||||
using System.Linq;
|
||||
using Xunit;
|
||||
|
||||
namespace ytLive.Tests;
|
||||
|
||||
/// <summary>The creator's six corrections (2026-10-30) are visual rulings, so the only honest guard
|
||||
/// is one that pins the ruling to the markup: if a later edit quietly reverts one of them, this
|
||||
/// fails and names it.
|
||||
///
|
||||
/// <para>1. Stream Info + YPP rails are YouTube surfaces (YouTube red). 2. EDIT shows a real
|
||||
/// off/on difference. 3. The active scene outline is orange again. 4. Scene labels wear the same
|
||||
/// pill as the hotkey chips. 5. REC / ON-AIR and the running stop button read red. 6. The
|
||||
/// properties list no longer caps its height, so no scrollbar appears while space remains.</para></summary>
|
||||
public class UiShellTests
|
||||
{
|
||||
[Fact]
|
||||
public void The_creators_six_ui_corrections_are_in_the_markup()
|
||||
{
|
||||
var preview = SourceAssert.Text("Controls", "PreviewPane.xaml");
|
||||
var topBar = SourceAssert.Text("Controls", "TopBar.xaml");
|
||||
var strip = SourceAssert.Text("Controls", "SceneThumbnailStrip.xaml");
|
||||
var leftPanel = SourceAssert.Text("Controls", "LeftPanel.xaml");
|
||||
var theme = SourceAssert.Text("Themes", "Controls.xaml");
|
||||
var tokens = SourceAssert.Text("Themes", "Tokens.xaml");
|
||||
|
||||
// 1. YouTube-branded rails.
|
||||
Assert.Contains("Brush.Youtube", tokens);
|
||||
Assert.Equal(2, Count(preview, "Background=\"{StaticResource Brush.Youtube}\""));
|
||||
|
||||
// 2. EDIT: resting face differs from the armed face, and the label follows it.
|
||||
Assert.Contains("x:Name=\"EditBody\" Background=\"{StaticResource Brush.SurfaceContainerHigh}\"", topBar);
|
||||
Assert.Contains("<Setter TargetName=\"EditBody\" Property=\"Background\" Value=\"{StaticResource Brush.Tertiary}\"/>", topBar);
|
||||
Assert.Contains("<Setter Property=\"Foreground\" Value=\"{StaticResource Brush.OnTertiary}\"/>", topBar);
|
||||
|
||||
// 3. Active scene = orange; live stays red.
|
||||
Assert.Contains("IsStaged}\" Value=\"True\">\n <Setter Property=\"BorderBrush\" Value=\"{StaticResource Brush.Attention}\"/>", strip);
|
||||
|
||||
// 4. Scene name pill, same shape as the hotkey chip.
|
||||
Assert.Contains("Padding=\"8,2\" CornerRadius=\"10\" Background=\"#000000\"", strip);
|
||||
Assert.Contains("Text=\"{Binding Name, Mode=OneWay}\"", strip);
|
||||
|
||||
// 5. Armed session controls are red, and the running stop button is red — not a grey literal.
|
||||
Assert.Contains("x:Key=\"RecordPillToggle\"", theme);
|
||||
Assert.Contains("Brush.Primary", theme);
|
||||
Assert.Contains("Style=\"{StaticResource RecordPillToggle}\"", topBar);
|
||||
Assert.Contains("Background=\"{StaticResource Brush.Primary}\" Margin=\"14,0,0,0\"", topBar);
|
||||
Assert.DoesNotContain("Background=\"#333\"", topBar);
|
||||
|
||||
// 6. No artificial height cap on the properties list: the list fills the row, so a
|
||||
// scrollbar appears only when the content genuinely exceeds the space.
|
||||
var listLine = leftPanel.Split('\n').First(line => line.Contains("ElementsScrollViewer"));
|
||||
Assert.DoesNotContain("MaxHeight", listLine);
|
||||
}
|
||||
|
||||
private static int Count(string haystack, string needle)
|
||||
{
|
||||
var hits = 0;
|
||||
for (var i = haystack.IndexOf(needle, System.StringComparison.Ordinal); i >= 0;
|
||||
i = haystack.IndexOf(needle, i + needle.Length, System.StringComparison.Ordinal))
|
||||
hits++;
|
||||
return hits;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user