Skip to content

Commit

Permalink
Update the shape of our custom NewTab button to match MUX's TabView b…
Browse files Browse the repository at this point in the history
…utton (#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.
  • Loading branch information
jtippet authored Jul 6, 2020
1 parent 70a7ccc commit d350a89
Showing 1 changed file with 2 additions and 0 deletions.
2 changes: 2 additions & 0 deletions src/cascadia/TerminalApp/TabRowControl.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -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">
<!-- U+E710 is the fancy plus icon. -->
<mux:SplitButton.Resources>
Expand Down

0 comments on commit d350a89

Please sign in to comment.