Icons in selection view have two blue borders

[iseulde]

From the Insert Media modal, when you select media that only have icons for a preview (such as PDFs), the icon in the selection list at the bottom of the modal has a double border.

See screenshots.

[iseulde]

4.1

[iseulde]

4.2 beta

[DrewAPicture]

Confirmed, and this also seems to be a regression from 4.1:

.

[tyxla]

Removing double border and fixing icon centering in selection section of media modal

[tyxla]

Confirmed here too - I was able to replicate that on all browsers I've tested on.
Attached a patch that addresses the 2 issues:

• Double border for non-image selection icons;
• Vertical centering of the non-image selection icons within their bounding box.

[iseulde]

The focus style in 4.1 is also weird.

[DrewAPicture]

My badness, this goes all the way back to 4.0 as aptly pointed out by @iseulde. Let's look at this in 4.3 instead.

[tyxla]

Just to mention that the patch I've submitted above resolves the focus style issue as well.

[DrewAPicture]

And we're back in the game!

[iseulde]

@tyxla Does .2 work for you?

[tyxla]

Hey @iseulde,

Patch .2 not quite working for me - there's still a double border, and a weird box shadow.

Patch .3 does work for me, but it makes too many changes IMHO, and adds a constant double border as well, which I'd personally avoid. Also, previously the blue border of the selected state was outside of the item's border, making the selected item more easy to notice. With your patch, the selected blue border is using the item border, which looks fine, but it would probably need UI feedback, as it changes the current appearance a bit. I personally like the previous one more, with the border being outside - my patch compliments that previous appearance.

I still think my patch is doing the job while doing as little changes as needed.

[iseulde]

trunk

[iseulde]

trunk

[iseulde]

.3

[iseulde]

.3

[iseulde]

Also, previously the blue border of the selected state was outside of the item's border, making the selected item more easy to notice. With your patch, the selected blue border is using the item border, which looks fine, but it would probably need UI feedback, as it changes the current appearance a bit.

It uses box shadow and moves it from inside the box to outside the box.

and adds a constant double border as well

It does not add it, it just moves it outside, like the attachments in the browser. It may be better without it. I will look at the original design.

[iseulde]

.4 is .3 and removes the grey border (as it is in 3.5).

[tyxla]

31898.4.patch looks good to me.

[iseulde]

.4

[iseulde]

.4

[iseulde]

.4

[helen]

In 32072:

Media: Fix focus and selected state for the selected attachments set.

props iseulde.
fixes #31898.

[helen]

Missed the initial patch from tyxla in props - sorry about that.