Uploaded image for project: 'Magnolia UI'
  1. Magnolia UI
  2. MGNLUI-8538

Styling of tooltips

    XMLWordPrintable

Details

    • Task
    • Resolution: Done
    • Low
    • 6.3.0
    • None
    • None

    Description

      We need some styling refinements of the tooltips, following their implementation with MGNLUI-8481

      Action bar hovering behaviour:

      • Button turns lighter (dark-grey-hover)
      • And if action bar is collapsed tooltip shows up

      ACs

      • The tooltip margins, font size and positioning need adjusting (please follow design details below)

       

      Action bar tooltip

      — Rectangle style —
      Light-grey colour
      4px rounded corners

      — Text style (Label) —
      Roboto regular
      12pt size
      16pt line height
      -0.3px letter spacing

      — Text padding —
      8px horizontal padding
      4px vertical padding

      — Positioning (tooltip in relation to focus area) —
      For the action bar buttons use RHS tooltip
      Centred vertically
      8px horizontal padding (shape overlay)

       

      Design note: The only thing that changes in the tooltip is the positioning, and this will vary depending on the area in focus, but always following the same logic of shape overlay and alignment with 8px increment.

      Checklists

        Acceptance criteria

        Attachments

          Issue Links

            Activity

              People

                lam.nguyen Lam Nguyen Bao
                ldelnevo Laura Delnevo
                Votes:
                0 Vote for this issue
                Watchers:
                1 Start watching this issue

                Dates

                  Created:
                  Updated:
                  Resolved:
                  Work Started:

                  Checklists

                    Task DoR

                    Time Tracking

                      Estimated:
                      Original Estimate - Not Specified
                      Not Specified
                      Remaining:
                      Remaining Estimate - Not Specified
                      Not Specified
                      Logged:
                      Time Spent - 1d 2.5h
                      1d 2.5h