Успешный результат = успешно пройденный Speed Test сайта и полное соответствие макету.
Доступ к макету в Figma, Google Drive со всеми фото и иконками (их желательно делать через код иконки, но как получится), zip файл с существующим кодом (который нужно либо доработать, либо переделать - как Вам удобнее) - все я предоставлю в личных сообщениях.
Не пугайтесь, здесь довольно много описано, но в целом основная цель - сделать как в макете, физика уже реализована, просто нужно сделать много ПРАВОК в коде. Если где-то будут проблемы с текстом - я сама смогу исправить в коде, потому что я учусь на программиста, мне это просто не нравится и я не знаю React js. Главное, чтобы макет был адаптивным. Обращайте внимание на отступы, используется 3 шрифта (Lexend Exa, Lexend Mega, Lexend Zetta). Поэтому, пожалуйста, просто кликайте в макете, смотрите отступы, по бокам везде 80 пикселей от экранов (каждый блок разделен на экраны), все централизовано по этим экранам. Все неоновые элементы - это просто дубликат одного элемента с разным Layer Blur (50, 25, 15, 10, 5 (почти везде), в некоторых отличается градиент по цветам. Я оставлю Вам очень крутой отзыв и вы сможете использовать мою работу в портфолио.
Дополнительное описание:
1. Анимация раздела Tools: Я бы хотела, чтобы иконки в разделе Tools были анимированы как «стеклянные шарики». Они должны реалистично падать вниз под действием гравитации, накапливаться там и слегка перекатываться с боку на бок при взаимодействии или столкновении. Убрать рамку, которая есть в существующем коде. В идеале было бы сделать их более стеклянными, но можно оставить и как в макете. (сама физика уже реализована)
2. Просмотр Case Studies (PDF Modal): При нажатии на кнопку «Full Project» должно открываться модальное окно с просмотром моей PDF-презентации. (!!!!!но это уже реализовано)
3. Дополнительные сертификаты: В разделе с сертификатами при нажатии на кнопку должно появляться модальное окно.
Стилистика: эффект матового стекла (glassmorphism) с градиентом.
Контент: там должны быть еще 2 сертификата, которые не вошли в основную сетку, с возможностью легко добавлять новые через код в будущем. (когда кликаешь на сертификат он открывается (как презентации))
4. Функция «View Explanation» в Tools: При нажатии на «View Explanation» круглые иконки инструментов должны трансформироваться (или заменяться) на карточки с названием и коротким описанием. Описание должно быть под каждую иконку, поэтому в этом всплывающем окне можно листать вниз.
5. Валидация и логика лид-формы:
Ошибка: Если обязательные поля не заполнены, форма не должна отправляться. Нужно добавить визуальный эффект (свечения/glow) вокруг незаполненных полей. (это уже реализовано!!!)
Успех: После успешной отправки должно появляться PopUp с текстом: «Request sent. Let’s see how we can scale your results soon!». (я могу сделать это или сразу, или как дойдете до этого пункта, вообще логика простая - форма сзади становится пустой и затемняется - а PopUp выскакивает посередине формы и выглядит так же как окно с сертификатами)
Поле телефона: Рядом с вводом номера (там где +00) добавить небольшой квадратик с закругленными углами для выбора кода страны в АЛФАВИТНОМ порядке (Dropdown).
