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

[InputNew]: description position to absolute #997

Open
AbhinavMV opened this issue Jan 4, 2023 · 6 comments
Open

[InputNew]: description position to absolute #997

AbhinavMV opened this issue Jan 4, 2023 · 6 comments
Assignees
Labels
bug Something isn't working question Further information is requested

Comments

@AbhinavMV
Copy link
Collaborator

AbhinavMV commented Jan 4, 2023

Behaviour: When adding margin or gap style property on input.
Margin is added between input and description

image

Expected: Description should be fixed and margin should be below input

Solution: Fix description using absolute position similar to invalid message.

@AbhinavMV AbhinavMV added bug Something isn't working help wanted Extra attention is needed ready for dev this issue is ready to be picked up labels Jan 4, 2023
@uday03meh
Copy link

Hi, Can someone please assign this to me?

@AbhinavMV
Copy link
Collaborator Author

Hey @uday03meh 👋🏻
Sure will assign you this issue, If you have any questions or get stuck somewhere, reach out to us on discord -> Moralis server -> web3uikit channel and we will help you out 🙌🏻
thankyou

@AbhinavMV AbhinavMV added in-progress someone has taken this task and removed help wanted Extra attention is needed ready for dev this issue is ready to be picked up labels Jan 5, 2023
@AbhinavMV
Copy link
Collaborator Author

Hey @uday03meh 👋🏻

How is this issue going? Do let us know if you are facing any issues or need any help 😄 🙌🏻

@AbhinavMV
Copy link
Collaborator Author

Hey @uday03meh

Please let us know if you need any help with this issue or if you are not working on it anymore. 😄

@BillyG83 BillyG83 added question Further information is requested and removed in-progress someone has taken this task labels Feb 26, 2023
@BillyG83
Copy link
Contributor

BillyG83 commented Feb 26, 2023

hey @AbhinavMV using absolute is by design, otherwise the page jumps when the description / error message is rendered. I would just wrap the element in a div and add the padding to the bottom of the parent dev

@AbhinavMV
Copy link
Collaborator Author

Hey @BillyG83 , yes but in the input component, the description is not being used as absolute which is why this issue is happening. This is what we have right now.

const StrongStyledDescription = styled.strong`
    ${resetCSS}
    ${fonts.text}
    color: ${color.blueGray50};
    font-size: 12px;
    padding: 0 16px;
`;

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

No branches or pull requests

3 participants