Misplaced AI docs Overlay button

UX
, ,
1

Hello,

I have noticed the “AI Docs” floating button appearing in the PenPot Discourse mobile app over the past few days. While I appreciate the positive role AI can play in enhancing the user experience, I have encountered a significant usability issue in the iOS app when using the in-app browser.

The button currently floats at the bottom of the screen, overlapping key interface elements such as the ‘Share’ and ‘Minimise’ buttons. see here:

561d509b90e610cce86d8ed68425b9bca17fd3d7_2_231x500
561d509b90e610cce86d8ed68425b9bca17fd3d7_2_231x500231×500 34.8 KB

This makes navigation difficult and interferes with accessibility.

How could one adjust the button’s position so it doesn’t obstruct core functionality? Does it need a bugfix in a certain program or plugin?
I’ve tried to find the correct channel to report this but haven’t had much luck. If a formal bug report would be more appropriate, I’d be grateful for guidance on where to submit it.

Thank you for your time and attention.

Kind regards,
Sven

2 Likes
2

Hi Sven,

Good question! The only way to fix this is to change the positioning of the AI Docs button on the Penpot instance. An admin on that instance should add some padding or margin to the element. Something like this:

.ikp-chat-button__container {
  margin-bottom: 70px;
}

should work.

Note that this doesn’t only affect the DiscourseHub app, it also affects any users using PWAs (on Android or iOS).

4 Likes