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

Restyle focus state in grid to be more subtle

XMLWordPrintable

    • Icon: Improvement Improvement
    • Resolution: Fixed
    • Icon: Neutral Neutral
    • 6.2.3
    • None
    • None
    • None

      Users don't seem to understand the black focus border around the first item in grid.

      We want to keep its functionality, which is different to how it was in M5: focus and select are two separate states.

      However the black border is too strong, irritates users so we concluded that it needs to be visually more subtle.

      Acceptance criteria 

      extracted from comments

      We'll go with: 

      • 3px vertical border from left side with 0 radius, black color. This follows a common pattern seen in gmail or even here in jira, you can use p/n to navigate comments and you get a blue bar on the left. 2px would be a bit hard to see due to the fact that it is touching the edge of the window and possibly a black monitor frame.
      • In the future, we'll likely introduce a similar vertical stripe of probably white color to a focused action in action bar.
      • Buttons and form fields would keep a black outline.

        Acceptance criteria

              sdemocko Šimon Demočko
              avongunten Anja von Gunten
              Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

                Created:
                Updated:
                Resolved:

                  Task DoD

                    Estimated:
                    Original Estimate - Not Specified
                    Not Specified
                    Remaining:
                    Remaining Estimate - Not Specified
                    Not Specified
                    Logged:
                    Time Spent - 1.9h
                    1.9h