[MGNLUI-4485] Resurface: Add zoom levels for thumbnail view Created: 06/Jul/18  Updated: 20/Sep/18  Resolved: 20/Sep/18

Status: Closed
Project: Magnolia UI
Component/s: None
Affects Version/s: None
Fix Version/s: 6.0

Type: Task Priority: Neutral
Reporter: Maxime Michel Assignee: Unassigned
Resolution: Obsolete Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Attachments: PNG File desktop_max.png     PNG File desktop_med.png     PNG File desktop_min.png     PNG File mobile_max.png     PNG File mobile_med.png     PNG File mobile_min.png    
Issue Links:
Cloners
is cloned by MGNLUI-4646 Resurface: Responsive thumbnails in t... Closed
relation
is related to MGNLUI-4464 Adapt thumbnail layout implementation... Closed
is related to MGNLUI-4646 Resurface: Responsive thumbnails in t... Closed
Template:
Acceptance criteria:
Empty
Task DoR:
Empty
Epic Link: Resurface theme
Story Points: 8

 Description   

 As a user i want the thumbnails UI to behave nicely & look good on different zoom levels so browsing in thumbs view becomes a joy.

 

Note:

MGNLUI-4464 had us think about how to best dimension thumbnails.

The slider always generates unused space to the right side and doesn't display caption text nicely, so instead of the slider we provide 3 zoom levels.

With this move responsiveness also becomes a child's play.

Acceptance criteria:

  • Replace slider with 3 zoom level buttons as in mock here (will be added shortly)
  • Implement 3 zoom levels with certain amount of thumbs per row:
    • 12 thumbnails per row (no caption)
      • 12 * 86 + 12 = 1044
    • 8 thumbnails per row (with caption, sfont size 12px)
      • 8 * 129.5 + 8 = 1044
    • 4 thumbnails per row (caption, font size 15px)
      • 4 * 260 + 4 = 1044
  • Make sure image and caption display nicely for all 3 levels

 


Generated at Mon Feb 12 09:17:04 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.