Крупное рекламное агентство запустило в России масштабную рекламную кампанию по продвижению полнометражного фильма «Гравити Фолз». Часть кампании — интерактивное приложение в виде телефонной книжки с контактами главных героев мультика. У пользователя есть возможность позвонить по телефону или написать электронное письмо и лично пообщаться с персонажем.
Сейчас ключевой функционал отсутствует, и для звонка или письма приходится копировать контакт и вставлять его в другом приложении. Это неудобно, и конверсия заметно ниже той, что ожидалась.
Ваша задача — сделать строки с телефоном и электронной почтой интерактивными. При нажатии на номер телефона должно появляться предложение позвонить:
А при нажатии на почту должен открываться почтовый клиент:
Важно, чтобы при этом внешний вид строк не изменился.
-
Измените HTML-разметку так, чтобы строка с номером телефона стала интерактивной. При клике по этой строке должно появляться предложение о наборе номера.
-
Измените HTML-разметку так, чтобы строка с адресом электронной почты стала интерактивной. При клике по этой строке должен открываться почтовый клиент с этим адресом в поле «Кому» и с темой письма «Люблю Гравити Фолз!».
-
Напишите CSS-правило для того, чтобы отменить встроенные стили интерактивных ссылок.
Не нужно вносить какие-либо другие правки в CSS или писать дополнительные правила.
Внесите изменения во вкладках HTML и CSS. Перед началом работы сделайте форк пена здесь.