feat(top bar): EDIT moves beside the gear; the gear wears the app's orange

- EDIT leaves the centre session cluster and sits immediately right of the gear, in the brand
  column — so mode lives with the controls that configure the app, not with the session buttons.
- The gear is a LlamaCasty control, so its icon is `attention` orange instead of muted grey.

Guard: UiShellTests asserts the gear fill and that EDIT appears before the centre (session)
cluster, so a later reformat cannot quietly put it back.
This commit is contained in:
2026-10-30 11:18:36 -07:00
parent 0f8647790d
commit 17249229c8
2 changed files with 26 additions and 10 deletions
+10 -10
View File
@@ -47,21 +47,13 @@
</ContextMenu>
</Button.ContextMenu>
<Path Data="M19.43,12.98c0.04,-0.32 0.07,-0.65 0.07,-0.98c0,-0.33 -0.03,-0.66 -0.07,-0.98l2.11,-1.65c0.19,-0.15 0.24,-0.42 0.12,-0.64l-2,-3.46c-0.12,-0.22 -0.38,-0.31 -0.61,-0.22l-2.49,1c-0.52,-0.4 -1.08,-0.73 -1.69,-0.98l-0.38,-2.65C14.46,2.18 14.25,2 14,2h-4c-0.25,0 -0.46,0.18 -0.49,0.42l-0.38,2.65c-0.61,0.25 -1.17,0.59 -1.69,0.98l-2.49,-1c-0.23,-0.09 -0.49,0 -0.61,0.22l-2,3.46c-0.13,0.22 -0.07,0.49 0.12,0.64l2.11,1.65c-0.04,0.32 -0.07,0.65 -0.07,0.98c0,0.33 0.03,0.66 0.07,0.98l-2.11,1.65c-0.19,0.15 -0.24,0.42 -0.12,0.64l2,3.46c0.12,0.22 0.38,0.31 0.61,0.22l2.49,-1c0.52,0.4 1.08,0.73 1.69,0.98l0.38,2.65c0.03,0.24 0.24,0.42 0.49,0.42h4c0.25,0 0.46,-0.18 0.49,-0.42l0.38,-2.65c0.61,-0.25 1.17,-0.59 1.69,-0.98l2.49,1c0.23,0.09 0.49,0 0.61,-0.22l2,-3.46c0.12,-0.22 0.07,-0.49 -0.12,-0.64L19.43,12.98zM12,15.5c-1.93,0 -3.5,-1.57 -3.5,-3.5c0,-1.93 1.57,-3.5 3.5,-3.5c1.93,0 3.5,1.57 3.5,3.5C15.5,13.93 13.93,15.5 12,15.5z"
Fill="{StaticResource Brush.OnSurfaceVariant}" Width="18" Height="18" Stretch="Uniform"/>
Fill="{StaticResource Brush.Attention}" Width="18" Height="18" Stretch="Uniform"/>
</Button>
</StackPanel>
<!-- Session surface (top bar redesign): the bar is ONE surface rendered by
the FIRST decision — Record or Stream. Each world is the whole bar; the
other world never exists on screen. While running, the bar drops to a
reality line + End so nothing mid-session can be re-armed. -->
<StackPanel Grid.Column="1" Orientation="Horizontal"
HorizontalAlignment="Center" VerticalAlignment="Center">
<!-- EDIT: explicit toggle. Neutral = off (chat), blue = on (layers/properties). The
trigger used to set the SAME colour as the resting state, so the button never
looked pressed. -->
<ToggleButton IsChecked="{Binding EditingActive, Mode=TwoWay}" Content="EDIT"
Cursor="Hand" Height="32" Padding="14,0" Margin="0,0,24,0" VerticalAlignment="Center"
Cursor="Hand" Height="32" Padding="14,0" Margin="18,0,0,2" VerticalAlignment="Center"
FontWeight="Bold" FontSize="12" Foreground="{StaticResource Brush.OnAccent}" BorderThickness="0">
<ToggleButton.Template>
<ControlTemplate TargetType="ToggleButton">
@@ -76,6 +68,14 @@
</ControlTemplate>
</ToggleButton.Template>
</ToggleButton>
</StackPanel>
<!-- Session surface (top bar redesign): the bar is ONE surface rendered by
the FIRST decision — Record or Stream. Each world is the whole bar; the
other world never exists on screen. While running, the bar drops to a
reality line + End so nothing mid-session can be re-armed. -->
<StackPanel Grid.Column="1" Orientation="Horizontal"
HorizontalAlignment="Center" VerticalAlignment="Center">
<!-- IDLE: the mode switch + the action(s) of the armed world. The three
controls share one height (build 77 feedback) so they read as one
family — segments host, Start/Go Live, and Test all sit at 32. -->
+16
View File
@@ -74,6 +74,22 @@ public class UiShellTests
Assert.Contains("return;", preview);
}
[Fact]
public void Edit_sits_beside_the_orange_gear()
{
var topBar = SourceAssert.Text("Controls", "TopBar.xaml");
// The gear is a LlamaCasty control, so it wears the app's orange (not a muted icon grey).
Assert.Contains("Fill=\"{StaticResource Brush.Attention}\" Width=\"18\" Height=\"18\"", topBar);
// EDIT lives in the LEFT cluster, immediately after the gear — not in the centre session
// cluster (creator ruling 2026-10-30).
var edit = topBar.IndexOf("EditingActive", System.StringComparison.Ordinal);
var centre = topBar.IndexOf("Grid.Column=\"1\"", System.StringComparison.Ordinal);
Assert.True(edit > 0 && centre > edit,
"the EDIT toggle must appear before the centre (session) cluster");
}
private static int Count(string haystack, string needle)
{
var hits = 0;