Skip to content

Standardise heights of search result cards #195

Description

@koderjoker

Description
Subtask of #38: To decide on an equivalent height for all search result cards.

Sample: All cards side by side

Best case

Worst case

Sample: Cards on user favourites page

image

Details for the current version of cards

Media cards:
Media card 1 Media card 2
Media card 1 Not found image

  • Card area is restricted to 295x180px
  • Number of lines for title limited to 2
  • Number of lines for author limited to 2
  • Area available for image restricted to 160x180px
  • Background for image area is set to black
  • Image aspect ratio for all images is now preserved
  • Replacing our traditional 'image not found' images with that media card's iconochive has been experimented with
  • Height of area allotted to media stats is now 40px
  • Vertical space has been reduced

Collection cards:
Collection card 1 Collection card 2

  • Card area is restricted to 295x180px
  • Adding the collection card's iconochive as an 'Image not found' image has been experimented with
  • Image is now a rounded square of 150x150px to reduce whitespace
  • Number of lines for title limited to 3
  • Height of area allotted to collection stats is now 40px
  • Vertical space has been reduced

Account cards:
Account card 1 Account card 2

  • Card area is restricted to 295x180px
  • User image is now a rounded square of 150x150px to reduce whitespace
  • Number of lines for user name restricted to 2
  • Height of area allotted to media stats is now 40px
  • Vertical space has been reduced

Search results cards:
Saved search result card 2 Saved search result card 1

  • Card area is restricted to 295x180px
  • Area available for image restricted to 160x180px
  • Number of lines for search result title restricted to 2
  • Height of area allotted to search result stats is now 40px

Stakeholders
@pezvi @bfalling @iisa

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions