misalignment for gatling sentry symbols in stratagem list view when fully zoomed out on chrome

[Cmonster820]

I used the reverse pinch gesture thing on the trackpad to get it zoomed in like this

[Cmonster820]

looking at it, it also seems to happen with reinforce, hellbomb, seismic probe, rocket sentry, anti-personnel minefield, guard dog rover, ballistic shield, probably more but they're not in the image

[Cmonster820]

what happened to the orbital illumination flare?

[odil-io]

They aren't misaliged. I looks like it because of the padding inside the title element .stratagem-sumary.
Zoom doesn't effect this. Tested on an Android phone with FireFox and on an iPhone with Safari.
What you're seeing is the spacing inside the font itself. All items have this. Some icon show it more then other because of what's in the icon.

For example, compare the EMS Mortar Sentry with the Seismic Probe. The E from EMS makes it look like it's aligned. While Seismic looks like it's to far down.

This image explains it better:

See the empty space above the text? That's the font doing that. The text-box and the icon align to each other on the middle axis, or center.

This can be fixed with line-height, padding and maybe a negative margin. But I rather use the gap property of flexbox.

[byjokese]

I'm trying to rework that hole area. (didn't have much time yet), wanted to keep the arcade style with only keyboard interaction (no mouse), but for responsive UIs, that's hard, because I need to match the responsive size with the scroll snap of the movement with the keyboard. And as a code lover, didn't want to implement some weird TS/CSS relation.

[byjokese]

I cloud to make a simpler design to remove the responsive element of the equation, but also wanted to show as many stratagems as possible in one view, so conflicting ideas 🤪.

[odil-io]

I cloud to make a simpler design to remove the responsive element of the equation, but also wanted to show as many stratagems as possible in one view, so conflicting ideas 🤪.

I get that, so much you'd like to implement instantly but can't because time.. I usually don't work with TS and I've been out of the programming business for a while now and starting to get back into it.

I was also looking at it and couldn't leave the urge to edit a little to improve it overall.

Anyways, I'm up for collaborating just hit me up!

[byjokese]

@odil-io Feel free to make a pull request if you want, and you enjoy doing it, I will be working also on it, last day got a working solution, but I still need to clean a couple of things and improve some details.

[odil-io]

Will do, It'll be sporadic, but I'll be working on it every now and then