Composer handle can be dragged up behind the site header on touchscreen devices

Bug
1

Hi All,
As from today the editing section is extended up to the top of the page and there is no way to reduce it because the blue separator is no longer available.
Any help will be appreciated.

1 Like
2

Hi @Kemplen!

Do you mean that the draggable part of the post composer is hidden behind the header?

Can you share a screenshot?

1 Like
3

Yes, here is how my screen appears:

image
image1282×734 34.7 KB

Whereas usually it appeared like this one of Discourse:

image
image1311×1209 63.3 KB

Thanks for your support.

1 Like
4

I’ve just tried to replicate it here on Meta and I can’t seem to get it stuck behind the header. Have you tried your site in safe mode to see if it’s a theme component that may be causing the issue?

2 Likes
5

Hello,

If I see it correctly you using a touchscreen device. I tried to repro it on an iPad and I can.

Here is a quick fix which works for me on iPad. :slightly_smiling_face:

body:not(.ios-safari-composer-hacks) {
  #reply-control.open {
    max-height: calc(100vh - var(--header-offset) - env(safe-area-inset-bottom));
  }
}

3 Likes
6

Thanks for your help.

It was an issue caused by Google Chrome, in fact using Mozilla Firefox there wasn’t the problem. Simply cleaning Google Chrome’s cache memory solved it.

Thanks again.

3 Likes
7

That’s great :slightly_smiling_face: but I think remove cache just resets the composer default height.

2 Likes
8

Oh, that’s very interesting. On non-touchscreen devices, the height of the composer (handle included) will never be higher than the forum’s header, regardless of --composer-height value.

I can repro the issue as well using Chrome’s dev tools and choosing an iPad profile. Or my real iPad :smile_cat:

Moving into bug then, it’s worth a fix. :slight_smile:

2 Likes
13

The composer grip handle being hidden behind the header should now be fixed upon deploy of the latest PR. → UX: Fix mobile grippie being hidden by jordanvidrine · Pull Request #20803 · discourse/discourse · GitHub

4 Likes