65 lines
1.5 KiB
Markdown
65 lines
1.5 KiB
Markdown
# 🔧 Исправление "прыгания" комментариев
|
||
|
||
## Проблема:
|
||
При нажатии на поле ввода комментария окно "прыгает" вверх
|
||
|
||
## Причина:
|
||
Мобильная клавиатура меняет высоту viewport
|
||
|
||
## ✅ Решение:
|
||
|
||
### 1. Фиксация viewport
|
||
Добавлено в `index.html`:
|
||
```html
|
||
<meta name="viewport" content="... viewport-fit=cover" />
|
||
```
|
||
|
||
### 2. Фиксация body
|
||
```css
|
||
html, body {
|
||
position: fixed;
|
||
overflow: hidden;
|
||
}
|
||
#root {
|
||
position: fixed;
|
||
overflow-y: auto;
|
||
}
|
||
```
|
||
|
||
### 3. Оптимизация модалки
|
||
- Уменьшена высота до 60vh
|
||
- Добавлен `margin-bottom: 80px`
|
||
- Форма `position: sticky`
|
||
- Предотвращение прыжков при focus
|
||
|
||
---
|
||
|
||
## 📝 Изменённые файлы:
|
||
|
||
1. `frontend/index.html` - viewport и стили body
|
||
2. `frontend/src/components/CommentsModal.css` - sticky форма
|
||
|
||
---
|
||
|
||
## 📤 Загрузить:
|
||
|
||
```bash
|
||
# НА КОМПЬЮТЕРЕ
|
||
cd /Users/glpshchn/Desktop/nakama
|
||
|
||
scp frontend/index.html root@ваш_IP:/var/www/nakama/frontend/
|
||
scp frontend/src/components/CommentsModal.css root@ваш_IP:/var/www/nakama/frontend/src/components/
|
||
|
||
# НА СЕРВЕРЕ
|
||
ssh root@ваш_IP
|
||
cd /var/www/nakama/frontend
|
||
npm run build
|
||
```
|
||
|
||
---
|
||
|
||
## ✅ После обновления:
|
||
|
||
Комментарии больше не будут прыгать при фокусе на поле ввода!
|
||
|