Skip to content

Commit

Permalink
WIP restyle of collection header
Browse files Browse the repository at this point in the history 
can't get the main chunk to stay left!
  • Loading branch information
@insomnious
insomnious committed Sep 26, 2024
1 parent 3f23812 commit 7979125
Show file tree
Hide file tree
Showing 5 changed files with 193 additions and 141 deletions.
110 changes: 61 additions & 49 deletions src/NexusMods.App.UI/Pages/CollectionDownload/CollectionDownloadView.axaml
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<reactiveUi:ReactiveUserControl
x:TypeArguments="collectionDownload:ICollectionDownloadViewModel"
<reactiveUi:ReactiveUserControl
x:TypeArguments="collectionDownload:ICollectionDownloadViewModel"
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
Expand All @@ -13,7 +13,7 @@
<Design.DataContext>
<collectionDownload:CollectionDownloadDesignViewModel />
</Design.DataContext>

<reactiveUi:ReactiveUserControl.Resources>
<MenuFlyout x:Key="CollectionMenuFlyout">
<MenuItem>
Expand Down Expand Up @@ -48,59 +48,72 @@
</reactiveUi:ReactiveUserControl.Resources>

<panels:FlexPanel x:Name="Body">
<panels:FlexPanel x:Name="Frame758">
<panels:FlexPanel x:Name="Frame1452">
<Border x:Name="ContainerBorder">
<panels:FlexPanel x:Name="Container">
<Border x:Name="Image38Border">
<Image x:Name="Image38" />

<Border x:Name="HeaderBorder">
<panels:FlexPanel x:Name="Header">

<Border x:Name="MainContentBorder">
<panels:FlexPanel x:Name="MainContent">

<Border x:Name="CollectionImageBorder">
<Image x:Name="CollectionImage" />
</Border>
<panels:FlexPanel x:Name="ContainerInner">

<panels:FlexPanel x:Name="CollectionDetails">
<TextBlock Classes="TitleSMSemi">COLLECTION DOWNLOAD</TextBlock>
<TextBlock x:Name="Title" Classes="HeadingSMSemi"/>
<panels:FlexPanel x:Name="TagsPanel">
<TextBlock x:Name="Revision" />
<Border x:Name="AuthorAvatarBorder">
<Image x:Name="AuthorAvatar" />
</Border>
</panels:FlexPanel>
<TextBlock x:Name="Title" Classes="HeadingSMSemi" />
<Border x:Name="TagsPanelBorder">
<panels:FlexPanel x:Name="TagsPanel">
<TextBlock x:Name="Revision" />
<Border x:Name="AuthorAvatarBorder">
<Image x:Name="AuthorAvatar" />
</Border>
</panels:FlexPanel>
</Border>
<TextBlock x:Name="AuthorName" />
<TextBlock x:Name="Summary"></TextBlock>
<TextBlock x:Name="Summary" />
</panels:FlexPanel>

</panels:FlexPanel>
</Border>
</panels:FlexPanel>
<panels:FlexPanel x:Name="Frame1449">
<panels:FlexPanel x:Name="Stats" IsVisible="True">
<panels:FlexPanel x:Name="ModsPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.Mods}" />
<TextBlock x:Name="ModCount" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="EndorsementsPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.ThumbUp}" />
<TextBlock x:Name="Endorsements" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="DownloadsPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.Download}" />
<TextBlock x:Name="Downloads" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="TotalSizePanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.Size}" />
<TextBlock x:Name="TotalSize" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="OverallRatingPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.CheckCircle}" />
<TextBlock x:Name="OverallRating" />

<Border x:Name="StatsBorder">
<panels:FlexPanel x:Name="Stats" IsVisible="True">
<panels:FlexPanel x:Name="ModsPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.Mods}" />
<TextBlock x:Name="ModCount" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="EndorsementsPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.ThumbUp}" />
<TextBlock x:Name="Endorsements" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="DownloadsPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.Download}" />
<TextBlock x:Name="Downloads" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="TotalSizePanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.Size}" />
<TextBlock x:Name="TotalSize" />
</panels:FlexPanel>
<panels:FlexPanel x:Name="OverallRatingPanel">
<icons:UnifiedIcon Value="{x:Static icons:IconValues.CheckCircle}" />
<TextBlock x:Name="OverallRating" />
</panels:FlexPanel>
</panels:FlexPanel>
</panels:FlexPanel>
</Border>
</panels:FlexPanel>
</Border>

<Border x:Name="ListHeaderRowBorder">
<panels:FlexPanel x:Name="ListHeaderRow">
<TextBlock x:Name="CollectionStatusText"></TextBlock>
<Button x:Name="InstallButton">Install</Button>
<Button x:Name="DownloadAllButton">DownloadAll</Button>
<Button x:Name="FlyoutMenuButton" Flyout="{StaticResource CollectionMenuFlyout}">...</Button>
</panels:FlexPanel>
</panels:FlexPanel>
<panels:FlexPanel x:Name="ListHeaderRow">
<TextBlock x:Name="CollectionStatusText"></TextBlock>
<Button x:Name="InstallButton">Install</Button>
<Button x:Name="DownloadAllButton">DownloadAll</Button>
<Button x:Name="FlyoutMenuButton" Flyout="{StaticResource CollectionMenuFlyout}">...</Button>
</panels:FlexPanel>
</Border>

<!-- not touching these for now -->
<Expander>
<Expander.Header>
<panels:FlexPanel>
Expand All @@ -122,4 +135,3 @@
</panels:FlexPanel>

</reactiveUi:ReactiveUserControl>

2 changes: 1 addition & 1 deletion src/NexusMods.App.UI/Pages/CollectionDownload/CollectionDownloadView.axaml.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ public CollectionDownloadView()

this.WhenAnyValue(view => view.ViewModel!.TileImage)
.WhereNotNull()
.SubscribeWithErrorLogging(image => Image38.Source = image)
.SubscribeWithErrorLogging(image => CollectionImage.Source = image)
.DisposeWith(d);

this.OneWayBind(ViewModel, vm => vm.Name, view => view.Title.Text)
Expand Down
2 changes: 1 addition & 1 deletion src/Themes/NexusMods.Themes.NexusFluentDark/Styles/StylesIndex.axaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
<StyleInclude Source="/Styles/Controls/FlexPanel/FlexPanelStyles.axaml"/>

<StyleInclude Source="/Styles/UserControls/Banners/InfoBannerStyles.axaml"/>
<StyleInclude Source="/Styles/UserControls/CollectionDownloadPage/CollectionDownloadPage.axaml"/>
<StyleInclude Source="/Styles/UserControls/CollectionDownloadPage/CollectionDownloadPageStyles.axaml"/>
<StyleInclude Source="/Styles/UserControls/CollectionCards/CollectionCardStyles.axaml"/>
<StyleInclude Source="/Styles/UserControls/Diagnostics/DiagnosticEntryStyles.axaml"/>
<StyleInclude Source="/Styles/UserControls/EmptyState/EmptyStateStyles.axaml"/>
Expand Down
90 changes: 0 additions & 90 deletions ...s.NexusFluentDark/Styles/UserControls/CollectionDownloadPage/CollectionDownloadPage.axaml
View file

This file was deleted.

Loading

0 comments on commit 7979125

Please sign in to comment.