search

N-Shar-ma / Emoji-Card-Game

Emoji guessing card matching game, made using vanilla JavaScript, lots of css animations and the native HTML drag and drop API
https://emoji-card-game.netlify.app
19 stars 26 forks source link

Reponsive UI for better experience #46

Closed thevinitgupta closed 1 year ago

thevinitgupta commented 1 year ago

The game works good for Desktops but having a UI that is responsive would be better. For smaller screens the game looks something like this :

breaking

A better looking UI would be something like this : better

I would love to implement this.

N-Shar-ma commented 1 year ago

The game just got support for touch devices, so making it responsive is definitely the next important step! The proposed layout looks good. :)

Please try to follow the CSS conventions and feel free to discuss and finalize any implementation details here

thevinitgupta commented 1 year ago

Sure I would. Thanks

thevinitgupta commented 1 year ago

I am having trouble using Media Queries. The website is not reading any styles I put inside media query blocks. Is there a reason for this?

N-Shar-ma commented 1 year ago

@thevinitgupta You probably need to add in this line in the header in the html: <meta name="viewport" content="width=device-width, initial-scale=1.0">

thevinitgupta commented 1 year ago

Yes it is working fine now. Thanks