Первоначальный коммит

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 17:01:36 +03:00
commit bad198ce29
217 changed files with 57075 additions and 0 deletions
--- a/play-life-web/src/components/BoardSelector.css
+++ b/play-life-web/src/components/BoardSelector.css
@@ -0,0 +1,261 @@
+.board-selector {
+  position: relative;
+  max-width: 42rem;
+  margin: 0 auto;
+  padding-top: 0;
+  padding-bottom: 16px;
+}
+
+/* Дополнительный отступ сверху на больших экранах, чтобы соответствовать кнопке "Добавить" на экране задач */
+@media (min-width: 768px) {
+  .board-selector {
+    margin-top: 0.5rem; /* 8px - разница между md:p-8 (32px) и md:p-6 (24px) */
+  }
+}
+
+.board-header {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+}
+
+/* Основная кнопка-pill */
+.board-pill {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  height: 52px;
+  padding: 0 20px;
+  background: white;
+  border: 1px solid #e5e7eb;
+  border-radius: 26px;
+  font-size: 17px;
+  font-weight: 500;
+  color: #1f2937;
+  cursor: pointer;
+  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.board-pill:hover:not(:disabled) {
+  border-color: #6366f1;
+  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
+  transform: translateY(-1px);
+}
+
+.board-pill:active:not(:disabled) {
+  transform: translateY(0);
+}
+
+.board-pill.open {
+  border-color: #6366f1;
+  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
+}
+
+.board-pill:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.shared-icon {
+  font-size: 16px;
+  flex-shrink: 0;
+}
+
+.board-label {
+  flex: 1;
+  text-align: left;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.chevron {
+  color: #9ca3af;
+  flex-shrink: 0;
+  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.chevron.rotated {
+  transform: rotate(180deg);
+}
+
+/* Кнопка действия (настройки/выход) */
+.board-action-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 52px;
+  height: 52px;
+  padding: 0;
+  background: white;
+  border: 1px solid #e5e7eb;
+  border-radius: 50%;
+  cursor: pointer;
+  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+  color: #6b7280;
+  flex-shrink: 0;
+}
+
+.board-action-btn:hover {
+  background: #f9fafb;
+  color: #374151;
+  border-color: #6366f1;
+  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
+  transform: translateY(-1px);
+}
+
+.board-action-btn:active {
+  transform: translateY(0);
+}
+
+.board-action-btn svg {
+  width: 22px;
+  height: 22px;
+}
+
+/* Выпадающий список */
+.board-dropdown {
+  position: absolute;
+  top: calc(100% + 4px);
+  left: 0;
+  right: 0;
+  background: white;
+  border-radius: 18px;
+  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 10px rgba(0, 0, 0, 0.08);
+  z-index: 100;
+  overflow: hidden;
+  opacity: 0;
+  visibility: hidden;
+  transform: translateY(-8px) scale(0.98);
+  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.board-dropdown.visible {
+  opacity: 1;
+  visibility: visible;
+  transform: translateY(0) scale(1);
+}
+
+.dropdown-content {
+  padding: 10px;
+}
+
+.dropdown-list {
+  max-height: 280px;
+  overflow-y: auto;
+}
+
+.dropdown-empty {
+  padding: 28px 16px;
+  text-align: center;
+  color: #9ca3af;
+  font-size: 15px;
+}
+
+/* Элементы списка */
+.dropdown-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  padding: 14px 16px;
+  border: none;
+  background: transparent;
+  border-radius: 12px;
+  font-size: 16px;
+  cursor: pointer;
+  transition: all 0.15s ease;
+  text-align: left;
+  color: #374151;
+}
+
+.dropdown-item:hover {
+  background: #f3f4f6;
+}
+
+.dropdown-item.selected {
+  background: linear-gradient(135deg, #667eea10 0%, #764ba210 100%);
+  color: #4f46e5;
+}
+
+.dropdown-item.selected:hover {
+  background: linear-gradient(135deg, #667eea18 0%, #764ba218 100%);
+}
+
+.item-name {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-weight: 500;
+}
+
+.item-meta {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex-shrink: 0;
+}
+
+.item-badge {
+  font-size: 14px;
+}
+
+.item-members {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 26px;
+  height: 26px;
+  padding: 0 8px;
+  border-radius: 13px;
+  font-size: 13px;
+  font-weight: 600;
+  border: none;
+  box-shadow: none;
+  box-sizing: border-box;
+  -webkit-appearance: none;
+  appearance: none;
+}
+
+.item-members.filled {
+  background: #e5e7eb;
+  color: #6b7280;
+}
+
+.item-members.outline {
+  background: transparent !important;
+  border: 1px solid #e5e7eb !important;
+  border-image: none !important;
+  outline: none !important;
+  box-shadow: none !important;
+  -webkit-box-shadow: none !important;
+  color: #6b7280 !important;
+}
+
+.check-icon {
+  color: #4f46e5;
+}
+
+/* Кнопка добавления доски */
+.dropdown-item.add-board {
+  margin-top: 6px;
+  padding-top: 14px;
+  border-top: 1px solid #f3f4f6;
+  border-radius: 0 0 12px 12px;
+  color: #667eea;
+  font-weight: 500;
+  gap: 12px;
+  justify-content: flex-start;
+}
+
+.dropdown-item.add-board:hover {
+  background: linear-gradient(135deg, #667eea08 0%, #764ba208 100%);
+}
+
+.dropdown-item.add-board svg {
+  flex-shrink: 0;
+  width: 20px;
+  height: 20px;
+}