Skip to content

Overhaul app cards

Nate Graham requested to merge ngraham/discover:overhaul-app-delegates into master

This commit tweaks the layout of app cards shown in browse and search views to make them more visually parse-able.

  • Make the app name bigger and use demi-bold font. There just isn't another way to make it stand out enough.
  • Move the description/caption so that it's right under the app name, so the two are visually close and therefore associated in the user's mind.
  • Move the category label to the bottom of the card, under the rating and align the two in their own little group that is separated from the app name + description group with whitespace. This reinforces that they are separate metadata.
  • Move the backend name out of the Install button and instead display it as small, de-emphasized text in the corner. It's important that we still show this information to help disambiguate apps that appear multiple times but from different backends, due to mismatching appstream IDs between the instances causing Discover to be unable to de-duplicate them. However we don't need to shove this information in the user's face by sticking it in the Install button. So now it is demoted to a corner.
  • Don't show the install button in compact/mobile view. There just isn't enough space on the cards without the layout looking really visually busy.
Desktop Mobile
Featured_page Mobile_view_home_page
App_list Mobile_view_apps_list
GHNS Mobile_view_GHNS_page
Installed Mobile_view_installed_page

cc @teams/vdg

Edited by Nate Graham

Merge request reports