Skip to content

Commit

Permalink
re-enabled background image and design tweaks
Browse files Browse the repository at this point in the history 
dark linear gradient been added
text tweaks from @captainsandypants
  • Loading branch information
@insomnious
insomnious committed Sep 30, 2024
1 parent b9f995d commit c88984f
Show file tree
Hide file tree
Showing 3 changed files with 68 additions and 43 deletions.
62 changes: 31 additions & 31 deletions src/NexusMods.App.UI/Pages/CollectionDownload/CollectionDownloadView.axaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,10 +49,9 @@

<panels:FlexPanel x:Name="Body">

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


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

<Border x:Name="MainContentBorder">
<panels:FlexPanel x:Name="MainContent">
Expand All @@ -62,49 +61,49 @@
</Border>

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

</panels:FlexPanel>
</Border>

<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" />
<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>
</panels:FlexPanel>
</Border>

<Border x:Name="ListHeaderRowBorder">
<panels:FlexPanel x:Name="ListHeaderRow">
Expand All @@ -115,6 +114,7 @@
</panels:FlexPanel>
</Border>


<!-- not touching these for now -->
<Expander>
<Expander.Header>
Expand Down
6 changes: 2 additions & 4 deletions src/NexusMods.App.UI/Pages/CollectionDownload/CollectionDownloadView.axaml.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,19 +15,17 @@ public CollectionDownloadView()
{

// Uncomment this to enable the background image
/*
this.WhenAnyValue(view => view.ViewModel!.BackgroundImage)
.WhereNotNull()
.SubscribeWithErrorLogging(image => Body.Background = new ImageBrush { Source = image })
.SubscribeWithErrorLogging(image => Body.Background = new ImageBrush { Source = image, Stretch = Stretch.UniformToFill})
.DisposeWith(d);
*/

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

this.OneWayBind(ViewModel, vm => vm.Name, view => view.Title.Text)
this.OneWayBind(ViewModel, vm => vm.Name, view => view.Heading.Text)
.DisposeWith(d);

this.OneWayBind(ViewModel, vm => vm.AuthorName, view => view.AuthorName.Text)
Expand Down
43 changes: 35 additions & 8 deletions ...sFluentDark/Styles/UserControls/CollectionDownloadPage/CollectionDownloadPageStyles.axaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,18 +13,26 @@
</Design.PreviewWith>

<Style Selector="collections|CollectionDownloadView">

<Style.Resources>
<LinearGradientBrush x:Key="HeaderImageLinearGradientBrush" StartPoint="0%,0%" EndPoint="0%,100%">
<GradientStop Offset="0" Color="#BF0F0F10" />
<GradientStop Offset="1" Color="#F20F0F10" />
</LinearGradientBrush>
</Style.Resources>

<Style Selector="^ panels|FlexPanel#Body">
<!-- <Setter Property="Background" Value="#101020" /> -->
<Setter Property="Direction" Value="Column" />
<Setter Property="AlignItems" Value="FlexStart" />




<Style Selector="^ Border#HeaderBorder">
<Setter Property="panels:Flex.AlignSelf" Value="Stretch" />
<!-- <Setter Property="Background" Value="DarkGreen" /> -->
<Setter Property="Background" Value="{StaticResource HeaderImageLinearGradientBrush}" />
<Setter Property="Padding" Value="24,24,24,16" />
<Setter Property="panels:Flex.AlignSelf" Value="Stretch" />

<Style Selector="^ panels|FlexPanel#Header">
<!-- <Setter Property="Background" Value="#252535" /> -->
<Setter Property="Direction" Value="Column" />
<Setter Property="AlignItems" Value="Stretch" />
<Setter Property="JustifyContent" Value="FlexStart" />
Expand Down Expand Up @@ -70,12 +78,31 @@
<Setter Property="panels:Flex.Basis" Value="0" />

<Style Selector="^ Border#TagsPanelBorder">
<Setter Property="Padding" Value="0,5" />
<Setter Property="BorderThickness" Value="0, 1, 0, 1" />
<Setter Property="BorderBrush"
Value="{StaticResource StrokeTranslucentWeakBrush}" />

<Style Selector="^ TextBlock#AuthorName">
<Setter Property="Foreground" Value="{StaticResource NeutralTranslucentModerateBrush}" />
</Style>
</Style>

<Style Selector="^ TextBlock#Title">
<Setter Property="Theme" Value="{StaticResource TitleSMSemiTheme}" />
<Setter Property="Foreground" Value="{StaticResource NeutralTranslucentModerateBrush}" />
</Style>

<Style Selector="^ TextBlock#Heading">
<Setter Property="Padding" Value="0,0,0,8" />
<Setter Property="Theme" Value="{StaticResource HeadingSMSemiTheme}" />
<Setter Property="Foreground" Value="{StaticResource NeutralTranslucentStrongBrush}" />
<Setter Property="TextWrapping" Value="NoWrap" />
<Setter Property="TextTrimming" Value="CharacterEllipsis" />
</Style>

<Style Selector="^ TextBlock#Summary">
<Setter Property="Foreground" Value="{StaticResource NeutralTranslucentSubduedBrush}" />
<Setter Property="TextWrapping" Value="Wrap" />
<Setter Property="TextTrimming" Value="CharacterEllipsis" />
</Style>
Expand All @@ -85,7 +112,7 @@
</Style>

<Style Selector="^ Border#StatsBorder">
<Setter Property="Padding" Value="0, 8" />
<Setter Property="Padding" Value="0, 12,0,8" />
<Setter Property="BorderThickness" Value="0, 1, 0, 0" />
<Setter Property="BorderBrush" Value="{StaticResource StrokeTranslucentWeakBrush}" />
<Setter Property="panels:Flex.AlignSelf" Value="Stretch" />
Expand All @@ -100,13 +127,13 @@
</Style>

<Style Selector="^ icons|UnifiedIcon">
<Setter Property="Foreground" Value="{StaticResource NeutralSubduedBrush}" />
<Setter Property="Foreground" Value="{StaticResource NeutralTranslucentSubduedBrush}" />
<Setter Property="Width" Value="20" />
<Setter Property="Height" Value="20" />
</Style>

<Style Selector="^ TextBlock">
<Setter Property="Foreground" Value="{StaticResource NeutralModerateBrush}" />
<Setter Property="Foreground" Value="{StaticResource NeutralTranslucentModerateBrush}" />
<Setter Property="Theme" Value="{StaticResource BodyMDNormalTheme}" />
</Style>

Expand Down

0 comments on commit c88984f

Please sign in to comment.