Make the freelancer form url fields initial values "https://" so users don't have to retype that each time

[vacchiano]

@rcoffie Awesome! I updated the tailwind styles a bit but this is great! The only improvement could be for the url field to set the initial values to "https://" so that users can just type in their website and not have to repeat the "https://" each time - I'm going to open this as an issue/improvement

Originally posted by @vacchiano in #24 (comment)

[gokhanmeteerturk]

Using just the initial='https://' could be a little bit problematic since the front-end form will warn user with 'Please enter a URL' even though it is not a required field.
We could either write a custom URL validator and deactivate form validation, or even better; add an onchange event listener to the url field to decide whether the input should have https:// at the beginning or left alone(empty).

I'd go with the JS solution since 'https://' alone shouldn't even make it to the payload, but currently there is zero javascript code on the source so I didn't want to go blindly for that.

[vacchiano]

Good call 👍 I like the js approach. Could you also update the form field to include "https://" to the left of the input so users know they don't have to type that like below? If you want to tackle this I can assign this issue just let me know

The input (tailwind css classes):

<div>
  <label for="company-website" class="block text-sm font-medium text-gray-700">Company Website</label>
  <div class="mt-1 flex rounded-md shadow-sm">
    <span class="inline-flex items-center rounded-l-md border border-r-0 border-gray-300 bg-gray-50 px-3 text-gray-500 sm:text-sm">http://</span>
    <input type="text" name="company-website" id="company-website" class="block w-full min-w-0 flex-1 rounded-none rounded-r-md border-gray-300 px-3 py-2 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm" placeholder="www.example.com">
  </div>
</div>