JSFiddle - React, Tailwind, and code Playground
by JWo1F
HTML
<form>
<input type="text" name="v1" required />
<fieldset data-dialog-target="fieldset" disabled>
<div class="tw-flex tw-gap-2 tw-w-full">
<div class="tw-grow">
<div class="tw-mb-4"><label for="crm_quick_pricing_bridge_form_borrower_first_name"><div class="tw-block tw-text-sm tw-font-medium tw-mb-1 tw-text-gray-700">First name</div>
<input required="required" class="tw-block tw-w-full tw-rounded-sm tw-shadow-sm tw-border-solid tw-border-grey tw-border tw-py-1.5 tw-px-3 tw-border-gray-300 focus:tw-ring-indigo-500 focus:tw-border-indigo-500" type="text" name="crm_quick_pricing_bridge_form[borrower][first_name]" id="crm_quick_pricing_bridge_form_borrower_first_name">
</label></div> </div>
<div class="tw-grow">
<div class="tw-mb-4"><label for="crm_quick_pricing_bridge_form_borrower_last_name"><div class="tw-block tw-text-sm tw-font-medium tw-mb-1 tw-text-gray-700">Last name</div>
<input class="tw-block tw-w-full tw-rounded-sm tw-shadow-sm tw-border-solid tw-border-grey tw-border tw-py-1.5 tw-px-3 tw-border-gray-300 focus:tw-ring-indigo-500 focus:tw-border-indigo-500" type="text" name="crm_quick_pricing_bridge_form[borrower][last_name]" id="crm_quick_pricing_bridge_form_borrower_last_name">
</label></div> </div>
</div>
<div class="tw-flex tw-gap-2 tw-w-full">
<div class="tw-grow">
<div class="tw-mb-4"><label for="crm_quick_pricing_bridge_form_borrower_email"><div class="tw-block tw-text-sm tw-font-medium tw-mb-1 tw-text-gray-700">Email</div>
<input class="tw-block tw-w-full tw-rounded-sm tw-shadow-sm tw-border-solid tw-border-grey tw-border tw-py-1.5 tw-px-3 tw-border-gray-300 focus:tw-ring-indigo-500 focus:tw-border-indigo-500" type="text" name="crm_quick_pricing_bridge_form[borrower][email]" id="crm_quick_pricing_bridge_form_borrower_email">
</label></div> </div>
<div class="tw-grow">
<div class="tw-mb-4"><label for="crm_quick_pricing_bridge_form_borrower_state"><div...