Issue when the article expands up instead of down, it hides the image and wikipedia logo when there's still space below the popup.
According to the description, if there is no more space, it should show the image and show a vertical scroll.
this is what I found out related to the view port dimensions.
I first saw the issue on my computer with this dimensions.
then i opened the browser on responsive layout and noticed that it starts covering the top of the popup around 800 px even though there is more space below
These are two design recommendations which we can consider in order to avoid hiding the preview header(thumbnail, wordmark). We might require minor refinements after coding to make sure it looks fine in different conditions.
- If the preview card comes up above the preview word then let it expand upwards but fixed its headers' position just below the browser's URL address bar. Also, enable vertical scrolling inside preview to let readers read the entire content.
- If the preview card comes underneath the preview word then let it expand downwards and enable vertical scrolling inside.
Note: Attached mock up is just a representation of the idea.