diff --git a/stash-web/src/App.css b/stash-web/src/App.css index a912f5f..6e4602f 100644 --- a/stash-web/src/App.css +++ b/stash-web/src/App.css @@ -963,3 +963,19 @@ gap: var(--su-space-2); align-items: center; } + +/* 删除按钮:可删的用危险色,不可删的用弱化色(都取主题令牌) */ +.admin-item-actions .admin-remove { + color: var(--su-color-danger); +} + +.admin-item-actions .admin-remove:not(:disabled):hover { + color: var(--su-color-danger); + background-color: color-mix(in srgb, var(--su-color-danger) 10%, transparent); +} + +.admin-item-actions .admin-remove:disabled { + color: var(--su-text-muted); + cursor: not-allowed; + opacity: 0.45; +} diff --git a/stash-web/src/components/admin/AdminPage.tsx b/stash-web/src/components/admin/AdminPage.tsx index 9b5af85..4421a78 100644 --- a/stash-web/src/components/admin/AdminPage.tsx +++ b/stash-web/src/components/admin/AdminPage.tsx @@ -504,6 +504,7 @@ function SectionForm({ onUp={() => move(index, -1)} onDown={() => move(index, 1)} onRemove={card.id === 'local' ? undefined : () => onDelete(card)} + disabledRemove={card.id === 'local'} /> ))} @@ -710,24 +711,38 @@ function IconButtonGroup({ onUp, onDown, onRemove, + disabledRemove = false, }: { onUp: () => void onDown: () => void onRemove?: (() => void) | undefined + /** 显示一个不可点的删除按钮(灰色),用于「本地服务」这类受保护项 */ + disabledRemove?: boolean }) { return (