ux: style of tab switch in file histories view

build/README.md

@@ -0,0 +1,15 @@
+# build
+
+> [!WARNING]
+> The files under the `build` folder is used for `Github Action` only, **NOT** for end users.
+
+## How to build this project manually
+
+1. Make sure [.NET SDK 8](https://dotnet.microsoft.com/en-us/download) is installed on your machine.
+2. Clone this project
+3. Run the follow command under the project root dir
+```sh
+dotnet publish -c Release -r $RUNTIME_IDENTIFIER -o $DESTINATION_FOLDER src/SourceGit.csproj
+```
+> [!NOTE]
+> Please replace the `$RUNTIME_IDENTIFIER` with one of `win-x64`,`win-arm64`,`linux-x64`,`linux-arm64`,`osx-x64`,`osx-arm64`, and replece the `$DESTINATION_FOLDER` with the real path that will store the output executable files.

src/Resources/Styles.axaml

@@ -962,12 +962,13 @@
     </Style>
   </Style>
 
-  <Style Selector="RadioButton.icon_button">
+  <Style Selector="RadioButton.switch_button">
+    <Setter Property="Height" Value="24"/>
     <Setter Property="BorderThickness" Value="0"/>
     <Setter Property="Background" Value="Transparent"/>
     <Setter Property="Template">
       <ControlTemplate>
-        <Border Background="Transparent">
+        <Border CornerRadius="12" Background="{TemplateBinding Background}">
           <ContentPresenter x:Name="PART_ContentPresenter"
                             Margin="0"
                             HorizontalAlignment="Center"
@@ -980,9 +981,17 @@
       </ControlTemplate>
     </Setter>
 
+    <Style Selector="^:checked">
+      <Setter Property="Background" Value="{DynamicResource Brush.Accent}"/>
+    </Style>
     <Style Selector="^:checked Path">
-      <Setter Property="Fill" Value="{DynamicResource Brush.Accent}"/>
-      <Setter Property="Opacity" Value="0.65"/>
+      <Setter Property="Fill" Value="White"/>
+    </Style>
+    <Style Selector="^ TextBlock">
+      <Setter Property="Foreground" Value="{DynamicResource Brush.FG2}"/>
+    </Style>
+    <Style Selector="^:checked TextBlock">
+      <Setter Property="Foreground" Value="White"/>
     </Style>
   </Style>
 

src/ViewModels/FileHistories.cs

@@ -41,12 +41,12 @@ namespace SourceGit.ViewModels
             }
         }
 
-        public int ViewMode
+        public bool IsViewContent
         {
-            get => _viewMode;
+            get => _isViewContent;
             set
             {
-                if (SetProperty(ref _viewMode, value))
+                if (SetProperty(ref _isViewContent, value))
                     RefreshViewContent();
             }
         }
@@ -93,10 +93,10 @@ namespace SourceGit.ViewModels
                 return;
             }
 
-            if (_viewMode == 0)
-                SetViewContentAsDiff();
-            else
+            if (_isViewContent)
                 SetViewContentAsRevisionFile();
+            else
+                SetViewContentAsDiff();
         }
 
         private void SetViewContentAsRevisionFile()
@@ -197,7 +197,7 @@ namespace SourceGit.ViewModels
         private bool _isLoading = true;
         private List<Models.Commit> _commits = null;
         private Models.Commit _selectedCommit = null;
-        private int _viewMode = 0;
+        private bool _isViewContent = false;
         private object _viewContent = null;
     }
 }

src/Views/FileHistories.axaml

@@ -115,75 +115,19 @@
                      IsVisible="{Binding IsLoading}"/>
 
       <Grid Grid.Column="2" RowDefinitions="Auto,*,Auto" IsVisible="{Binding !IsLoading}">
-        <ListBox Grid.Row="0"
-                 Margin="0,8"
-                 SelectedIndex="{Binding ViewMode, Mode=TwoWay}"
-                 HorizontalAlignment="Center"
-                 VerticalAlignment="Center"
-                 Background="Transparent"
-                 BorderThickness="1"
-                 BorderBrush="{DynamicResource Brush.Border2}"
-                 CornerRadius="14"
-                 Padding="3,0">
-          <ListBox.ItemsPanel>
-            <ItemsPanelTemplate>
-              <StackPanel Orientation="Horizontal"/>
-            </ItemsPanelTemplate>
-          </ListBox.ItemsPanel>
+        <StackPanel Grid.Row="0" Margin="0,8" Height="28" HorizontalAlignment="Center" Orientation="Horizontal">
+          <RadioButton Classes="switch_button"
+                       GroupName="SearchGroup"
+                       IsChecked="{Binding !IsViewContent, Mode=OneWay}">
+            <TextBlock Margin="16,0" Text="{DynamicResource Text.FileHistory.FileChange}" FontWeight="Bold"/>
+          </RadioButton>
 
-          <ListBox.Styles>
-            <Style Selector="ListBoxItem">
-              <Setter Property="Height" Value="28"/>
-              <Setter Property="Padding" Value="0"/>
-              <Setter Property="Background" Value="Transparent"/>
-            </Style>
-
-            <Style Selector="ListBoxItem:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-              <Setter Property="Background" Value="Transparent"/>
-            </Style>
-
-            <Style Selector="ListBoxItem:selected /template/ ContentPresenter#PART_ContentPresenter">
-              <Setter Property="Background" Value="Transparent"/>
-            </Style>
-
-            <Style Selector="ListBoxItem Border.switcher_bg">
-              <Setter Property="Height" Value="22"/>
-              <Setter Property="CornerRadius" Value="11"/>
-              <Setter Property="Background" Value="Transparent"/>
-              <Setter Property="VerticalAlignment" Value="Center"/>
-              <Setter Property="Padding" Value="16,0"/>
-            </Style>
-
-            <Style Selector="ListBoxItem:selected Border.switcher_bg">
-              <Setter Property="Background" Value="{DynamicResource Brush.Accent}"/>
-            </Style>
-
-            <Style Selector="TextBlock.view_mode_switcher">
-              <Setter Property="FontWeight" Value="Bold"/>
-              <Setter Property="Foreground" Value="{DynamicResource Brush.FG2}"/>
-            </Style>
-
-            <Style Selector="ListBoxItem:pointerover TextBlock.view_mode_switcher">
-              <Setter Property="Foreground" Value="{DynamicResource Brush.FG1}"/>
-            </Style>
-
-            <Style Selector="ListBoxItem:selected TextBlock.view_mode_switcher">
-              <Setter Property="Foreground" Value="White"/>
-            </Style>
-          </ListBox.Styles>
-
-          <ListBoxItem>
-            <Border Classes="switcher_bg">
-              <TextBlock Classes="view_mode_switcher" Text="{DynamicResource Text.FileHistory.FileChange}"/>
-            </Border>
-          </ListBoxItem>
-
-          <ListBoxItem>
-            <Border Classes="switcher_bg">
-              <TextBlock Classes="view_mode_switcher" Text="{DynamicResource Text.FileHistory.FileContent}"/>
-            </Border>
-          </ListBoxItem>
-        </ListBox>
+          <RadioButton Classes="switch_button"
+                       GroupName="SearchGroup"
+                       IsChecked="{Binding IsViewContent, Mode=TwoWay}">
+            <TextBlock Margin="16,0" Text="{DynamicResource Text.FileHistory.FileContent}" FontWeight="Bold"/>
+          </RadioButton>
+        </StackPanel>
         
         <ContentControl Grid.Row="1" Margin="4,4,8,8" Content="{Binding ViewContent}">
           <ContentControl.DataTemplates>

src/Views/Repository.axaml

@@ -19,31 +19,22 @@
     <!-- Left Panel -->
     <Grid Grid.Column="0" RowDefinitions="Auto,*">
       <!-- Page Switcher for Left Contents (Dashboard or CommitSearch) -->
-      <Grid Grid.Row="0" Height="24" Margin="0,6" HorizontalAlignment="Center" ColumnDefinitions="48,1,48">
-        <Border Grid.Column="0" Grid.ColumnSpan="3"
-                Height="24"
-                BorderThickness="1" BorderBrush="{DynamicResource Brush.Border2}"
-                CornerRadius="12"/>
-
-        <RadioButton Grid.Column="0"
-                     Classes="icon_button"
+      <StackPanel Grid.Row="0" Margin="0,6" Height="24" HorizontalAlignment="Center" Orientation="Horizontal">
+        <RadioButton Classes="switch_button"
                      Width="48"
                      GroupName="SearchGroup"
                      IsChecked="{Binding !IsSearching, Mode=OneWay}">
-          <Path Width="14" Height="14" Stretch="Fill" HorizontalAlignment="Center" Data="{StaticResource Icons.Home}"/>
+          <Path Width="12" Height="12" Stretch="Fill" HorizontalAlignment="Center" Data="{StaticResource Icons.Home}"/>
         </RadioButton>
 
-        <Rectangle Grid.Column="1" Width="0.65" HorizontalAlignment="Center" VerticalAlignment="Stretch" Fill="{DynamicResource Brush.Border2}"/>
-
-        <RadioButton Grid.Column="2"
+        <RadioButton Classes="switch_button"
                      Width="48"
-                     Classes="icon_button"
                      GroupName="SearchGroup"
                      IsChecked="{Binding IsSearching, Mode=TwoWay}">
-          <Path Width="14" Height="14" Stretch="Fill" HorizontalAlignment="Center" Data="{StaticResource Icons.Search}"/>
+          <Path Width="12" Height="12" Stretch="Fill" HorizontalAlignment="Center" Data="{StaticResource Icons.Search}"/>
         </RadioButton>
-      </Grid>
-      
+      </StackPanel>
+
       <!-- Dashboard -->
       <Grid Grid.Row="1" Margin="0,0,0,8" RowDefinitions="Auto,Auto,*" IsVisible="{Binding !IsSearching}">
         <!-- Page Switcher for Right Panel -->
@@ -138,6 +129,12 @@
                  Watermark="{DynamicResource Text.Repository.Filter}"
                  Text="{Binding Filter, Mode=TwoWay}"
                  VerticalContentAlignment="Center">
+          <TextBox.Styles>
+            <Style Selector="TextBox /template/ TextBlock#PART_Watermark">
+              <Setter Property="FontSize" Value="12"/>
+            </Style>
+          </TextBox.Styles>
+          
           <TextBox.InnerLeftContent>
             <Path Width="14" Height="14"
                   Margin="6,0,0,0"
@@ -343,9 +340,9 @@
       </Grid>
 
       <!-- Commit Search Panel -->
-      <Grid Grid.Row="1" RowDefinitions="26,26,*" Margin="8,0,4,8" IsVisible="{Binding IsSearching}" PropertyChanged="OnSearchCommitPanelPropertyChanged">
+      <Grid Grid.Row="1" RowDefinitions="Auto,26,*" Margin="8,0,4,8" IsVisible="{Binding IsSearching}" PropertyChanged="OnSearchCommitPanelPropertyChanged">
         <!-- Search Input Box -->
-        <Grid Grid.Row="0">
+        <Grid Grid.Row="0" Height="26" Margin="0,4,0,0">
           <TextBox x:Name="TxtSearchCommitsBox"
                    Height="24"
                    BorderThickness="1"
@@ -446,10 +443,10 @@
 
           <CheckBox Height="24"
                     Margin="4,0,0,0"
-                    FontSize="12"
-                    Content="{DynamicResource Text.Repository.Search.InCurrentBranch}"
                     IsChecked="{Binding OnlySearchCommitsInCurrentBranch, Mode=TwoWay}"
-                    IsVisible="{Binding SearchCommitFilterType, Converter={x:Static c:IntConverters.IsGreaterThanZero}}"/>
+                    IsVisible="{Binding SearchCommitFilterType, Converter={x:Static c:IntConverters.IsGreaterThanZero}}">
+            <TextBlock Text="{DynamicResource Text.Repository.Search.InCurrentBranch}" FontSize="12"/>
+          </CheckBox>
         </StackPanel>
 
         <ListBox Grid.Row="2"