Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feedback ellipsis needs to be vertically centered #34320

Closed
stephendonner opened this issue Nov 14, 2023 · 4 comments · Fixed by brave/brave-core#21046
Closed

Feedback ellipsis needs to be vertically centered #34320

stephendonner opened this issue Nov 14, 2023 · 4 comments · Fixed by brave/brave-core#21046

Comments

@stephendonner
Copy link

Description

Feedback ellipsis needs to be vertically centered

Steps to Reproduce

  1. install 1.62.51
  2. launch Brave
  3. click on Leo in the sidebar
  4. click Accept and begin
  5. load an page
  6. click on Summarize this page
  7. hover over the response
  8. look at the alignment

Actual result:

Screen Shot 2023-11-14 at 8 52 57 AM

Expected result:

Screen Shot 2023-11-14 at 8 56 46 AM

Reproduces how often:

Brave version (brave://version info)

Brave | 1.62.51 Chromium: 119.0.6045.134 (Official Build) nightly (x86_64)
-- | --
Revision | 065f85bcfbc633e8e0bc4764c7bd880748731293
OS | macOS Version 11.7.10 (Build 20G1427)

Version/Channel Information:

  • Can you reproduce this issue with the current release?
  • Can you reproduce this issue with the beta channel?
  • Can you reproduce this issue with the nightly channel?

Other Additional Information:

  • Does the issue resolve itself when disabling Brave Shields?
  • Does the issue resolve itself when disabling Brave Rewards?
  • Is the issue reproducible on the latest version of Chrome?

Miscellaneous Information:

cc @nullhook @aguscruiz @petemill @MadhaviSeelam @srirambv

@fallaciousreasoning
Copy link

fallaciousreasoning commented Nov 14, 2023

FWIW @nullhook I think if we put a Nala button with the folowing styles in the anchor-content slot things should look right:

<Button slot="anchor-content" kind='outline' fab size='small'>
  <Icon name='more-horizontal' />
</Button>

it'll have the bonus of being keyboard focusable (though I think still only when you're hovering over the response, which isn't super helpful)

@stephendonner
Copy link
Author

For QA: latest nightly and beyond is actually a horizontal line due to #34124 (but still suffers from the same issue; just noting so folks don't get confused when verifying).

Screen Shot 2023-11-14 at 1 53 37 PM

@bbondy bbondy moved this to Important / Polish in Browser AI Nov 15, 2023
@nullhook nullhook self-assigned this Nov 20, 2023
@nullhook nullhook moved this from Important / Polish to In Progress in Browser AI Nov 20, 2023
@nullhook nullhook moved this from In Progress to In Review in Browser AI Nov 20, 2023
@github-project-automation github-project-automation bot moved this from In Review to Done in Browser AI Nov 20, 2023
@brave-builds brave-builds added this to the 1.62.x - Nightly milestone Nov 20, 2023
@stephendonner
Copy link
Author

stephendonner commented Nov 21, 2023

Verified PASSED using

Brave | 1.62.69 Chromium: 119.0.6045.163 (Official Build) nightly (x86_64)
-- | --
Revision | 271270f8302c71e63d6cca16eee5578836d3fd96
OS | macOS Version 14.2 (Build 23C5047e)

Followed my original steps to reproduce

Confirmed the horizontal ... ellipsis is now vertically centered

Dark

default state hover click
Screenshot 2023-11-20 at 11 35 27 PM Screenshot 2023-11-20 at 11 35 46 PM Screenshot 2023-11-20 at 11 35 50 PM

Light

default state hover click
Screenshot 2023-11-20 at 11 42 41 PM Screenshot 2023-11-20 at 11 43 31 PM Screenshot 2023-11-20 at 11 43 36 PM

@LaurenWags
Copy link
Member

@nullhook @rebron could one of you please add release-notes/exclude or release-notes/include label as appropriate for this one? Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment