Issue 1: Box art/thumbnail lives in the background's div when it should live in the data area. Currently, its position is fixed (top: 700px; left: ...etc...) relative to the top of the background's container which is a bad practice.
Make use of css flex box (See Michael_B's top comment on stackoverflow) and things like width: and auto instead of hard coding numbers for positioning.
Issue 2: The mobile version shall look as similar to the current site as possible. The current screen width/height can be retrieved via a media query or by looking at the window/document's max width/height and showing a certain version of the site in response. Most data will have to be eliminated.
The most important data is the following:
-> Box art/thumbnail
-> Name
-> Mean score percentage
-> Genres
Important data that isn't necessary:
-> Cover art
-> Ranking
-> Popularity
-> Description
Issue 1: Box art/thumbnail lives in the background's div when it should live in the data area. Currently, its position is fixed (top: 700px; left: ...etc...) relative to the top of the background's container which is a bad practice. Make use of css flex box (See Michael_B's top comment on stackoverflow) and things like width: and auto instead of hard coding numbers for positioning.
Issue 2: The mobile version shall look as similar to the current site as possible. The current screen width/height can be retrieved via a media query or by looking at the window/document's max width/height and showing a certain version of the site in response. Most data will have to be eliminated. The most important data is the following: -> Box art/thumbnail -> Name -> Mean score percentage -> Genres
Important data that isn't necessary: -> Cover art -> Ranking -> Popularity -> Description
All other data can be omitted.