Adapt Learning Community: Notify Responsiveness

Hey guys,

.notify__popup has as the attribute .{ position: fixed; top: 50%}, which leads to this strange behaviour

on a mobile.

If it is holded horizontally everything works as expected and the position is in the middle of the screen, but if it is holded vertically the position is somewhere else.

I tried a couple of things, but it seems that there is a problem as the fixed-position is calculated dependent on the viewport position.

Has anybody an idea how to fix this responsiveness problem?

Kindly regards

Jonas

Is the course on an lms inside an iframe?

Which version of the framework are you using?

Show parent | Reply

Hi Oliver,

thank you for your answer.

I am running it as localhost through grunt server. The adapt version is 5.10.0

Show parent | Reply

Which browser?

Show parent | Reply

Firefox 89.0 (64-bit). I had the same issue in Chrome Version 91.0.4472.77.

Show parent | Reply

There is a horizontal scroll bar appearing at the bottom of the screen, that is indicative of an overhanging element which isn't something that happens in the normal course.

Could you try to test the vanilla and core plugins that come with the framework? That should narrow it down.

Show parent | Reply

The overhanging element is

.me-cannotplay
 

from adapt-contrib-media.

Adding a video and a poster into the media component removes the horizontal scroll and seems to solve the problem.

Thank you very much Oliver!

Show parent | Reply