fix buttons layout
MODIFY
WalletWasabi.Fluent/Controls/NavBarItem.axaml
WalletWasabi.Fluent/Controls/NavBarItem.axaml
<Setter Property="Template">
<ControlTemplate>
<!-- The margin here should be compensated with the same amount in the NavBar's topmost content-->
- <Panel Margin="4" ClipToBounds="False">
+ <Panel Margin="4" Height="64" Width="60" ClipToBounds="False">
<Rectangle Name="SelectionIndicator" />
<Border Name="SelectionBackground" />
<ContentPresenter Name="PART_ContentPresenter"

MODIFY
WalletWasabi.Fluent/Views/NavBar/NavBar.axaml
WalletWasabi.Fluent/Views/NavBar/NavBar.axaml
</Style>
</UserControl.Styles>
<DockPanel Margin="0 -4 0 4">
- <StackPanel DockPanel.Dock="Top" Spacing="5" Background="Transparent">
- <c:NavBarListBox Items="{Binding TopItems}"
- SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
- Name="TopListBox"
- Classes="vertical">
- <c:NavBarListBox.ItemTemplate>
- <DataTemplate x:DataType="vm:NavBarItemViewModel" x:CompileBindings="False">
- <Panel>
- <Panel Width="45" Background="Transparent" HorizontalAlignment="Left" ToolTip.Tip="{Binding Title}">
- <PathIcon HorizontalAlignment="Left">
- <PathIcon.Data>
- <Binding Path="IconName" Converter="{x:Static conv:NavBarIconConverter.Instance}" />
- </PathIcon.Data>
- </PathIcon>
- </Panel>
- <TextBlock Text="{Binding Title}" Margin="55 0 0 0" />
- </Panel>
- </DataTemplate>
- </c:NavBarListBox.ItemTemplate>
- </c:NavBarListBox>
- </StackPanel>
- <StackPanel DockPanel.Dock="Bottom" Background="Transparent">
- <Separator />
- <!-- BottomItems List -->
+ <DockPanel Background="Transparent" DockPanel.Dock="Bottom">
<c:NavBarListBox Items="{Binding BottomItems}"
SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
- Classes="horizontal"
- Name="BottomListBox">
-
- <i:Interaction.Behaviors>
- <ia:DataTriggerBehavior Binding="{Binding IsOpen}" ComparisonCondition="Equal" Value="True">
- <iac:AddClassAction StyledElement="{Binding #BottomListBox}" ClassName="horizontal" RemoveIfExists="True" />
- <iac:RemoveClassAction StyledElement="{Binding #BottomListBox}" ClassName="vertical" />
- </ia:DataTriggerBehavior>
- <ia:DataTriggerBehavior Binding="{Binding IsOpen}" ComparisonCondition="Equal" Value="False">
- <iac:AddClassAction StyledElement="{Binding #BottomListBox}" ClassName="vertical" RemoveIfExists="True" />
- <iac:RemoveClassAction StyledElement="{Binding #BottomListBox}" ClassName="horizontal" />
- </ia:DataTriggerBehavior>
- </i:Interaction.Behaviors>
- <c:NavBarListBox.Styles>
- <Style Selector=":is(ListBox).vertical /template/ #PART_ItemsPresenter > ReversibleStackPanel">
- <Setter Property="Orientation" Value="Vertical" />
- <Setter Property="HorizontalAlignment" Value="Left" />
- <Setter Property="ReverseOrder" Value="True" />
- </Style>
- <Style Selector=":is(ListBox).horizontal /template/ #PART_ItemsPresenter > ReversibleStackPanel">
- <Setter Property="Orientation" Value="Horizontal" />
- <Setter Property="HorizontalAlignment" Value="Left" />
- <Setter Property="ReverseOrder" Value="False" />
- </Style>
- <Style Selector=":is(ListBox)">
- <Setter Property="ItemsPanel">
- <Setter.Value>
+ Name="BottomListBox"
+ Classes="vertical narrowItemPadding"
+ RenderTransformOrigin="0%,50%"
+ VerticalAlignment="Stretch">
+ <c:NavBarListBox.ItemsPanel>
<ItemsPanelTemplate>
- <ReversibleStackPanel />
+ <ReversibleStackPanel ReverseOrder="True" />
</ItemsPanelTemplate>
- </Setter.Value>
- </Setter>
- </Style>
- </c:NavBarListBox.Styles>
- <c:NavBarListBox.ItemTemplate>
- <DataTemplate x:DataType="vm:NavBarItemViewModel">
+ </c:NavBarListBox.ItemsPanel>
+ <c:NavBarListBox.DataTemplates>
+ <DataTemplate DataType="vm:NavBarItemViewModel">
<Panel ToolTip.Tip="{Binding Title}" Background="Transparent">
<DockPanel Background="Transparent"
x:CompileBindings="False">
<TextBlock DockPanel.Dock="Bottom" Text="{Binding Title}"
- TextTrimming="CharacterEllipsis" Classes="h9" TextAlignment="Center" />
- <Panel>
- <Image Opacity="0.7" Width="28" Height="28" VerticalAlignment="Center" HorizontalAlignment="Center"
- Source="{Binding IconName, Converter={x:Static conv:NavBarIconConverter.Instance}}" />
+ TextTrimming="CharacterEllipsis" Classes="h9" TextAlignment="Center" Margin="-5 0" />
+ <Panel Background="Red" Width="28" Height="28" VerticalAlignment="Center" HorizontalAlignment="Center">
+ <Image Source="{Binding IconName, Converter={x:Static conv:NavBarIconConverter.Instance}}" />
</Panel>
</DockPanel>
</Panel>
</DataTemplate>
- </c:NavBarListBox.ItemTemplate>
+ </c:NavBarListBox.DataTemplates>
</c:NavBarListBox>
- </StackPanel>
- <!-- Items List -->
+ </DockPanel>
+ <Separator DockPanel.Dock="Bottom" />
+ <!-- Wallet List -->
<DockPanel Background="Transparent">
-
- <TextBlock Classes="headerText" DockPanel.Dock="Top" Text="Wallets" IsVisible="{Binding IsOpen}" />
<c:NavBarListBox Items="{Binding Wallets}"
SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
Name="ItemsListBox"
<DockPanel Background="Transparent"
x:CompileBindings="False">
<TextBlock DockPanel.Dock="Bottom" Text="{Binding Title}"
- TextTrimming="CharacterEllipsis" Classes="h9" TextAlignment="Center" />
- <Panel>
- <!-- Wallet Icon -->
- <Image Opacity="0.7" Width="28" Height="28" VerticalAlignment="Center" HorizontalAlignment="Center"
- Source="{Binding IconName, Converter={x:Static conv:NavBarIconConverter.Instance}}" />
+ TextTrimming="CharacterEllipsis" Classes="h9" TextAlignment="Center" Margin="-5 0" />
+ <Panel Background="Red" Width="28" Height="28" VerticalAlignment="Center" HorizontalAlignment="Center">
+ <Image Source="{Binding IconName, Converter={x:Static conv:NavBarIconConverter.Instance}}" />
</Panel>
</DockPanel>
</Panel>

fix buttons layout