football2801
91b148c271
CI / test (push) Has been cancelled
Symptom: clicking + Add time would insert the new entry sorted into
the list, hiding it among the existing rows. Editing an existing
row's hour/minute/AM-PM moved the row mid-keystroke.
Both behaviors made the user lose track of what they were editing.
The list now only sorts at save time (which the backend already
canonicalizes via setWakeTimes()). New entries land at the end,
edits stay in place. Two regression tests pin this:
- + Add appends; the new row is the last DOM row even when its
minutes-of-day are smaller than an existing entry.
- Editing a row's hour from 9 to 1 keeps the row at the same
index (would have moved to index 0 under the old sort-on-edit).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2 lines
12 KiB
CSS
2 lines
12 KiB
CSS
.frame-card[data-v-608d39a4]{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--duration-fast);position:relative;overflow:hidden}.frame-card--ok[data-v-608d39a4]{border-color:var(--color-border)}.frame-card--sync-fail[data-v-608d39a4]{border-color:#c49a20}.frame-card--offline[data-v-608d39a4]{border-color:#c0392b}.frame-card__settings-btn[data-v-608d39a4]{top:var(--space-2);right:var(--space-2);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);width:36px;height:36px;color:var(--color-text);cursor:pointer;z-index:1;background:#ffffffd9;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;box-shadow:0 1px 4px #00000026}.frame-card__status-line[data-v-608d39a4]{font-size:var(--text-sm);align-items:center;gap:6px;font-weight:600;display:flex}.frame-card--ok .frame-card__status-line[data-v-608d39a4]{color:#1a7f4b}.frame-card--sync-fail .frame-card__status-line[data-v-608d39a4]{color:#8a6a00}.frame-card--offline .frame-card__status-line[data-v-608d39a4]{color:#c0392b}.frame-card__status-dot[data-v-608d39a4]{border-radius:50%;flex-shrink:0;width:8px;height:8px}.frame-card--ok .frame-card__status-dot[data-v-608d39a4]{background:#1a7f4b}.frame-card--sync-fail .frame-card__status-dot[data-v-608d39a4]{background:#c49a20}.frame-card--offline .frame-card__status-dot[data-v-608d39a4]{background:#c0392b}.frame-card__sync-line[data-v-608d39a4]{font-size:var(--text-xs);color:var(--color-text-muted);flex-wrap:wrap;gap:0 6px;margin-top:2px;display:flex}.frame-card__sync-sep[data-v-608d39a4]{opacity:.6}.frame-card--large[data-v-608d39a4]{flex-direction:column;height:100%;display:flex}.frame-card--large .frame-card__preview[data-v-608d39a4]{background:var(--color-surface-2);flex:none;justify-content:center;align-items:center;max-height:40dvh;display:flex;overflow:hidden}.frame-card--large .frame-card__img[data-v-608d39a4]{width:auto;max-width:100%;height:auto;max-height:100%;display:block}.frame-card--large .frame-card__empty-preview[data-v-608d39a4]{color:var(--color-text-muted);opacity:.5;justify-content:center;align-items:center;width:100%;display:flex}.frame-card--large .frame-card__body[data-v-608d39a4]{min-height:0;padding:var(--space-4);gap:var(--space-3);flex-direction:column;flex:1;display:flex}.frame-card--large .frame-card__info[data-v-608d39a4]{flex-direction:column;gap:2px;min-width:0;display:flex}.frame-card--large .frame-card__name[data-v-608d39a4]{font-size:var(--text-md);font-weight:700}.frame-card--large .frame-card__add-btn[data-v-608d39a4]{width:100%;margin-top:auto}.frame-card--compact[data-v-608d39a4]{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);display:flex}.frame-card--compact .frame-card__preview[data-v-608d39a4]{border-radius:var(--radius-sm);background:var(--color-surface-2);flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;display:flex;overflow:hidden}.frame-card--compact .frame-card__img[data-v-608d39a4]{object-fit:cover;width:100%;height:100%}.frame-card--compact .frame-card__empty-preview[data-v-608d39a4]{color:var(--color-text-muted);opacity:.4}.frame-card--compact .frame-card__body[data-v-608d39a4]{justify-content:space-between;align-items:center;gap:var(--space-2);flex:1;min-width:0;display:flex}.frame-card--compact .frame-card__info[data-v-608d39a4]{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.frame-card--compact .frame-card__name[data-v-608d39a4]{font-size:var(--text-base);font-weight:700}.frame-card--compact .frame-card__count[data-v-608d39a4]{font-size:var(--text-xs);color:var(--color-text-muted)}.frame-card__add-btn[data-v-608d39a4]{flex-shrink:0}@media (orientation:landscape) and (height<=600px){.frame-card--large .frame-card__preview[data-v-608d39a4]{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;overflow:hidden}.frame-card--large .frame-card__img[data-v-608d39a4]{object-fit:contain;width:100%;height:100%}.frame-card--large .frame-card__body[data-v-608d39a4]{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);flex-direction:row;flex:none}.frame-card--large .frame-card__info[data-v-608d39a4]{flex:1;min-width:0}.frame-card--large .frame-card__sync-line[data-v-608d39a4]{display:none}.frame-card--large .frame-card__add-btn[data-v-608d39a4]{flex-shrink:0;width:auto;margin-top:0}.frame-card--large .frame-card__settings-btn[data-v-608d39a4]{width:32px;height:32px;top:var(--space-1);right:var(--space-1)}}.input-wrap[data-v-c8235ab2]{width:100%;position:relative}.input-wrap__field[data-v-c8235ab2]{width:100%;min-height:56px;padding:22px var(--space-4) 8px;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);font-family:var(--font-family);font-size:var(--text-base);transition:border-color var(--duration-fast)}.input-wrap__field[data-v-c8235ab2]::placeholder{color:#0000}.input-wrap__field[data-v-c8235ab2]:focus{border-color:var(--color-primary);outline:none}.input-wrap__field:not(:placeholder-shown)~.input-wrap__label[data-v-c8235ab2],.input-wrap__field:focus~.input-wrap__label[data-v-c8235ab2]{font-size:var(--text-xs);color:var(--color-primary);top:8px;transform:none}.input-wrap__label[data-v-c8235ab2]{left:var(--space-4);color:var(--color-text-muted);font-size:var(--text-base);pointer-events:none;transition:top var(--duration-fast), font-size var(--duration-fast), color var(--duration-fast), transform var(--duration-fast);position:absolute;top:50%;transform:translateY(-50%)}.input-wrap--error .input-wrap__field[data-v-c8235ab2]{border-color:var(--color-destructive)}.input-wrap__error[data-v-c8235ab2]{margin-top:var(--space-1);padding-left:var(--space-4);font-size:var(--text-sm);color:var(--color-destructive)}.orientation-picker[data-v-679dae08]{gap:var(--space-3);grid-template-columns:repeat(2,1fr);display:grid}.orientation-opt[data-v-679dae08]{align-items:center;gap:var(--space-1);padding:var(--space-3) var(--space-2);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--duration-fast);min-height:var(--touch-min);flex-direction:column;display:flex}.orientation-opt--active[data-v-679dae08]{border-color:var(--color-primary)}.orientation-opt__diagram[data-v-679dae08]{width:48px;height:48px;color:var(--color-text-muted)}.orientation-opt__label[data-v-679dae08]{font-size:var(--text-xs);color:var(--color-text);font-weight:700}.orientation-opt__sub[data-v-679dae08]{font-size:var(--text-xs);color:var(--color-text-muted);text-align:center;line-height:1.2}.home-view[data-v-6910484b]{padding:var(--space-4) var(--space-4) calc(var(--bottom-nav-height) + var(--space-4));gap:var(--space-3);flex-direction:column;flex:1;display:flex}.home-view__loading[data-v-6910484b]{color:var(--color-text-muted);font-size:var(--text-sm);padding:var(--space-4) 0;text-align:center}.home-view__empty[data-v-6910484b]{padding-top:var(--space-6);justify-content:center;display:flex}.home-view__empty-card[data-v-6910484b]{background:var(--color-surface);border:2px dashed var(--color-border);border-radius:var(--radius-md);padding:var(--space-6) var(--space-5);text-align:center;align-items:center;gap:var(--space-3);flex-direction:column;width:100%;max-width:320px;display:flex}.home-view__empty-icon[data-v-6910484b]{color:var(--color-text-muted);opacity:.5}.home-view__empty-title[data-v-6910484b]{font-size:var(--text-md);font-weight:700}.home-view__empty-sub[data-v-6910484b]{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.5}.home-view__single[data-v-6910484b]{flex-direction:column;flex:1;display:flex}.home-view__stack[data-v-6910484b]{gap:var(--space-3);scroll-snap-type:y mandatory;scroll-behavior:smooth;scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;min-height:0;display:flex;overflow-y:auto}.home-view__stack[data-v-6910484b]::-webkit-scrollbar{display:none}.home-view__slide[data-v-6910484b]{box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always;flex-direction:column;flex:none;min-height:100%;display:flex}@media (orientation:landscape) and (height<=600px){.home-view__stack[data-v-6910484b]{scroll-snap-type:x mandatory;gap:var(--space-3);margin:0 calc(-1 * var(--space-4));padding:0 var(--space-4);flex-direction:row;overflow:auto hidden}.home-view__slide[data-v-6910484b]{scroll-snap-align:center;flex:0 0 min(320px,70vw);height:100%;min-height:0}}.home-view__sheet-title[data-v-6910484b]{font-size:var(--text-md);margin-bottom:var(--space-4);font-weight:700}.home-view__sheet-field[data-v-6910484b]{margin-bottom:var(--space-4)}.home-view__sheet-label[data-v-6910484b]{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-2);font-weight:600;display:block}.home-view__mode-select[data-v-6910484b],.home-view__tz-select[data-v-6910484b]{width:100%;min-height:var(--touch-min);padding:0 var(--space-3);border:1.5px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);font-size:var(--text-sm);cursor:pointer;appearance:auto;font-family:inherit}.home-view__mode-select[data-v-6910484b]:focus,.home-view__tz-select[data-v-6910484b]:focus{outline:2px solid var(--color-primary);outline-offset:2px}.home-view__tz-select[data-v-6910484b],.home-view__times-mode[data-v-6910484b],.home-view__interval-mode[data-v-6910484b]{margin-top:var(--space-3)}.home-view__times-list[data-v-6910484b]{gap:var(--space-2);flex-direction:column;display:flex}.home-view__times-empty[data-v-6910484b]{font-size:var(--text-sm);color:var(--color-text-muted);padding:var(--space-2) 0;font-style:italic}.home-view__time-row[data-v-6910484b]{align-items:center;gap:var(--space-1);display:flex}.home-view__time-part[data-v-6910484b]{min-height:var(--touch-min);padding:0 var(--space-2);border:1.5px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);font-size:var(--text-sm);cursor:pointer;appearance:auto;flex:1 1 0;min-width:0;font-family:inherit}.home-view__time-part--ampm[data-v-6910484b]{flex:none;min-width:64px}.home-view__time-part[data-v-6910484b]:focus{outline:2px solid var(--color-primary);outline-offset:2px}.home-view__time-sep[data-v-6910484b]{color:var(--color-text-muted);padding:0 2px;font-weight:700}.home-view__time-remove[data-v-6910484b]{width:var(--touch-min);height:var(--touch-min);border:1.5px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;transition:all var(--duration-fast);background:0 0;flex:none;justify-content:center;align-items:center;display:inline-flex}.home-view__time-remove[data-v-6910484b]:hover,.home-view__time-remove[data-v-6910484b]:focus-visible{border-color:var(--color-danger,#c0392b);color:var(--color-danger,#c0392b);outline:none}.home-view__time-add[data-v-6910484b]{margin-top:var(--space-3);width:100%;min-height:var(--touch-min);border:1.5px dashed var(--color-border);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:var(--text-sm);cursor:pointer;transition:all var(--duration-fast);background:0 0;font-weight:600}.home-view__time-add[data-v-6910484b]:hover,.home-view__time-add[data-v-6910484b]:focus-visible{border-color:var(--color-primary);color:var(--color-primary);outline:none}.home-view__interval-input-row[data-v-6910484b]{align-items:center;gap:var(--space-2);font-size:var(--text-sm);display:flex}.home-view__interval-input[data-v-6910484b]{min-height:var(--touch-min);padding:0 var(--space-3);border:1.5px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);text-align:center;flex:0 0 96px;font-family:inherit;font-size:16px}.home-view__interval-input[data-v-6910484b]:focus{outline:2px solid var(--color-primary);outline-offset:2px}.home-view__next-update[data-v-6910484b]{margin-top:var(--space-3);font-size:var(--text-sm);color:var(--color-text);font-weight:600}.home-view__rotation-checkbox[data-v-6910484b]{margin-top:var(--space-3);align-items:center;gap:var(--space-2);font-size:var(--text-sm);cursor:pointer;min-height:var(--touch-min);display:flex}.home-view__rotation-checkbox input[type=checkbox][data-v-6910484b]{cursor:pointer;width:22px;height:22px;accent-color:var(--color-primary)}.home-view__propagation-note[data-v-6910484b]{margin-top:var(--space-1);font-size:var(--text-xs);color:var(--color-text-muted);font-style:italic;line-height:1.4}.home-view__sheet-save[data-v-6910484b]{width:100%;margin-top:var(--space-2)}
|