5.11.0: Кнопки +/- для прогрессии в TaskDetail

VERSION

@@ -1 +1 @@
-5.10.2
+5.11.0

play-life-web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "play-life-web",
-  "version": "5.10.2",
+  "version": "5.11.0",
   "type": "module",
   "scripts": {
     "dev": "vite",

play-life-web/src/components/TaskDetail.css

@@ -169,13 +169,27 @@
   margin-bottom: 0.5rem;
 }
 
+.progression-input-wrapper {
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+
 .progression-input {
   width: 100%;
   padding: 0.75rem;
+  padding-right: 4.5rem;
   border: 1px solid #d1d5db;
   border-radius: 0.375rem;
   font-size: 1rem;
   box-sizing: border-box;
+  -moz-appearance: textfield;
+}
+
+.progression-input::-webkit-outer-spin-button,
+.progression-input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
 }
 
 .progression-input:focus {
@@ -184,6 +198,48 @@
   box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
 }
 
+.progression-controls-capsule {
+  position: absolute;
+  right: 0.375rem;
+  display: flex;
+  background: #f3f4f6;
+  border-radius: 9999px;
+  overflow: hidden;
+  flex-shrink: 0;
+}
+
+.progression-control-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 1.75rem;
+  height: 1.75rem;
+  border: none;
+  background: transparent;
+  font-size: 1rem;
+  font-weight: 500;
+  color: #6b7280;
+  cursor: pointer;
+  transition: background 0.2s, color 0.2s;
+}
+
+.progression-control-btn:hover {
+  background: #e5e7eb;
+  color: #374151;
+}
+
+.progression-control-btn:active {
+  background: #d1d5db;
+}
+
+.progression-control-minus {
+  border-right: 1px solid #eeeff1;
+}
+
+.progression-control-plus {
+  border-left: 1px solid #eeeff1;
+}
+
 .task-detail-divider {
   height: 1px;
   background: #e5e7eb;

play-life-web/src/components/TaskDetail.jsx

@@ -808,6 +808,7 @@ function TaskDetail({ taskId, onClose, onRefresh, onTaskCompleted, onNavigate })
               {hasProgression && (
                 <div className="progression-section">
                   <label className="progression-label">Значение прогрессии</label>
+                  <div className="progression-input-wrapper">
                     <input
                       type="number"
                       step="any"
@@ -816,6 +817,31 @@ function TaskDetail({ taskId, onClose, onRefresh, onTaskCompleted, onNavigate })
                       placeholder={task.progression_base?.toString() || ''}
                       className="progression-input"
                     />
+                    <div className="progression-controls-capsule">
+                      <button
+                        type="button"
+                        className="progression-control-btn progression-control-minus"
+                        onClick={() => {
+                          const current = parseFloat(progressionValue) || 0
+                          const step = task.progression_base || 1
+                          setProgressionValue((current - step).toString())
+                        }}
+                      >
+                        −
+                      </button>
+                      <button
+                        type="button"
+                        className="progression-control-btn progression-control-plus"
+                        onClick={() => {
+                          const current = parseFloat(progressionValue) || 0
+                          const step = task.progression_base || 1
+                          setProgressionValue((current + step).toString())
+                        }}
+                      >
+                        +
+                      </button>
+                    </div>
+                  </div>
                 </div>
               )}