From 9fa73fc1f56797f27f45ad7b7fccb68b2bfc1663 Mon Sep 17 00:00:00 2001 From: Samuel James Date: Sat, 5 Sep 2026 15:28:37 +0000 Subject: [PATCH] Clean up: Remove component files --- frontend/src/components/TaskList/TaskList.css | 365 ------------------ 1 file changed, 365 deletions(-) delete mode 100644 frontend/src/components/TaskList/TaskList.css diff --git a/frontend/src/components/TaskList/TaskList.css b/frontend/src/components/TaskList/TaskList.css deleted file mode 100644 index 91c6d84..0000000 --- a/frontend/src/components/TaskList/TaskList.css +++ /dev/null @@ -1,365 +0,0 @@ -/* Toolbar: segmented filter tabs on the left, Create Task on the right */ -.list-toolbar { - display: flex; - align-items: center; - justify-content: space-between; - gap: 1rem; - margin-bottom: 1.25rem; -} - -.filter-tabs { - display: inline-flex; - gap: 0.25rem; - padding: 0.25rem; - background-color: #f1f5f9; - border: 1px solid #e2e8f0; - border-radius: 0.625rem; -} - -.filter-tab { - display: inline-flex; - align-items: center; - justify-content: center; - gap: 0.5rem; - padding: 0.5rem 1rem; - border: 1px solid transparent; - border-radius: 0.5rem; - background: none; - font-size: 0.875rem; - font-weight: 500; - font-family: inherit; - color: #6b7280; - cursor: pointer; - transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; - min-height: 44px; -} - -.filter-tab:hover { - color: #334155; - background-color: #e2e8f0; -} - -.filter-tab.active { - background-color: white; - border-color: #e2e8f0; - color: #1e293b; - font-weight: 600; - box-shadow: 0 1px 2px 0 rgba(15, 23, 42, 0.08); -} - -.filter-count { - background-color: #e2e8f0; - color: #334155; - padding: 0 0.5rem; - border-radius: 9999px; - font-size: 0.75rem; - font-weight: 600; - min-width: 1.5rem; - text-align: center; -} - -.filter-count.blocked { - background-color: #fee2e2; - color: #b91c1c; -} - -.filter-tab.active .filter-count { - background-color: #dbeafe; - color: #1d4ed8; -} - -.filter-tab.active .filter-count.blocked { - background-color: #fee2e2; - color: #b91c1c; -} - -/* Guidance for the blocked view, per the blocked-state mockup */ -.blocked-notice { - display: flex; - gap: 0.75rem; - padding: 1rem 1.25rem; - margin-bottom: 1.25rem; - background-color: #fff7ed; - border: 1px solid #fed7aa; - border-radius: 0.5rem; - color: #9a3412; -} - -.blocked-notice-icon { - font-size: 1.25rem; - line-height: 1.4; -} - -.blocked-notice h3 { - font-size: 1rem; - font-weight: 600; - margin-bottom: 0.25rem; -} - -.blocked-notice p { - font-size: 0.875rem; - max-width: 60ch; -} - -/* Task list card */ -.task-list-container { - background-color: white; - border: 1px solid #e2e8f0; - border-radius: 0.5rem; - box-shadow: 0 1px 3px 0 rgba(15, 23, 42, 0.08); - overflow: hidden; -} - -/* Empty states */ -.task-list-empty { - display: flex; - align-items: center; - justify-content: center; - padding: 4rem 2rem; - text-align: center; - background-color: white; - border: 1px solid #e2e8f0; - border-radius: 0.5rem; -} - -.empty-state { - max-width: 26rem; - display: flex; - flex-direction: column; - align-items: center; -} - -.empty-icon { - font-size: 3rem; - margin-bottom: 0.75rem; -} - -.task-list-empty h2 { - font-size: 1.25rem; - font-weight: 600; - color: #1e293b; - margin-bottom: 0.375rem; -} - -.task-list-empty p { - color: #6b7280; - margin-bottom: 1.5rem; -} - -/* Desktop table. Column order matches the approved dashboard mockup, - with an actions column added for edit and delete. */ -.task-table { - width: 100%; -} - -.task-table-header, -.task-row { - display: grid; - grid-template-columns: 108px minmax(0, 2fr) 150px 132px 128px 104px; - gap: 1rem; - padding: 0.75rem 1.25rem; - align-items: center; -} - -.task-table-header { - background-color: #f8fafc; - border-bottom: 1px solid #e2e8f0; - font-weight: 600; - font-size: 0.8125rem; - color: #475569; -} - -.task-table-body { - display: flex; - flex-direction: column; -} - -.task-row { - border-bottom: 1px solid #f1f5f9; - transition: background-color 0.2s; -} - -.task-row:hover { - background-color: #f8fafc; -} - -.task-row:last-child { - border-bottom: none; -} - -.task-cell { - display: flex; - align-items: center; - min-width: 0; -} - -.task-cell.actions { - justify-content: flex-end; -} - -/* Task title */ -.task-title-container { - display: flex; - flex-direction: column; - align-items: flex-start; - gap: 0.125rem; - width: 100%; - min-width: 0; -} - -.task-title-btn, -.task-card-title-btn { - background: none; - border: none; - padding: 0; - text-align: left; - cursor: pointer; - width: 100%; - font-family: inherit; - border-radius: 0.25rem; -} - -.task-title { - font-size: 0.9375rem; - font-weight: 500; - color: #1e293b; - line-height: 1.4; -} - -.task-title-btn:hover .task-title { - color: #1d4ed8; - text-decoration: underline; -} - -.task-description { - font-size: 0.875rem; - color: #6b7280; - line-height: 1.3; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - max-width: 100%; -} - -.task-actions, -.task-actions-mobile { - display: flex; - gap: 0.125rem; -} - -/* Mobile card view */ -.task-cards { - display: flex; - flex-direction: column; - gap: 1rem; -} - -.task-card { - background-color: white; - border: 1px solid #e2e8f0; - border-radius: 0.5rem; - padding: 1rem; - box-shadow: 0 1px 2px 0 rgba(15, 23, 42, 0.05); -} - -.task-card-header { - display: flex; - justify-content: space-between; - align-items: flex-start; - gap: 0.5rem; - margin-bottom: 0.75rem; -} - -.task-meta { - display: flex; - align-items: center; - gap: 0.75rem; - flex-wrap: wrap; -} - -.task-card-title { - font-size: 1rem; - font-weight: 600; - color: #1e293b; - line-height: 1.4; -} - -.task-card-title-btn:hover .task-card-title { - color: #1d4ed8; -} - -.task-card-description { - font-size: 0.875rem; - color: #6b7280; - line-height: 1.4; - margin-top: 0.25rem; -} - -.task-card-footer { - display: flex; - justify-content: space-between; - align-items: center; - gap: 0.75rem; - margin-top: 1rem; - padding-top: 0.75rem; - border-top: 1px solid #f1f5f9; -} - -/* - * One breakpoint decides which view is visible. Both are in the DOM, but - * display:none also removes the hidden one from the accessibility tree, so - * screen readers never hear a task twice. - */ -@media (max-width: 768px) { - .task-table { - display: none; - } - - .task-list-container { - background: none; - border: none; - box-shadow: none; - overflow: visible; - } - - .list-toolbar { - flex-direction: column; - align-items: stretch; - } - - .filter-tabs { - justify-content: space-between; - } - - .filter-tab { - flex: 1; - padding: 0.5rem 0.5rem; - } - - /* Create Task becomes a floating action button, as in the mobile mockup. */ - .create-task-btn { - position: fixed; - bottom: 1.5rem; - right: 1.5rem; - width: 56px; - height: 56px; - padding: 0; - border-radius: 50%; - box-shadow: 0 4px 10px -1px rgba(15, 23, 42, 0.3); - z-index: 20; - } - - .create-task-btn .create-icon { - font-size: 1.75rem; - } - - .create-task-btn .create-text { - display: none; - } -} - -@media (min-width: 769px) { - .task-cards { - display: none; - } -}