From d350a8932485f618b1658353a0573ac2422a3c36 Mon Sep 17 00:00:00 2001 From: jtippet Date: Mon, 6 Jul 2020 07:13:23 -0700 Subject: [PATCH] Update the shape of our custom NewTab button to match MUX's TabView button (#6766) The MUX TabView control has a uniquely-shaped [+] button. TerminalApp doesn't use it: instead, it has a SplitView button that is styled to look like MUX's official button. However, it doesn't get the button's shape right. This PR updates TerminalApp's custom button to look more like MUX's. The difference is that MUX only rounds the top two corners, and it uses a bigger radius. Without matching MUX's radius, the upper-left corner of the button makes an awkward asymmetric divot with the abutting tab. There's also a spot in the lower-left corner that just looks like someone accidentally spilled a few pixels on the floor. Current appearance before this PR: ![oldlight](https://user-images.githubusercontent.com/10259764/86410863-74ca5e80-bc70-11ea-8c15-4ae22998b209.png) New appearance with this PR: ![newlight](https://user-images.githubusercontent.com/10259764/86410871-772cb880-bc70-11ea-972c-13332f1a1bdb.png) Most important deltas highlighted with red circles: ![marklight](https://user-images.githubusercontent.com/10259764/86410877-78f67c00-bc70-11ea-8a6d-696cfbd89b1d.png) Note that this PR does *not* attempt to fix the colors. The colors are also just slightly different from what MUX uses. I'll save that for a separate PR, since all those screenshots would clutter this up this PR. --- src/cascadia/TerminalApp/TabRowControl.xaml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/cascadia/TerminalApp/TabRowControl.xaml b/src/cascadia/TerminalApp/TabRowControl.xaml index eec7f0f209d..9f0bbf24963 100644 --- a/src/cascadia/TerminalApp/TabRowControl.xaml +++ b/src/cascadia/TerminalApp/TabRowControl.xaml @@ -31,6 +31,8 @@ the MIT License. See LICENSE in the project root for license information. --> FontFamily="Segoe MDL2 Assets" FontWeight="SemiLight" FontSize="12" + BorderThickness="0" + CornerRadius="{Binding Source={ThemeResource OverlayCornerRadius}, Converter={StaticResource TopCornerRadiusFilterConverter}}" AutomationProperties.AccessibilityView="Control">