CarolineS's avatar
CarolineS
Boss
3 months ago
Status:
Accepted

At certain widths, Maia covers up important buttons

At certain screen widths, the Maia icon in the lower right covers up important buttons (such as "Publish") almost completely. See screenshot - which shows in light blue the iframe that almost completely covers the Publish button.

The URL of the page in the screenshot is: Atlas Suggestions | Atlas (but there are other pages where I have noticed this as well). The screen width is 1165px

Recommendation: Position Maia so that she doesn't cover up important functionality! (or relocate the "Publish" buttons so they're not aligned to the bottom-right of the window, but I imagine that's harder)

UX and UI

6 Comments

Sort By
  • CarolineS's avatar
    CarolineS
    Boss
    24 days ago

    I really wish this would get addressed. It's truly crazy that the AI chatbot is interfering with basic functions such as publishing a post or accomplishing things in the admin console. This is a problem both here on Atlas and in my community's admin console.

  • BlakeH's avatar
    BlakeH
    Khoros Staff
    14 days ago

    Hey, so sorry for the delay! This got reviewed and brought up as feedback a few months back, but I lost the thread during the holidays. My sincerest apologies.

    We're planning to move the location of the button just for Atlas, so that it that won't affect where it appears in our products. This should take effect within the next week, pending some testing.

    In case it helps you do the same, you can make a copy of the theme in your Khoros Care instance and customize it to the position you want, then apply the theme to the rule that corresponds to the website domain. Details on how to do that here (and it's easy to do, huzzah!).

  • CarolineS's avatar
    CarolineS
    Boss
    14 days ago

    Nice, thanks BlakeH!

    (FWIW, we don't have Khoros Care, so can't take the advice about changing the Care theme)

  • Claudius's avatar
    Claudius
    Boss
    14 days ago

    Should just be about editing the bottom value in this iframe positioning from 0 to:

    @media only screen and (max-width: 767px), only screen and (max-height: 667px) {
    iframe#web-messenger-container {
        bottom: 48px;
        right: 0;
    }
}

    Source: Tried it out in my browser's web developer :P