Исправление UI/UX багов (React, Tailwind, Framer Motion)

Добрый день! Готов взяться за ваш проект по исправлению UI/UX багов в мобильной и десктопной версиях. Имею практический опыт работы с React и Tailwind CSS, а также понимаю специфику работы Framer Motion, в частности решение конфликтов между анимациями (transform) и фиксированным позиционированием (position: sticky), настройкой z-index и эффектов glassmorphism.

Перед началом работы хотел бы прояснить один момент: сможете ли вы предоставить доступ к репозиторию для локального развертывания проекта и тестирования правок непосредственно на мобильных устройствах?

Напишите мне, и мы согласуем все технические детали!

Показать оригинал

Перевести

Добрый день! Готов приступить к работе. Имею опыт с React, Tailwind, Framer Motion, понимаю возможные причины проблем со стилями, наложением и sticky-элементами. Могу быстро найти источник конфликтов и аккуратно исправить, не ломая анимации. Готов посмотреть код.

Показать оригинал

Перевести

Доброго дня.
Я переглянув опис проблем і можу їх виправити. Коротко поясню, що саме відбувається і як це можна вирішити.
1. Сині назви розділів у шапці (мобільна версія)
У мобільній версії браузер підміняє колір посилань на стандартний синій. Це звичайний конфлікт стилів. Потрібно правильно перевизначити стилі, щоб назви розділів завжди відображались білим кольором.
2. Проблема з плавучою кнопкою
Кнопка зроблена з анімацією, тому її потрібно виправляти обережно, щоб не зламати ефект. Я відновлю правильну прозорість і вигляд кнопки (ефект скла), при цьому сама анімація залишиться працювати як зараз.
3. Погано видно назви розділів у шапці (десктоп)
Під час вибору розділу з’являється світла анімована плашка, яка частково перекриває текст. Через це назва стає менш читабельною. Це вирішу налаштуванням шарів елементів, щоб текст завжди був чітко видно.
4. Зникнення шапки при відкритті правої панелі (мобільна версія)
… Коли відкривається бокова панель, анімація змінює поведінку сторінки і шапка перестає правильно "триматися" при скролі. Потрібно трохи змінити структуру відображення, щоб шапка залишалась на місці.
Усі ці проблеми технічні, але вони вирішуються без переробки дизайну чи функціоналу. Я акуратно виправлю їх так, щоб нічого не зламати в існуючих анімаціях і адаптивності.
Готовий взятись за роботу та оперативно все полагодити.

Показать оригинал

Перевести

Добрый день. Готов взяться за проект и обсудить, у меня большой опыт работы с реактом и тейлвиндом.

Пожалуйста, отправьте в личные сообщения ссылку на сайт для ознакомления.

Показать оригинал

Перевести

Здравствуйте! Ознакомился с перечнем багов. Описание проблем очень четкое, и я уже понимаю их природу: от специфики стеккинга контекстов (Stacking Context) до конфликтов transform с position: sticky.

Показать оригинал

Перевести

Здравствуйте! Могу сделать ваши задания. Опыт есть. Пишите договоримся.

Здравствуйте.

Я разработчик NodeJS. Готов взяться. Пишите, обсудим.

Показать оригинал

Перевести

Добрый вечер

Меня зовут Дмитрий, компания King Kong Lab.

Ознакомился с описанием проблем. Можем быстро разобраться с этими багами во фронтенде и аккуратно исправить их, не ломая текущую логику интерфейса и анимаций framer-motion.

Исправим цвет названий разделов в мобильной версии, чтобы они корректно отображались белым и не перебивались дефолтными стилями браузера или конфликтами Tailwind. Также восстановим правильное отображение плавающей кнопки — вернем glassmorphism и прозрачность, сохранив анимацию компонента.

Отдельно решим проблему читабельности текста в навигации — настроим правильное наложение элементов (z-index, прозрачность или blend), чтобы текст всегда был четко видим поверх анимированной “плашки”.
…
Также разрешим конфликт sticky шапки с framer-motion при открытии правой панели в мобильной версии. Проверим структуру контейнеров и при необходимости изменим архитектуру скролла или трансформаций, чтобы шапка стабильно работала при скролле.

Готовы посмотреть код или репозиторий и быстро внести необходимые правки.

Показать оригинал

Перевести

Добрый день! Разработчик с опытом, сталкивался с чтением чужого кода и очень и очень часто с подобными багами, готов вам помочь как можно быстрее и как можно качественнее)

Показать оригинал

Перевести

Здравствуйте, исправлю сегодня/завтра, у меня есть опыт с React, tailwind css я очень хорошо знаю, motion тоже, это всё как раз мой стек, напишите мне, подтвержу, что есть такой опыт, покажу, что я делал, и исправлю вашу лёгкую ошибку)

Показать оригинал

Перевести

Добрый день! Ознакомился с ТЗ. Могу исправить проблемы с шапкой сайта, стилями в мобильной и десктопной версиях, а также конфликты с framer-motion и Tailwind. Работал с подобными задачами (липкие элементы, анимации, адаптивность), поэтому смогу аккуратно исправить отображение без поломки текущей логики компонентов. Готов приступить в ближайшее время.

Показать оригинал

Перевести

Здравствуйте!

По первому вопросу с синими названиями разделов в шапке на мобильной версии - использую DevTools для анализа проблемы. Скорее всего, поможет добавление класса с повышенным уровнем приоритета для текстовых элементов названий разделов, чтобы перекрыть стили ссылок.

Второй вопрос с плавающей кнопкой решу путем редактирования анимации в Framer Motion. Разберу существующую реализацию и подправлю стили скей и цветов так, чтобы восстановить нужную прозрачность и сохранить физику анимации.

По вопросу плохой читаемости названий разделов - поможет изменение наложения элементов путем коррекции z-index или добавления прозрачности фона активной "таблетки", чтобы текст всегда был сверху.

Последний вопрос с исчезновением шапки при открытии правой панели решу путем изменения архитектуры скролл-контейнера или корректировки анимационных трансформаций в Framer Motion, чтобы они не влияли на поведение position: sticky.
…
Сделаю все максимально быстро и качественно, чтобы ничего не влияло на работоспособность сайта.

Показать оригинал

Перевести

Добрый день!

Ознакомилась с описанием задачи. Понимаю проблемы, которые возникли — большинство из них связаны с конфликтами стилей (Tailwind / дефолтные стили браузера) и особенностями работы анимаций с Framer Motion и CSS-позиционированием.

Могу помочь с исправлением:

• некорректного цвета ссылок в мобильном шапке (конфликт a:link / a:visited или классов Tailwind);
• отображения плавающей кнопки с Framer Motion (восстановление glassmorphism и прозрачности без влияния на анимацию);
• проблемы читаемости навигации в десктопной версии (корректное наложение элементов, z-index, фон активной "плашки");
… • исчезновения sticky-шапки при открытии правой панели в мобильной версии (конфликт sticky с transform / scroll-контейнером).

В работе осторожно исправлю стили и структуру так, чтобы:
• не сломать существующие анимации
• сохранить текущую логику интерфейса
• обеспечить стабильную работу на мобильных и десктопных устройствах.

Готова посмотреть код или репозиторий, чтобы быстро локализовать проблемы и предложить оптимальное решение.

Буду рада помочь!

Показать оригинал

Перевести

Добрый день.

Ознакомился с описанием задачи. Могу помочь с исправлением UI/UX багов в мобильной и десктопной версиях.

Имею опыт работы с адаптивной версткой, CSS и JavaScript, поэтому смогу:
• исправить стили названий разделов в мобильном шапке
• скорректировать отображение плавающей кнопки
• исправить проблему с читаемостью активной вкладки (слои, прозрачность, z-index)
• решить конфликт sticky-шапки с анимацией панели
…
Постараюсь сделать правки аккуратно, чтобы не нарушить существующую логику компонентов и анимаций.

Готов обсудить детали и приступить к работе.

Показать оригинал

Перевести