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

Gray strip overlaps header in the token list #584

Open
cawabunga opened this issue May 11, 2023 · 6 comments
Open

Gray strip overlaps header in the token list #584

cawabunga opened this issue May 11, 2023 · 6 comments
Labels
bug Something isn't working

Comments

@cawabunga
Copy link

Bug Description
Grayish strip overlaps header in the list of tokens, which disallows to close the list.

Steps to Reproduce

  1. Click on token select
  2. List is opened with grayish strip in the header

Expected Behavior
I am not sure the purpose of the strip, but I suppose it should be placed on element of the active token.

Additional Context
Codesandbox

Screenshot

Screenshot 2023-05-11 at 18 30 00

@cawabunga cawabunga added the bug Something isn't working label May 11, 2023
@justinevedovato
Copy link

I'm having the same issue, I have a list of several tokens, and when I hover on them, the gray strip moves along. Hovering the 1st element will hide the closing button, hovering on the 2nd one hides the input field, and so on.

Not sure what's causing it, nothing's been changed in the style, except for the dark mode. But it happens also in light mode, just like the screenshot above.

Screenshots

brave_NWxCFHorBX

brave_bEFjLVzVBc

brave_8KQkwB8bp4

@datnguyen-tech
Copy link

Has anyone been able to fix that? I'm having the same issue :((

@cawabunga
Copy link
Author

Has anyone been able to fix that? I'm having the same issue :((

I had to do a quick fix. Wrap your uniswap widget with <div class="uniswap"> and add next css:

.uniswap [color='container'] > div > div:nth-child(3) {
  position: relative;
}

@justinevedovato
Copy link

Thanks for the fix!

@TrejGun
Copy link

TrejGun commented Jul 16, 2023

same here

@beautyfree
Copy link

Same issue

looks like the reason is in this package
https://github.com/Uniswap/widgets/blob/main/src/components/TokenSelect/TokenOptions.tsx#L229

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

5 participants