4.4.0: Улучшения UI детализации задачи
All checks were successful
Build and Push Docker Image / build-and-push (push) Successful in 1m0s
All checks were successful
Build and Push Docker Image / build-and-push (push) Successful in 1m0s
This commit is contained in:
poignatov
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "play-life-web",
|
||||
"version": "4.3.0",
|
||||
"version": "4.4.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
|
||||
@@ -199,7 +199,7 @@
|
||||
.task-actions-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.375rem;
|
||||
gap: 0.125rem;
|
||||
}
|
||||
|
||||
.task-actions-bottom {
|
||||
@@ -212,10 +212,12 @@
|
||||
.task-action-left {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.complete-at-end-of-day-checkbox {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.complete-at-end-of-day-checkbox .checkbox-label {
|
||||
@@ -257,9 +259,11 @@
|
||||
}
|
||||
|
||||
.task-action-complete-buttons {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
gap: 0.25rem;
|
||||
align-items: stretch;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.action-button {
|
||||
@@ -290,19 +294,19 @@
|
||||
}
|
||||
|
||||
.action-button-check {
|
||||
width: calc(0.75rem * 2 + 1rem + 0.125rem * 2);
|
||||
min-width: calc(0.75rem * 2 + 1rem);
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
height: calc(0.75rem * 2 + 1rem + 0.125rem * 2);
|
||||
padding: 0.75rem;
|
||||
flex-shrink: 0;
|
||||
padding: 0.75rem 1.5rem;
|
||||
box-sizing: border-box;
|
||||
background: linear-gradient(to right, #10b981, #059669);
|
||||
background: linear-gradient(to right, #6366f1, #8b5cf6);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.action-button-check:hover:not(:disabled) {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
|
||||
box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
|
||||
}
|
||||
|
||||
.action-button-double-check {
|
||||
@@ -327,13 +331,21 @@
|
||||
.action-button-save {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
background: linear-gradient(to right, #10b981, #059669);
|
||||
}
|
||||
|
||||
.action-button-save:hover:not(:disabled) {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
|
||||
}
|
||||
|
||||
|
||||
.next-task-date-info {
|
||||
font-size: 0.875rem;
|
||||
color: #6b7280;
|
||||
text-align: right;
|
||||
text-align: left;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
.next-task-date-bold {
|
||||
|
||||
@@ -837,52 +837,7 @@ function TaskDetail({ taskId, onClose, onRefresh, onTaskCompleted, onNavigate })
|
||||
|
||||
{/* Кнопки действий */}
|
||||
<div className="task-actions-section">
|
||||
<div className="task-actions-buttons">
|
||||
{/* Левая часть: кнопка "Сохранить" */}
|
||||
<div className="task-action-left">
|
||||
<button
|
||||
onClick={handleSave}
|
||||
disabled={isSaving || !canComplete}
|
||||
className="action-button action-button-save"
|
||||
title={!canComplete && wishlistInfo ? 'Желание не разблокировано' : ''}
|
||||
>
|
||||
{isSaving ? 'Сохранение...' : 'Сохранить'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Правая часть: кнопки выполнения */}
|
||||
<div className="task-action-complete-buttons">
|
||||
{/* Кнопка с одинарной галочкой */}
|
||||
<button
|
||||
onClick={handleComplete}
|
||||
disabled={isCompleting || !canComplete}
|
||||
className="action-button action-button-check"
|
||||
title={!canComplete && wishlistInfo ? 'Желание не разблокировано' : 'Выполнить'}
|
||||
>
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M13.5 4L6 11.5L2.5 8" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
{/* Кнопка с двойной галочкой (только для повторяющихся задач) */}
|
||||
{!isOneTime && (
|
||||
<button
|
||||
onClick={handleCompleteFinally}
|
||||
disabled={isCompleting || !canComplete}
|
||||
className="action-button action-button-double-check"
|
||||
title="Выполнить окончательно"
|
||||
>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round">
|
||||
<path d="M20 6L9 17l-5-5"/>
|
||||
<path d="M20 12L9 23l-5-5"/>
|
||||
</svg>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Чекбокс и дата на одной линии */}
|
||||
<div className="task-actions-bottom">
|
||||
{/* Чекбокс над кнопками */}
|
||||
<div className="complete-at-end-of-day-checkbox">
|
||||
<label className="checkbox-label">
|
||||
<input
|
||||
@@ -898,13 +853,40 @@ function TaskDetail({ taskId, onClose, onRefresh, onTaskCompleted, onNavigate })
|
||||
<span>Выполнить в конце дня</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="task-actions-buttons">
|
||||
{/* Левая часть: кнопка "Выполнить" */}
|
||||
<div className="task-action-left">
|
||||
<button
|
||||
onClick={handleComplete}
|
||||
disabled={isCompleting || !canComplete}
|
||||
className="action-button action-button-check"
|
||||
title={!canComplete && wishlistInfo ? 'Желание не разблокировано' : 'Выполнить'}
|
||||
>
|
||||
Выполнить
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Правая часть: кнопка "Сохранить" */}
|
||||
<div className="task-action-complete-buttons">
|
||||
<button
|
||||
onClick={handleSave}
|
||||
disabled={isSaving || !canComplete}
|
||||
className="action-button action-button-save"
|
||||
title={!canComplete && wishlistInfo ? 'Желание не разблокировано' : ''}
|
||||
>
|
||||
{isSaving ? 'Сохранение...' : 'Сохранить'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Дата слева */}
|
||||
{!isOneTime && nextTaskDate && (
|
||||
<div className="next-task-date-info">
|
||||
<span className="next-task-date-bold">{nextTaskDate}</span>
|
||||
Следующая: <span className="next-task-date-bold">{nextTaskDate}</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user