Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI styling rework #829

Merged
merged 105 commits into from
Jan 11, 2024
Merged

UI styling rework #829

merged 105 commits into from
Jan 11, 2024

Conversation

Al12rs
Copy link
Contributor

@Al12rs Al12rs commented Jan 10, 2024

Closes #735
Closes #721

This moves all our Styles to a dedicated Theme project, where Style classes are mostly being used.

Changes:

  • Created dedicated Theme project
  • Introduced new 3 layer Color system from Figma
  • Introduced new Opacity layer system
  • Implemented a ColorPalette for Avalonia Fluent Theme that provides good default foreground and background colors
  • Consolidated Typography
    • Fixed a number of issues with Text styles, found cause of alignment issues (Avalonia Bug)
  • Added many scattered icons to IconsStyles
  • Added ADR for Styling approach choices
  • Added Styling guidelines documentation
  • Moved App.axaml from App.UI project to App project, to avoid Circular dependency App.UI -> Theme -> App.UI
  • Added way to define BoxShadows using resources for colors instead of color literals
  • Moved all Styling found in UI files to Theme project
  • Moved all other existing styles to Theme project
  • Reorganized folder structures for Styles in theme project for better organization
  • Fixed and improved a whole bunch of styles (basically all of them). Some completely redone
  • Removed old styles and old resources
@erri120 erri120 self-requested a review January 10, 2024 12:04
@Al12rs Al12rs marked this pull request as ready for review January 10, 2024 12:59
@Al12rs Al12rs self-assigned this Jan 10, 2024
@codecov-commenter
Copy link

codecov-commenter commented Jan 10, 2024

Codecov Report

Attention: 6 lines in your changes are missing coverage. Please review.

Comparison is base (9875f6c) 61.56% compared to head (b59f03d) 60.29%.

❗ Your organization needs to install the Codecov GitHub app to enable full functionality.

Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff             @@
##             main     #829      +/-   ##
==========================================
- Coverage   61.56%   60.29%   -1.28%     
==========================================
  Files         618      594      -24     
  Lines       19092    18130     -962     
  Branches     1396     1372      -24     
==========================================
- Hits        11754    10931     -823     
+ Misses       6992     6877     -115     
+ Partials      346      322      -24     
Flag Coverage Δ
Linux 59.60% <97.18%> (-1.29%) ⬇️
Windows 59.43% <97.18%> (-1.34%) ⬇️
clean_environment_tests 60.27% <97.18%> (-1.28%) ⬇️
network_tests ?
networking_tests ?

Flags with carried forward coverage won't be shown. Click here to find out more.

Files Coverage Δ
...Mods.Games.FOMOD.UI/Resources/Language.Designer.cs 0.00% <ø> (ø)
...s/Download/SpineDownloadButtonDesignerViewModel.cs 47.36% <100.00%> (ø)
...e/Buttons/Download/SpineDownloadButtonViewModel.cs 100.00% <ø> (ø)
.../NexusMods.App.UI/Controls/Spine/SpineViewModel.cs 66.41% <100.00%> (ø)
src/NexusMods.App.UI/ReactiveUIExtensions.cs 58.82% <100.00%> (ø)
src/NexusMods.App.UI/Services.cs 98.40% <100.00%> (-0.02%) ⬇️
src/NexusMods.App/Services.cs 82.89% <100.00%> (+0.22%) ⬆️
src/NexusMods.App/Startup.cs 85.71% <ø> (ø)
....NexusFluentDark/Extensions/BoxShadowExtensions.cs 100.00% <100.00%> (ø)
...I/Window/AdvancedInstallerWindowDesignViewModel.cs 0.00% <0.00%> (ø)
... and 4 more

... and 2 files with indirect coverage changes

@Al12rs
Copy link
Contributor Author

Al12rs commented Jan 10, 2024

Fomod installer styling seems to be broken, I think I missed it. Will add that to the PR.

@Al12rs Al12rs added the status-not-ready This is not yet ready for development. Set by CI do not remove label Jan 10, 2024
@Al12rs Al12rs added status-dont-merge and removed status-not-ready This is not yet ready for development. Set by CI do not remove labels Jan 10, 2024
@erri120
Copy link
Member

erri120 commented Jan 11, 2024

2024-01-11_10-10-40

When opening the app for the first time

@Al12rs
Copy link
Contributor Author

Al12rs commented Jan 11, 2024

Fomod Stuff should be added now

Copy link
Member

@erri120 erri120 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The telemetry overlay needs to be fixed, and we should also look into getting auto-completion working.

@Al12rs Al12rs merged commit 2f65741 into main Jan 11, 2024
5 checks passed
@Al12rs Al12rs deleted the ui-styling-rework branch January 11, 2024 11:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
3 participants