Skip to content

feat(form elements): improve input, textarea, select#4371

Open
pdanpdan wants to merge 3 commits intosaadeghi:masterfrom
pdanpdan:feat/improve-form-el
Open

feat(form elements): improve input, textarea, select#4371
pdanpdan wants to merge 3 commits intosaadeghi:masterfrom
pdanpdan:feat/improve-form-el

Conversation

@pdanpdan
Copy link
Contributor

@pdanpdan pdanpdan commented Jan 6, 2026

  • use size and font based on variables
  • remove redundant rules
  • fix input shadow element settings to work when using .input input and input.input
  • fix placeholder color for safari
  • make .floating-label respect responsive size modifiers on child .input, .select, .textarea

Notable changes:

  • .floating-label is flex instead of block so that we can keep input inline-flex and avoid white space generated spacing
  • input is relative so that the ::-webkit-calendar-picker-indicator is correctly positioned when using .input input

Not solved:

  • .floating-label does not adapt to responsive size classes of content (TODO in future PR)

example (only for input): https://play.tailwindcss.com/s2xaEB1VZw?file=css

close #4370

- use size and font based on variables
- remove redundant rules
- fix input shadow element settings to work when using `.input input` and `input.input`
- fix placeholder color for safari

Notable changes:
- `.floating-label` is `flex` instead of `block` so that we can keep input `inline-flex` and avoid white space generated spacing
- input is `relative` so that the `::-webkit-calendar-picker-indicator` is correctly positioned when using `.input input`

example (only for input): https://play.tailwindcss.com/s2xaEB1VZw?file=css

close saadeghi#4370
- set the variables from children because `.floating-label` does not have much reason to be responsive
@saadeghi saadeghi self-assigned this Jan 7, 2026
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.

bug: wrong aspect for input type datetime-locale on safari when in .floating-label

2 participants