DIM icon indicating copy to clipboard operation
DIM copied to clipboard

Tooltip redesign round two

Open vivekhnz opened this issue 2 years ago • 1 comments

This PR addresses some tooltip design follow up from #8602 and #8626:

  1. Increased padding within tooltip sections.
  2. Increased tooltip arrow size from 10px to 16px (minimal tooltip arrow size is unchanged).
  3. Increased strength of tooltip drop shadow.
  4. The upper border of colored tooltip sections now matches the tooltip background to stand out less.
  5. Rounded the corners of the tooltip.
  6. Minimal tooltips no longer have a border and use a lighter background color.

dim-tooltip-redesign-v2

Some things I like about this variant:

  • Increased padding makes the content feel less cramped.
  • Removing the interior borders makes the tooltip look like a single surface instead of several stacked boxes.
  • The stronger drop shadow gives the tooltip more depth and add more contrast.
  • The rounded corners are a departure from DIM's usual sharp corners, but I think this is a benefit. Because they contrast against the right angles, I find it easier to understand the tooltip's bounds, which pulls my eyes to the tooltip content. I think this is also helped by the slight curvature at the tooltip's upper corners caused by the border width changing.

I'm still not totally happy with the tooltips, but I think this is a step in the right direction. Keen to hear others' thoughts and I'm happy to keep iterating on this.

vivekhnz avatar Aug 14 '22 11:08 vivekhnz

The padding is nice. I like elbow room. The tooltip is very obvious in the screenshot. This change is good.

I'm indifferent about the rounded corners. It wasn't an issue, and the change didn't seem to make a difference to me. I am fine going ahead with making the change unless there is a design system or prior choice here.

SunburnedGoose avatar Aug 14 '22 21:08 SunburnedGoose

I've cleaned up the upper corners of the tooltip where the border colour changes:

dim-tooltip-corner-slant-fix

vivekhnz avatar Aug 16 '22 11:08 vivekhnz

Merging this to get some eyes on it before the new season launches, happy to iterate on it further though.

vivekhnz avatar Aug 19 '22 06:08 vivekhnz