5da6968996
This PR adds some additional styles to Preflight to normalize a bunch of inconsistencies in date/time inputs across browsers. The main motivation for this is to remove these insane classes we have to add in Catalyst: ```html <input type="date" class="[&::-webkit-datetime-edit-fields-wrapper]:p-0 [&::-webkit-date-and-time-value]:min-h-[1.5em] [&::-webkit-datetime-edit]:inline-flex [&::-webkit-datetime-edit]:p-0 [&::-webkit-datetime-edit-year-field]:p-0 [&::-webkit-datetime-edit-month-field]:p-0 [&::-webkit-datetime-edit-day-field]:p-0 [&::-webkit-datetime-edit-hour-field]:p-0 [&::-webkit-datetime-edit-minute-field]:p-0 [&::-webkit-datetime-edit-second-field]:p-0 [&::-webkit-datetime-edit-millisecond-field]:p-0 [&::-webkit-datetime-edit-meridiem-field]:p-0"/> ``` With these normalizations, changing things like padding, display type, etc. gives consistent results (at least as consistent as is actually possible) across all browsers. --- **Make text alignment work on iOS Safari** <kbd><img width="418" alt="iOS Safari text alignment" src="https://github.com/user-attachments/assets/0ff792b2-1f3a-40c6-9185-6bd076c8715d"></kbd> --- **Don't shrink date inputs on iOS Safari when there is no selected value** <kbd><img width="409" alt="ioS Safari no input" src="https://github.com/user-attachments/assets/a8e69af7-3f0c-4d1d-b7a0-10355a5d3907"></kbd> --- **Fix padding in macOS Safari** <kbd><img width="717" alt="MacOS Safari" src="https://github.com/user-attachments/assets/5ea19b66-2dec-46e2-a386-d61bd5b8517a"></kbd> --------- Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com> |
||
|---|---|---|
| .. | ||
| @tailwindcss-cli | ||
| @tailwindcss-node | ||
| @tailwindcss-postcss | ||
| @tailwindcss-standalone | ||
| @tailwindcss-upgrade | ||
| @tailwindcss-vite | ||
| internal-example-plugin | ||
| tailwindcss | ||
| tsconfig.base.json | ||