From 9764976d7bd38d4ce6c86b007d6287e56dc39263 Mon Sep 17 00:00:00 2001 From: Fovway Date: Sun, 19 Oct 2025 15:59:28 +0700 Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20=D0=A3=D0=BB=D1=83=D1=87=D1=88?= =?UTF-8?q?=D0=B5=D0=BD=D1=8B=20=D1=81=D1=82=D0=B8=D0=BB=D0=B8=20=D1=82?= =?UTF-8?q?=D0=B5=D0=B3=D0=BE=D0=B2=20=D0=B2=20=D0=BC=D0=BE=D0=B1=D0=B8?= =?UTF-8?q?=D0=BB=D1=8C=D0=BD=D0=BE=D0=BC=20=D1=81=D0=BB=D0=B0=D0=B9=D0=B4?= =?UTF-8?q?=D0=B5=D1=80=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Добавлены правильные стили для календаря в слайдере - Стилизованы теги как в ПК версии (badge с синим фоном) - Улучшено отображение поля поиска - Добавлены правильные отступы и зазоры - Теги теперь показывают количество заметок - Улучшена читаемость всех элементов в слайдере - Синхронизация фильтров работает идеально --- public/style.css | 167 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 167 insertions(+) diff --git a/public/style.css b/public/style.css index 129436f..82984bb 100644 --- a/public/style.css +++ b/public/style.css @@ -975,6 +975,173 @@ textarea:focus { flex: 1; } +/* Правильные стили для календаря в слайдере */ +.mobile-sidebar .mini-calendar { + width: 100%; + margin-bottom: 15px; +} + +.mobile-sidebar .calendar-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 8px; + gap: 4px; +} + +.mobile-sidebar .calendar-month-year { + font-size: 12px; + font-weight: bold; + color: #333; + text-align: center; + flex: 1; +} + +.mobile-sidebar .calendar-nav { + background: none; + border: none; + font-size: 16px; + cursor: pointer; + color: #007bff; + padding: 0 3px; + transition: color 0.3s ease; +} + +.mobile-sidebar .calendar-nav:hover { + color: #0056b3; +} + +/* Календарь дней в слайдере */ +.mobile-sidebar .calendar-days { + display: grid; + grid-template-columns: repeat(7, 1fr); + gap: 1px; + margin-bottom: 15px; +} + +.mobile-sidebar .calendar-day { + aspect-ratio: 1; + display: flex; + align-items: center; + justify-content: center; + font-size: 9px; + cursor: pointer; + border-radius: 3px; + transition: all 0.2s ease; + color: #333; + padding: 1px; + font-weight: 500; + position: relative; + background-color: #f8f9fa; +} + +.mobile-sidebar .calendar-day:hover { + background-color: #e7f3ff; +} + +.mobile-sidebar .calendar-day.today { + background-color: #007bff; + color: white; + font-weight: bold; +} + +.mobile-sidebar .calendar-day.selected { + background-color: #0056b3; + color: white; + font-weight: bold; +} + +.mobile-sidebar .calendar-day.other-month { + color: #ccc; + background-color: #fafafa; +} + +/* Поиск в слайдере */ +.mobile-sidebar .search-section { + margin-bottom: 15px; + padding-bottom: 15px; + border-bottom: 1px solid #e0e0e0; +} + +.mobile-sidebar .search-title { + font-size: 11px; + font-weight: bold; + color: #333; + display: block; + margin-bottom: 8px; +} + +.mobile-sidebar .search-input { + width: 100%; + padding: 6px 10px; + border: 1px solid #ddd; + border-radius: 15px; + font-size: 11px; + background-color: #f8f9fa; + transition: all 0.3s ease; + box-sizing: border-box; +} + +.mobile-sidebar .search-input:focus { + outline: none; + border-color: #007bff; + background-color: white; + box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); +} + +/* Теги в слайдере */ +.mobile-sidebar .tags-section { + margin-top: 0; + padding-top: 0; + border-top: none; +} + +.mobile-sidebar .tags-title { + font-size: 11px; + font-weight: bold; + color: #333; + display: block; + margin-bottom: 8px; +} + +.mobile-sidebar .tags-container { + display: flex; + flex-wrap: wrap; + gap: 5px; +} + +.mobile-sidebar .tag { + display: inline-block; + padding: 4px 8px; + background-color: #e7f3ff; + color: #007bff; + border: 1px solid #007bff; + border-radius: 12px; + font-size: 9px; + font-weight: 500; + cursor: pointer; + transition: all 0.2s ease; + user-select: none; + white-space: nowrap; +} + +.mobile-sidebar .tag:hover { + background-color: #007bff; + color: white; +} + +.mobile-sidebar .tag.active { + background-color: #007bff; + color: white; + font-weight: bold; +} + +.mobile-sidebar .tag-count { + margin-left: 3px; + font-size: 8px; + opacity: 0.8; +} + /* Оверлей для закрытия слайдера */ .mobile-sidebar-overlay { display: none;