Improve UI on the MV3 user gesture dialog

pixiebrix / pixiebrix-extension

PixieBrix browser extension

https://www.pixiebrix.com

GNU Affero General Public License v3.0

83 stars 22 forks source link

Improve UI on the MV3 user gesture dialog #8301

Open twschiller opened 5 months ago

twschiller commented 5 months ago

Context

In MV3, opening the sidebar requires a user gesture
If too much time has passed (e.g., due to an API call), PixieBrix shows a dialog modal over the page to get the user to click to be used as the gesture Chrome requires to open the sidebar
The dialog modal UI is not consistent with other user-facing PixieBrix UI elements

Discussion

@BrandonPxBx we'll use this issue to track updates to the UI styling
https://pixiebrix.slack.com/archives/C0436P48QHY/p1716994564933799

Definition of Done

UI styling matches guidance from @BrandonPxBx

BrandonPxBx commented 5 months ago

@twschiller I thought the discussion we had in our 1 on 1 yesterday was that we just wanted to remove the word "PixieBrix" and that the UI was fine for now?

twschiller commented 5 months ago

@twschiller I thought the discussion we had in our 1 on 1 yesterday was that we just wanted to remove the word "PixieBrix" and that the UI was fine for now?

Correct - this issue is in the "Icebox". We're just tracking it as something to consider prior to MV3 switchover. If we decide not to, we'll close this issue. There's no action to take on this issue right now

BrandonPxBx commented 5 months ago

@twschiller I thought the discussion we had in our 1 on 1 yesterday was that we just wanted to remove the word "PixieBrix" and that the UI was fine for now?

Correct - this issue is in the "Icebox". We're just tracking it as something to consider prior to MV3 switchover. If we decide not to, we'll close this issue. There's no action to take on this issue right now

Got it, that's not displayed anywhere on this UI from what I can tell and I just saw this from my notifications pane.

grahamlangford commented 1 month ago

@twschiller I don't think we ever settled on Acceptance Criteria for this. Do you have any more specific guidance? The styles are completely isolated and outside react, so we can't just use the react-bootstrap modal and button components