Skip to content

removed overlap of text and icon in input box & refactored input-base#128

Merged
NicholasLin718 merged 4 commits into0.4.2from
inputfield
Feb 7, 2023
Merged

removed overlap of text and icon in input box & refactored input-base#128
NicholasLin718 merged 4 commits into0.4.2from
inputfield

Conversation

@NicholasLin718
Copy link
Contributor

@NicholasLin718 NicholasLin718 commented Feb 3, 2023

  1. Modified tailwind styling to allow icons to exist without overlap with the input
  2. Modified input-base into smaller reusable tailwind class components

@netlify
Copy link

netlify bot commented Feb 3, 2023

Deploy Preview for lodestone-dashboard ready!

Name Link
🔨 Latest commit c8cccf8
🔍 Latest deploy log https://app.netlify.com/sites/lodestone-dashboard/deploys/63dd92b6672ca500085bb595
😎 Deploy Preview https://deploy-preview-128--lodestone-dashboard.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@NicholasLin718 NicholasLin718 linked an issue Feb 3, 2023 that may be closed by this pull request
3 tasks
onChange={onChange}
maxLength={maxLength}
className={`input-base w-full ${
className={`input-base w-full ${icons.length ? 'pr-16' : 'pr-4'} ${
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Try to set the right padding dynamically based on the length of the icon list?
Since it might be 1 or 3
Here's a quick example
image

@NicholasLin718 NicholasLin718 changed the title removed overlap of text and icon in input box removed overlap of text and icon in input box & modified input-base tailwind component into smaller reusable components Feb 3, 2023
@NicholasLin718 NicholasLin718 linked an issue Feb 3, 2023 that may be closed by this pull request
4 tasks
@NicholasLin718 NicholasLin718 changed the title removed overlap of text and icon in input box & modified input-base tailwind component into smaller reusable components removed overlap of text and icon in input box & refactored input-base Feb 3, 2023
@NicholasLin718 NicholasLin718 requested a review from Ynng February 7, 2023 03:26
Copy link
Member

@Ynng Ynng left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm!

@NicholasLin718 NicholasLin718 merged commit 262dbf3 into 0.4.2 Feb 7, 2023
@Ynng Ynng deleted the inputfield branch February 21, 2023 22:02
Ynng pushed a commit that referenced this pull request Jul 14, 2023
make vendored openssl build optional via a feature flag
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Refactor out input-base Fix icons overlaying text in input fields

2 participants