Dashboard icons are misaligned

Dear all,

In OOD 3.1.1, application icons displayed on the dashboard are not centered.

Only the Desktop icon (icon: fa://desktop) is aligned to the center, but the other icons (png files) are aligned to the left. Note that the height and width of png files are the same.

When checking in developer mode of my web browser, it seems that the cause is that the margin is set with .app-icon:not(.fa-fw).

I think centering it looks better, but how can I fix it?


Thanks for pointing this out.

Looking at this more it looks to center correctly when the screen is below a threshold but switches to a left alignment like you are saying when beyond that threshold.

The bug looks to be related to the use of text-center which should have centered those images but obviously is not working passed the first box.

Using an mx-auto on the img tag does fix this. The view which is handling this is here I believe:

I’ve opened an issue for this here:

I’ve currently put in a simple fix for this here:

This looks to keep those images centered regardless of the screen size and number of apps present.