docs(todo): add mobile layout optimization task 4 and move bookmarklet to coming soon
This commit is contained in:
1 parent
d5071c8ac9
commit
d5e9354016
1 file changed
+48
-11
@@ -62,7 +62,48 @@
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### 4. 🔌 Пул соединений HTTP (`httpx.AsyncClient` с Keep-Alive)
|
### 4. 📱 Мобильная оптимизация и адаптивная верстка (iPhone 12 / iOS Safari)
|
||||||
|
- [ ] **Системный фундамент iOS и сброс ограничений (Core Foundation)**:
|
||||||
|
- Метатег `viewport`: добавить `viewport-fit=cover` для поддержки челки и нижней панели iPhone.
|
||||||
|
- Устранение бага принудительного авто-зума: установить `font-size: 16px` для `<input>`, `<textarea>`, `<select>` на экранах `≤ 768px` (сохраняя компактные внутренние отступы).
|
||||||
|
- Замена `100vh` на динамические единицы `100dvh` (Dynamic Viewport Height) для модальных окон, оверлеев и экрана авторизации.
|
||||||
|
- Добавление безопасных отступов `env(safe-area-inset-top)` и `env(safe-area-inset-bottom)`.
|
||||||
|
- Предотвращение горизонтального скролла (`overflow-x: hidden` на уровне контейнера приложения).
|
||||||
|
- [ ] **Мобильная навигация: переход к нативному паттерну (App Header + Bottom Tab Bar)**:
|
||||||
|
- Компактная верхняя шапка: логотип `📖 Notes`, переключатель темы `🌓`, кнопка вызова профиля/действий.
|
||||||
|
- Фиксированная нижняя панель вкладок (Bottom Tab Bar) с нативным iOS UX:
|
||||||
|
1. 🔍 **Словарь** (Поиск и словарь)
|
||||||
|
2. 🎓 **Тренажёр** (SRS с бейджем количества повторений)
|
||||||
|
3. 📚 **Читалка** (Библиотека книг)
|
||||||
|
4. 📊 **Прогресс** (Статистика и стрик)
|
||||||
|
5. ⚙️ **Меню** (Смена пароля, экспорт, выход)
|
||||||
|
- Сохранение текущей десктопной строки без изменений на больших экранах (`> 768px`).
|
||||||
|
- [ ] **Адаптация экрана словаря и карточек (Dictionary & Cards View)**:
|
||||||
|
- Поле поиска/перевода на полную ширину экрана с удобной сенсорной кнопкой «Перевести».
|
||||||
|
- Скрытие неактуальных десктопных подсказок горячих клавиш (`<kbd>Ctrl+Enter</kbd>`) на мобильных устройствах.
|
||||||
|
- Вертикальная раскладка полей метаданных при редактировании карточки (папка, теги, заметка).
|
||||||
|
- Горизонтальный скролл чипсов коллекций и тегов (`overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch`) вместо многострочного переноса.
|
||||||
|
- Увеличенные зоны нажатия (Touch Targets ≥ 44px) для кнопок действий над карточкой (удаление, редактирование, озвучка).
|
||||||
|
- [ ] **Интерактивная читалка и переход к Mobile Bottom Sheet**:
|
||||||
|
- Трансформация всплывающего попапа перевода (`reader-word-popup`) в нативную выдвижную нижнюю шторку (Bottom Sheet) на смартфонах:
|
||||||
|
- Заголовок с термином, транскрипцией и бейджем `⭐ В библиотеке`.
|
||||||
|
- Блок перевода и контекстной цитаты книги.
|
||||||
|
- Большая кнопка «💾 Добавить в словарь» под большой палец.
|
||||||
|
- Исключение вылетов за границы экрана и перекрытия текста пальцем.
|
||||||
|
- Двухстрочный адаптивный тулбар читалки (навигация по главам + размер шрифта `A-/A+` и подсветка).
|
||||||
|
- Сетка библиотеки `bookshelf-grid` в одну колонку на экранах `≤ 640px`.
|
||||||
|
- [ ] **Тренажёр интервальных повторений (SRS Trainer)**:
|
||||||
|
- Ограничение высоты карточки SRS (`max-height: 48dvh`), чтобы карточка и кнопки оценки гарантированно помещались без вертикального скролла на 390px.
|
||||||
|
- Кнопки оценки (Снова / Трудно / Хорошо / Легко) в сетку 2×2 с высотой от 50px и четкими цветовыми акцентами.
|
||||||
|
- Вертикальный список вариантов в режиме квиза (4 варианта) на всю ширину экрана.
|
||||||
|
- [ ] **Модальные окна (Статистика, Пароль, Экспорт)**:
|
||||||
|
- Метрики статистики в сетку 2×2 вместо сжатых 4 колонок.
|
||||||
|
- Плавный горизонтальный скролл календаря активности (Heatmap).
|
||||||
|
- Разворачивание модальных окон в адаптивный мобильный слой с удобной кнопкой закрытия.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 5. 🔌 Пул соединений HTTP (`httpx.AsyncClient` с Keep-Alive)
|
||||||
- [ ] В [`app/dictionary.py`](file:///home/ai-projects/services/study.qpid.pro/app/dictionary.py) создать синглтон-клиент `get_http_client()` с пулом соединений:
|
- [ ] В [`app/dictionary.py`](file:///home/ai-projects/services/study.qpid.pro/app/dictionary.py) создать синглтон-клиент `get_http_client()` с пулом соединений:
|
||||||
```python
|
```python
|
||||||
limits = httpx.Limits(max_keepalive_connections=10, max_connections=20)
|
limits = httpx.Limits(max_keepalive_connections=10, max_connections=20)
|
||||||
@@ -72,7 +113,7 @@
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### 5. 🗄️ Тюнинг SQLite PRAGMA и составных индексов
|
### 6. 🗄️ Тюнинг SQLite PRAGMA и составных индексов
|
||||||
- [ ] В [`app/database.py`](file:///home/ai-projects/services/study.qpid.pro/app/database.py):
|
- [ ] В [`app/database.py`](file:///home/ai-projects/services/study.qpid.pro/app/database.py):
|
||||||
- Вынести `PRAGMA journal_mode=WAL;` в `init_db()` (убрать избыточный вызов при каждом запросе).
|
- Вынести `PRAGMA journal_mode=WAL;` в `init_db()` (убрать избыточный вызов при каждом запросе).
|
||||||
- Включить параметры производительности памяти Linux:
|
- Включить параметры производительности памяти Linux:
|
||||||
@@ -85,13 +126,13 @@
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### 6. ✂️ Де-блоатинг внешних парсеров (YAGNI)
|
### 7. ✂️ Де-блоатинг внешних парсеров (YAGNI)
|
||||||
- [ ] Удалить лишний сетевой опрос Datamuse (`fetch_datamuse`) — он дублирует определения и перегружает ответ нерелевантными рифмами.
|
- [ ] Удалить лишний сетевой опрос Datamuse (`fetch_datamuse`) — он дублирует определения и перегружает ответ нерелевантными рифмами.
|
||||||
- [ ] Упростить хрупкий regex-парсинг разметки Wikitext, опираясь на стабильные REST JSON эндпоинты.
|
- [ ] Упростить хрупкий regex-парсинг разметки Wikitext, опираясь на стабильные REST JSON эндпоинты.
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### 7. 📚 Локальный оффлайн-словарь (99%+ покрытия со словоформами, SQLite 10–20 МБ)
|
### 8. 📚 Локальный оффлайн-словарь (99%+ покрытия со словоформами, SQLite 10–20 МБ)
|
||||||
- [ ] Создать в SQLite таблицу:
|
- [ ] Создать в SQLite таблицу:
|
||||||
```sql
|
```sql
|
||||||
CREATE TABLE IF NOT EXISTS offline_dictionary (
|
CREATE TABLE IF NOT EXISTS offline_dictionary (
|
||||||
@@ -113,7 +154,7 @@
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### 8. 🧩 Модульность фронтенда на нативных ES-модулях (без Webpack/Vite)
|
### 9. 🧩 Модульность фронтенда на нативных ES-модулях (без Webpack/Vite)
|
||||||
- [ ] Перевести [`app/static/js/app.js`](file:///home/ai-projects/services/study.qpid.pro/app/static/js/app.js) на нативный браузерный синтаксис `<script type="module">`.
|
- [ ] Перевести [`app/static/js/app.js`](file:///home/ai-projects/services/study.qpid.pro/app/static/js/app.js) на нативный браузерный синтаксис `<script type="module">`.
|
||||||
- [ ] Выделить модули с нативным `import/export`:
|
- [ ] Выделить модули с нативным `import/export`:
|
||||||
- `modules/reader.js` — читалку, блок-парсер и навигацию по главам.
|
- `modules/reader.js` — читалку, блок-парсер и навигацию по главам.
|
||||||
@@ -122,16 +163,12 @@
|
|||||||
- `modules/ui.js` — тосты, модальные окна, темы оформления.
|
- `modules/ui.js` — тосты, модальные окна, темы оформления.
|
||||||
- [ ] Сохранить полное отсутствие внешних сборщиков (0 npm-пакетов, чистая платформа).
|
- [ ] Сохранить полное отсутствие внешних сборщиков (0 npm-пакетов, чистая платформа).
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### 9. 🌐 Быстрый захват из браузера (Bookmarklet)
|
|
||||||
- [ ] Создать JavaScript-букмарклет для добавления слова/фразы из любого окна браузера в личный словарь [`study.qpid.pro`](https://study.qpid.pro).
|
|
||||||
|
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## ⏳ Coming Soon
|
## ⏳ Coming Soon
|
||||||
|
|
||||||
|
- [ ] **🌐 Быстрый захват из браузера (Bookmarklet)**:
|
||||||
|
- Создать JavaScript-букмарклет для добавления слова/фразы из любого окна браузера в личный словарь [`study.qpid.pro`](https://study.qpid.pro) (низший приоритет).
|
||||||
- [ ] **Нативная автономная озвучка (HTML5 Web Speech API / `speechSynthesis`)**:
|
- [ ] **Нативная автономная озвучка (HTML5 Web Speech API / `speechSynthesis`)**:
|
||||||
- Использовать встроенный в браузер синтезатор речи `window.speechSynthesis` (en-US, en-GB).
|
- Использовать встроенный в браузер синтезатор речи `window.speechSynthesis` (en-US, en-GB).
|
||||||
- 0 сетевых запросов к серверу, 100% оффлайн-работа.
|
- 0 сетевых запросов к серверу, 100% оффлайн-работа.
|
||||||
|
|||||||
Reference in new issue
Block a user