fix: underline select padding

[hyunbinseo]

<select> element should have a larger right-padding to accommodate the dropdown arrow.

However, the underline themed <select> had a px-0.5 set, causing long text to show above the arrow.

• 
• 
• 
• 

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
tailwindcss-forms	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 8, 2024 6:07pm

[adamwathan]

Thank you!

[hyunbinseo]

Revisiting this PR, maybe the value should be pr-10 matching other styles.

Especially since the same background-image SVG was used in all <select> elements.

select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  padding-right: 2.5rem;
  -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
}