mirror of
https://github.com/sourcegit-scm/sourcegit.git
synced 2024-12-24 20:57:19 -08:00
ux: make Welcome page responsive (#821)
This commit is contained in:
leo
parent
f418b72c64
commit
707a227aca
1 changed files with 132 additions and 133 deletions
|
|
@ -9,149 +9,148 @@
|
||||||
x:Class="SourceGit.Views.Welcome"
|
x:Class="SourceGit.Views.Welcome"
|
||||||
x:DataType="vm:Welcome">
|
x:DataType="vm:Welcome">
|
||||||
<Grid RowDefinitions="*,36">
|
<Grid RowDefinitions="*,36">
|
||||||
<Grid Grid.Row="0" Margin="0,8" ColumnDefinitions="*,600,*">
|
<!-- Managed Repositories -->
|
||||||
<Grid Grid.Column="1" RowDefinitions="Auto,*">
|
<Grid Grid.Column="1" MinWidth="600" Margin="8" RowDefinitions="Auto,*" HorizontalAlignment="Center">
|
||||||
<!-- Search Box -->
|
<!-- Search Box -->
|
||||||
<TextBox Grid.Row="0"
|
<TextBox Grid.Row="0"
|
||||||
x:Name="SearchBox"
|
x:Name="SearchBox"
|
||||||
Height="32"
|
Height="32"
|
||||||
Padding="0"
|
Padding="0"
|
||||||
CornerRadius="16"
|
CornerRadius="16"
|
||||||
BorderBrush="{DynamicResource Brush.Border0}"
|
BorderBrush="{DynamicResource Brush.Border0}"
|
||||||
BorderThickness="1"
|
BorderThickness="1"
|
||||||
Background="{DynamicResource Brush.Contents}"
|
Background="{DynamicResource Brush.Contents}"
|
||||||
Watermark="{DynamicResource Text.Welcome.Search}"
|
Watermark="{DynamicResource Text.Welcome.Search}"
|
||||||
VerticalContentAlignment="Center"
|
VerticalContentAlignment="Center"
|
||||||
Text="{Binding SearchFilter, Mode=TwoWay}"
|
Text="{Binding SearchFilter, Mode=TwoWay}"
|
||||||
v:AutoFocusBehaviour.IsEnabled="True">
|
v:AutoFocusBehaviour.IsEnabled="True">
|
||||||
<TextBox.Styles>
|
<TextBox.Styles>
|
||||||
<Style Selector="TextBox:pointerover /template/ Border#PART_BorderElement">
|
<Style Selector="TextBox:pointerover /template/ Border#PART_BorderElement">
|
||||||
<Setter Property="BorderBrush" Value="{DynamicResource Brush.Border0}"/>
|
<Setter Property="BorderBrush" Value="{DynamicResource Brush.Border0}"/>
|
||||||
</Style>
|
</Style>
|
||||||
<Style Selector="TextBox:focus /template/ Border#PART_BorderElement">
|
<Style Selector="TextBox:focus /template/ Border#PART_BorderElement">
|
||||||
<Setter Property="BorderBrush" Value="{DynamicResource Brush.Border0}"/>
|
<Setter Property="BorderBrush" Value="{DynamicResource Brush.Border0}"/>
|
||||||
</Style>
|
</Style>
|
||||||
</TextBox.Styles>
|
</TextBox.Styles>
|
||||||
|
|
||||||
<TextBox.InnerLeftContent>
|
|
||||||
<Path Width="16" Height="16" Margin="6,0,3,0" Data="{StaticResource Icons.Search}" Fill="{DynamicResource Brush.FG2}"/>
|
|
||||||
</TextBox.InnerLeftContent>
|
|
||||||
|
|
||||||
<TextBox.InnerRightContent>
|
<TextBox.InnerLeftContent>
|
||||||
<Button Classes="icon_button" IsVisible="{Binding SearchFilter, Converter={x:Static StringConverters.IsNotNullOrEmpty}}" Command="{Binding ClearSearchFilter}">
|
<Path Width="16" Height="16" Margin="6,0,3,0" Data="{StaticResource Icons.Search}" Fill="{DynamicResource Brush.FG2}"/>
|
||||||
<Path Width="16" Height="16" Margin="0,0,0,0" Data="{StaticResource Icons.Clear}" Fill="{DynamicResource Brush.FG1}"/>
|
</TextBox.InnerLeftContent>
|
||||||
</Button>
|
|
||||||
</TextBox.InnerRightContent>
|
|
||||||
</TextBox>
|
|
||||||
|
|
||||||
<!-- Repository Tree -->
|
<TextBox.InnerRightContent>
|
||||||
<v:RepositoryListBox Grid.Row="1"
|
<Button Classes="icon_button" IsVisible="{Binding SearchFilter, Converter={x:Static StringConverters.IsNotNullOrEmpty}}" Command="{Binding ClearSearchFilter}">
|
||||||
x:Name="TreeContainer"
|
<Path Width="16" Height="16" Margin="0,0,0,0" Data="{StaticResource Icons.Clear}" Fill="{DynamicResource Brush.FG1}"/>
|
||||||
Margin="0,8,8,0"
|
</Button>
|
||||||
Focusable="True"
|
</TextBox.InnerRightContent>
|
||||||
Background="Transparent"
|
</TextBox>
|
||||||
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
|
|
||||||
ScrollViewer.VerticalScrollBarVisibility="Auto"
|
|
||||||
ItemsSource="{Binding Rows}"
|
|
||||||
SelectionMode="Single"
|
|
||||||
Loaded="SetupTreeViewDragAndDrop"
|
|
||||||
LostFocus="OnTreeViewLostFocus"
|
|
||||||
KeyDown="OnTreeViewKeyDown">
|
|
||||||
<ListBox.Styles>
|
|
||||||
<Style Selector="ListBox">
|
|
||||||
<Setter Property="FocusAdorner">
|
|
||||||
<FocusAdornerTemplate>
|
|
||||||
<Border Background="Transparent" BorderThickness="0"/>
|
|
||||||
</FocusAdornerTemplate>
|
|
||||||
</Setter>
|
|
||||||
</Style>
|
|
||||||
|
|
||||||
<Style Selector="ListBoxItem" x:DataType="vm:RepositoryNode">
|
|
||||||
<Setter Property="Margin" Value="0"/>
|
|
||||||
<Setter Property="Padding" Value="0"/>
|
|
||||||
<Setter Property="Height" Value="30"/>
|
|
||||||
<Setter Property="CornerRadius" Value="4"/>
|
|
||||||
<Setter Property="FocusAdorner">
|
|
||||||
<FocusAdornerTemplate>
|
|
||||||
<Border Background="Transparent" BorderThickness="0"/>
|
|
||||||
</FocusAdornerTemplate>
|
|
||||||
</Setter>
|
|
||||||
</Style>
|
|
||||||
</ListBox.Styles>
|
|
||||||
|
|
||||||
<ListBox.ItemsPanel>
|
<!-- Repository Tree -->
|
||||||
<ItemsPanelTemplate>
|
<v:RepositoryListBox Grid.Row="1"
|
||||||
<VirtualizingStackPanel Orientation="Vertical"/>
|
x:Name="TreeContainer"
|
||||||
</ItemsPanelTemplate>
|
Margin="0,8,8,0"
|
||||||
</ListBox.ItemsPanel>
|
Focusable="True"
|
||||||
|
Background="Transparent"
|
||||||
|
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
|
||||||
|
ScrollViewer.VerticalScrollBarVisibility="Auto"
|
||||||
|
ItemsSource="{Binding Rows}"
|
||||||
|
SelectionMode="Single"
|
||||||
|
Loaded="SetupTreeViewDragAndDrop"
|
||||||
|
LostFocus="OnTreeViewLostFocus"
|
||||||
|
KeyDown="OnTreeViewKeyDown">
|
||||||
|
<ListBox.Styles>
|
||||||
|
<Style Selector="ListBox">
|
||||||
|
<Setter Property="FocusAdorner">
|
||||||
|
<FocusAdornerTemplate>
|
||||||
|
<Border Background="Transparent" BorderThickness="0"/>
|
||||||
|
</FocusAdornerTemplate>
|
||||||
|
</Setter>
|
||||||
|
</Style>
|
||||||
|
|
||||||
<ListBox.ContextMenu>
|
<Style Selector="ListBoxItem" x:DataType="vm:RepositoryNode">
|
||||||
<ContextMenu>
|
<Setter Property="Margin" Value="0"/>
|
||||||
<MenuItem Header="{DynamicResource Text.Welcome.AddRootFolder}" Command="{Binding AddRootNode}">
|
<Setter Property="Padding" Value="0"/>
|
||||||
<MenuItem.Icon>
|
<Setter Property="Height" Value="30"/>
|
||||||
<Path Width="12" Height="12" Data="{DynamicResource Icons.Folder.Add}"/>
|
<Setter Property="CornerRadius" Value="4"/>
|
||||||
</MenuItem.Icon>
|
<Setter Property="FocusAdorner">
|
||||||
</MenuItem>
|
<FocusAdornerTemplate>
|
||||||
</ContextMenu>
|
<Border Background="Transparent" BorderThickness="0"/>
|
||||||
</ListBox.ContextMenu>
|
</FocusAdornerTemplate>
|
||||||
|
</Setter>
|
||||||
|
</Style>
|
||||||
|
</ListBox.Styles>
|
||||||
|
|
||||||
<ListBox.ItemTemplate>
|
<ListBox.ItemsPanel>
|
||||||
<DataTemplate DataType="vm:RepositoryNode">
|
<ItemsPanelTemplate>
|
||||||
<Grid Background="Transparent"
|
<VirtualizingStackPanel Orientation="Vertical"/>
|
||||||
Height="30"
|
</ItemsPanelTemplate>
|
||||||
ColumnDefinitions="16,18,Auto,*"
|
</ListBox.ItemsPanel>
|
||||||
Margin="{Binding Depth, Converter={x:Static c:IntConverters.ToTreeMargin}}"
|
|
||||||
Loaded="SetupTreeNodeDragAndDrop"
|
|
||||||
ContextRequested="OnTreeNodeContextRequested"
|
|
||||||
PointerPressed="OnPointerPressedTreeNode"
|
|
||||||
PointerMoved="OnPointerMovedOverTreeNode"
|
|
||||||
PointerReleased="OnPointerReleasedOnTreeNode"
|
|
||||||
DoubleTapped="OnDoubleTappedTreeNode"
|
|
||||||
ClipToBounds="True">
|
|
||||||
<v:RepositoryTreeNodeToggleButton Grid.Column="0"
|
|
||||||
Classes="tree_expander"
|
|
||||||
Focusable="False"
|
|
||||||
HorizontalAlignment="Center"
|
|
||||||
IsChecked="{Binding IsExpanded, Mode=OneWay}"
|
|
||||||
IsVisible="{Binding !IsRepository}"/>
|
|
||||||
|
|
||||||
<Path Grid.Column="1"
|
|
||||||
Width="14" Height="14"
|
|
||||||
Fill="{Binding Bookmark, Converter={x:Static c:IntConverters.ToBookmarkBrush}}"
|
|
||||||
HorizontalAlignment="Center"
|
|
||||||
Data="{StaticResource Icons.Bookmark}"
|
|
||||||
IsVisible="{Binding IsRepository}"/>
|
|
||||||
|
|
||||||
<ToggleButton Grid.Column="1"
|
<ListBox.ContextMenu>
|
||||||
Classes="folder"
|
<ContextMenu>
|
||||||
Focusable="False"
|
<MenuItem Header="{DynamicResource Text.Welcome.AddRootFolder}" Command="{Binding AddRootNode}">
|
||||||
Width="14" Height="14"
|
<MenuItem.Icon>
|
||||||
HorizontalAlignment="Left"
|
<Path Width="12" Height="12" Data="{DynamicResource Icons.Folder.Add}"/>
|
||||||
Foreground="{DynamicResource Brush.FG1}"
|
</MenuItem.Icon>
|
||||||
IsChecked="{Binding IsExpanded}"
|
</MenuItem>
|
||||||
IsVisible="{Binding !IsRepository}"/>
|
</ContextMenu>
|
||||||
|
</ListBox.ContextMenu>
|
||||||
|
|
||||||
<StackPanel Grid.Column="2" Orientation="Horizontal">
|
<ListBox.ItemTemplate>
|
||||||
<TextBlock Classes="primary" VerticalAlignment="Center" Text="{Binding Name}"/>
|
<DataTemplate DataType="vm:RepositoryNode">
|
||||||
<Path Margin="2,0,0,0"
|
<Grid Background="Transparent"
|
||||||
Width="12" Height="12"
|
Height="30"
|
||||||
Data="{StaticResource Icons.Error}"
|
ColumnDefinitions="16,18,Auto,*"
|
||||||
Fill="Orange"
|
Margin="{Binding Depth, Converter={x:Static c:IntConverters.ToTreeMargin}}"
|
||||||
IsVisible="{Binding IsInvalid}"/>
|
Loaded="SetupTreeNodeDragAndDrop"
|
||||||
</StackPanel>
|
ContextRequested="OnTreeNodeContextRequested"
|
||||||
|
PointerPressed="OnPointerPressedTreeNode"
|
||||||
<TextBlock Grid.Column="3"
|
PointerMoved="OnPointerMovedOverTreeNode"
|
||||||
Classes="primary"
|
PointerReleased="OnPointerReleasedOnTreeNode"
|
||||||
Margin="8,0"
|
DoubleTapped="OnDoubleTappedTreeNode"
|
||||||
HorizontalAlignment="Right" VerticalAlignment="Center"
|
ClipToBounds="True">
|
||||||
|
<v:RepositoryTreeNodeToggleButton Grid.Column="0"
|
||||||
|
Classes="tree_expander"
|
||||||
|
Focusable="False"
|
||||||
|
HorizontalAlignment="Center"
|
||||||
|
IsChecked="{Binding IsExpanded, Mode=OneWay}"
|
||||||
|
IsVisible="{Binding !IsRepository}"/>
|
||||||
|
|
||||||
|
<Path Grid.Column="1"
|
||||||
|
Width="14" Height="14"
|
||||||
|
Fill="{Binding Bookmark, Converter={x:Static c:IntConverters.ToBookmarkBrush}}"
|
||||||
|
HorizontalAlignment="Center"
|
||||||
|
Data="{StaticResource Icons.Bookmark}"
|
||||||
|
IsVisible="{Binding IsRepository}"/>
|
||||||
|
|
||||||
|
<ToggleButton Grid.Column="1"
|
||||||
|
Classes="folder"
|
||||||
|
Focusable="False"
|
||||||
|
Width="14" Height="14"
|
||||||
|
HorizontalAlignment="Left"
|
||||||
|
Foreground="{DynamicResource Brush.FG1}"
|
||||||
|
IsChecked="{Binding IsExpanded}"
|
||||||
|
IsVisible="{Binding !IsRepository}"/>
|
||||||
|
|
||||||
|
<StackPanel Grid.Column="2" Orientation="Horizontal">
|
||||||
|
<TextBlock Classes="primary" VerticalAlignment="Center" Text="{Binding Name}"/>
|
||||||
|
<Path Margin="2,0,0,0"
|
||||||
|
Width="12" Height="12"
|
||||||
|
Data="{StaticResource Icons.Error}"
|
||||||
|
Fill="Orange"
|
||||||
|
IsVisible="{Binding IsInvalid}"/>
|
||||||
|
</StackPanel>
|
||||||
|
|
||||||
|
<Border Grid.Column="3" Margin="8,0" VerticalAlignment="Center" ClipToBounds="True">
|
||||||
|
<TextBlock Classes="primary"
|
||||||
|
HorizontalAlignment="Right"
|
||||||
Foreground="{DynamicResource Brush.FG2}"
|
Foreground="{DynamicResource Brush.FG2}"
|
||||||
Text="{Binding Id, Converter={x:Static c:PathConverters.RelativeToHome}}"
|
Text="{Binding Id, Converter={x:Static c:PathConverters.RelativeToHome}}"
|
||||||
IsVisible="{Binding IsRepository}"/>
|
IsVisible="{Binding IsRepository}"/>
|
||||||
</Grid>
|
</Border>
|
||||||
</DataTemplate>
|
</Grid>
|
||||||
</ListBox.ItemTemplate>
|
</DataTemplate>
|
||||||
</v:RepositoryListBox>
|
</ListBox.ItemTemplate>
|
||||||
</Grid>
|
</v:RepositoryListBox>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<!-- Tips -->
|
<!-- Tips -->
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue