Jump to content
  • Status Definitions

    Pending = We have not yet reviewed the suggestion.

    Under Review = We are currently reviewing the suggestion. Check the suggestion's comments for updates from the team.

    Accepted = We've approved the suggestion and it will be implemented in a future update.

    Completed = The suggestion has now been implemented.

    Rejected = The suggestion has been rejected. Check the comments section for more information.

     

    Please do not post duplicate suggestions or report bugs. This area is for suggestions for changes/improvements to the game.

Company manager flexbox card grid design


Zoltan
  • Pending

I know you hate these things, it's tedious and annoying, I feel you. But I thought just maybe, if you are feeling the urge one morning it could be of some help on how to do it.

In general I'm thinking it this way:

  • show the companies as individual cards, displaying things only that is needed to get a good understanding of it in one quick look
  • clicking a card would open a popup covering like 80% (so you can still see it's that card's popup which would be in the background at this point
  • set everything from this popup, clicking outside of it, pressing the escape or clicking it's close button(s) would close it
  • every action is ajaxed, making any change would get automatically applied when the card closes for any reason (closing browser, closing the popup in a normal way, etc.)
  • the changes would be instantly reflected on the card, but data exchange only happens at opening/closing

All the page is in flex, which makes it easy to optimize it for different screen sizes, everything in css so scripting can't cause problems.

These are some pens that I'd find useful to build something like this

  • For example, look at this design. It's insane how advanced effects and look you can create with such a small code. I'd love to see our cards "alive" like this, I'm talking about the fact that when you hover, the animations are fantastic
    https://codepen.io/william-goldsworthy/pen/JzVajj
  • Or this one for simplicity, interesting idea how you can use color gradient and simple non-intrusive css animations
    https://codepen.io/prasad-d/pen/dEeYea
  • This one is to make it responsive (so you wouldn't have to experiment with it, you set these sizing rules for the cards, and they will become readable and usable on every screen size)
    https://codepen.io/sammyteahan/pen/eRmbVR

 

  • Like 1


  Report Suggestion



User Feedback

Recommended Comments

There are no comments to display.



Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...