Как задать поле ввода телефона правильно
На одном сайте, есть очень красивое поле для ввода номера телефона. Когда неактивно, выглядит так
Когда активно, то так. Даже браузер предлагает мои номера.
И когда вводишь номер, то становится так, что плейсхолдер остается.
Как такое можно сделать? Пытался реализовать, вроде получилось, но не то что хотелось бы.
<div class="modal" id="modal">
<h2 class="modal-title">Закажите обратный звонок</h2>
<form action="#">
<input type="tel" prefix="+7" placeholder="+7 (___) __-__-___" name="phone_mobile" tabindex="0" autocomplete="off" autocapitalize="false" value="+7" class="modal-input" data-cobrowsing-secure="input" maxlength="12" />
<button class="button modal-button">Перезвоните мне</button>
</form>
</div>