Better UI for mobile

[ChiefChippy2]

Currently the UI does not render well on mobile, so i adjusted the CSS accordingly to better accommodate mobile users.

Main changes are

• allowing table to scroll horizontally if screen width is less than 800px
• changing calculations for recipe list
• some other little tweaks

[ShadowTheAge]

Hi!

I don't think the experience can ever be good on mobile, but small improvements are good

The button is above the search box

What it is supposed to do? Maybe it should only be active on mobile? I think the button is confusing on desktop.

[ShadowTheAge]

Also, the table is no longer full screen width on desktop

[ChiefChippy2]

Also, the table is no longer full screen width on desktop

oops, my bad, didn't see that one, should be fixed now.

Hi!

I don't think the experience can ever be good on mobile, but small improvements are good

honestly, I think it isn't impossible at all, the "big" change that may be needed is to just prompt the user of what to do when they click on something (details; whether to go to production OR consumption OR do nothing), perhaps only on mobile, or on by default for mobile and disable for PC...

The button is above the search box

What it is supposed to do? Maybe it should only be active on mobile? I think the button is confusing on desktop.

It is supposed to be a mobile-friendly implementation of "mouseenter" (hover). When it is toggled (clicked), a "click" in NEI becomes a "moouseenter", so by clicking on an item-icon, instead of seeing its production, you see the associated description.
However, as I said above, having a prompt upon clicking is probably better for mobile than doing what I'm currently doing with this hover button. (hence why I put this into draft :p for now)

[ShadowTheAge]

I had an idea that I never did:
If we detect mobile/touch then:

• click over icon becomes a mouse over (shows tooltip)
• click when the tooltip is already shown handles as a current click (maybe also add a doubleclick for this event)
• long click works as a right click (should already work)

[ChiefChippy2]

I had an idea that I never did: If we detect mobile/touch then:

• click over icon becomes a mouse over (shows tooltip)
• click when the tooltip is already shown handles as a current click (maybe also add a doubleclick for this event)
• long click works as a right click (should already work)

Right, but then you would have this issue to deal with:

so I will try to give my solution a go, will update when i do it (im not exactly a good frontend dev :p)