[MGNLUI-6426] Horizontal radiobutton options are misaligned Created: 25/Nov/20  Updated: 13/Nov/23  Resolved: 13/Nov/23

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

Type: Improvement Priority: Neutral
Reporter: Šimon Demočko Assignee: Anja von Gunten
Resolution: Won't Do Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: 0.5h
Original Estimate: Not Specified

Attachments: PNG File image-2020-11-25-13-47-02-178.png     PNG File image-2020-11-25-13-47-33-087.png    
Issue Links:
Relates
relates to MGNLUI-6554 Improve design pattern for horizontal... Closed
Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Date of First Response:
Epic Link: UX improvements

 Description   

Go to the Messages app and observe the alignment of types of messages.

Current situation

Desired situation (needs clarification from avongunten)

  • Align items with the label. UX: should the bottom of the label match the bottom of the options' text? Or should they align by center? The fonts have different sizes.
  • What should happen when the options overflow horizontally? Should the overflowing options wrap to the next line? What spacing between these lines? Or 
  • Items should be aligned with each other.
    • The Valo theme causes this. It has .v-checkbox:last-child  set to  margin-bottom: 5px; 
       and same for first-child, but top. They only care about positioning these on the vertical axis. We need styling for how these should occur horizontally.

 


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