sourcegit/src/Views/Widgets/PageTabBar.xaml

<UserControl x:Class="SourceGit.Views.Widgets.PageTabBar"
             x:Name="me"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:controls="clr-namespace:SourceGit.Views.Controls"
             mc:Ignorable="d" 
             d:DesignHeight="28" d:DesignWidth="800">
    <Grid Margin="0,4,0,0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        
        <!-- Seperator -->
        <Rectangle
            Grid.Column="0"
            x:Name="startSeperator"
            Width="1" Height="16" Margin="0,2,0,0"
            Fill="{DynamicResource Brush.FG2}"
            Opacity=".5"/>

        <!-- Left Scroller -->
        <controls:IconButton
            Grid.Column="1"
            x:Name="leftScroller"
            Click="ScrollLeft"
            Width="18" Padding="6"
            HoverBackground="{DynamicResource Brush.NewPageHover}"
            BorderThickness="0"
            Icon="{StaticResource Icon.ScrollLeft}"
            WindowChrome.IsHitTestVisibleInChrome="True"
            Visibility="Collapsed"/>

        <!-- Tabs -->
        <ScrollViewer
            Grid.Column="2"
            x:Name="scroller"
            HorizontalScrollBarVisibility="Hidden"
            VerticalScrollBarVisibility="Disabled">
            <StackPanel Orientation="Horizontal" SizeChanged="CalcScrollerVisibilty">
                <ListBox 
                    x:Name="container"
                    BorderBrush="{DynamicResource Brush.Border0}"
                    ItemsSource="{Binding ElementName=me, Path=Tabs}" 
                    WindowChrome.IsHitTestVisibleInChrome="True"
                    SelectionChanged="SelectionChanged">
                    
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel Orientation="Horizontal"/>
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>

                    <ListBox.ItemContainerStyle>
                        <Style TargetType="{x:Type ListBoxItem}">
                            <EventSetter Event="ContextMenuOpening" Handler="OnTabContextMenuOpening" />
                            <Setter Property="AllowDrop" Value="True"/>
                            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                        <Border x:Name="Border" Background="Transparent" BorderBrush="Transparent" BorderThickness="1,1,1,0">
                                            <StackPanel x:Name="Contents" Orientation="Horizontal" VerticalAlignment="Center" Opacity=".5" ToolTip="{Binding Tooltip}">
                                                <controls:Bookmark
                                                    Width="14" Height="14"
                                                    Margin="8,0,0,0"
                                                    IsNewPage="{Binding IsWelcomePage}"
                                                    Color="{Binding Bookmark}"/>

                                                <TextBlock
                                                    Margin="4,0"
                                                    Width="80" MaxWidth="80" TextAlignment="Center"
                                                    Text="{Binding Title}"/>
                                                
                                                <controls:IconButton
                                                    Click="CloseTab"
                                                    Width="16" Height="16"
                                                    Margin="0,0,0,0" Padding="4"
                                                    ToolTip="{DynamicResource Text.Close}"
                                                    Icon="{StaticResource Icon.Close}"
                                                    HoverBackground="{DynamicResource Brush.NewPageHover}"/>

                                                <Rectangle
                                                    x:Name="seperator"
                                                    Margin="4,2,0,0"
                                                    Width="1"
                                                    Fill="Transparent"/>
                                            </StackPanel>
                                        </Border>

                                        <ControlTemplate.Triggers>
                                            <Trigger Property="IsSelected" Value="True">
                                                <Setter TargetName="Border" Property="BorderBrush" Value="{DynamicResource Brush.Border0}"/>
                                                <Setter TargetName="Border" Property="Background" Value="{DynamicResource Brush.Window}"/>
                                                <Setter TargetName="Contents" Property="Opacity" Value="1"/>
                                            </Trigger>
                                            <DataTrigger Binding="{Binding IsSeperatorVisible}" Value="True">
                                                <Setter TargetName="seperator" Property="Fill" Value="{DynamicResource Brush.FG2}"/>
                                            </DataTrigger>
                                            <MultiTrigger>
                                                <MultiTrigger.Conditions>
                                                    <Condition Property="IsSelected" Value="False"/>
                                                    <Condition Property="IsMouseOver" Value="True"/>
                                                </MultiTrigger.Conditions>
                                                <Setter TargetName="Contents" Property="Opacity" Value=".85"/>
                                            </MultiTrigger>
                                        </ControlTemplate.Triggers>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>

                            <EventSetter Event="MouseMove" Handler="OnMouseMove"/>
                            <EventSetter Event="Drop" Handler="OnDrop"/>
                        </Style>
                    </ListBox.ItemContainerStyle>
                </ListBox>
                
                <controls:IconButton
                    Width="16" Height="16" Margin="4,0,0,0" Padding="2"
                    Icon="{StaticResource Icon.NewTab}"
                    HoverBackground="{DynamicResource Brush.NewPageHover}"
                    ToolTip="{DynamicResource Text.PageTabBar.New}"
                    Click="NewTab"
                    WindowChrome.IsHitTestVisibleInChrome="True"/>
            </StackPanel>
        </ScrollViewer>
        
        <!-- Right Scroller -->
        <controls:IconButton
            Grid.Column="3"  
            x:Name="rightScroller"
            Click="ScrollRight"
            Width="18" Padding="6"
            HoverBackground="{DynamicResource Brush.NewPageHover}"
            BorderThickness="0"
            Icon="{StaticResource Icon.ScrollRight}"
            WindowChrome.IsHitTestVisibleInChrome="True"
            Visibility="Collapsed"/>
    </Grid>
</UserControl>