Improved queue in city screen

[sulai]

optimized city screen construction queue for space and optimized for cramped portrait

• moved priority buttons under the queue
• queue is collapsible and shows preview
• when expanded, the queue takes available space
• collapse stats on cramped portrait
• collapsed stats show 2 lines of resources in cramped portrait to reduce width, right aligned
• raze button moved close to city button in cramped portrait

This PR depends on #12315, which should be merged first. After merge, the actual changes of this PR become visible in the files changed tab.

[sulai]

yairm210 commented:

I like the icons shown on the queue, I wonder what that looks like if you have a queue of ten items?

Thanks for that! If you got 8 in queue, only 5 are shown and a (+3) is added behind the last one. The actual benefit is that we are now free to take more space as soon as the user decides to expand the queue, solving the problems we had with vertical space with those two list on top of each other.

I dislike the up and down buttons not being on the queue itself, that means for reorg you double the clicks - choose item + move instead of just move item

Give it a try in the game. They have their benefits, too.

• less visual clutter
• no need to re-locate your finger to move an item by more than one position
• you have to select the item to move: it's green and it stays green when it moves. it's easy for the eye to follow

I agree with what you said though, maybe there's a way to optimize that even further. For example, a newly added item could be automatically selected in the queue. You'd need 1 click to move it.

There's more details to discuss, see the PR description. This PR includes the changes of #12315, because it depends on it. The actual difference becomes visible after the other one got merged.

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.