✨ feat(vscode): 代码阅读差异加「只看改动」（连着没变的块折成一条、按工作区记住）、上一处 / 下一处改动、右边缘总览条

2026-09-30 08:54:23 +08:00
1 parent 707d85c324
commit 6120c85bc0
@@ -997,3 +997,89 @@ del.cr-diff-word {
 }
 .cr-diff-sign[data-change="add"] { color: var(--cr-diff-add); }
 .cr-diff-sign[data-change="del"] { color: var(--cr-diff-del); }
+
+/* 「只看改动」开关：一个小拨动开关加字，开着时底色同按下的工具按钮、开关换聚焦色 */
+.cr-only-changes {
+  color: var(--vscode-foreground);
+}
+.cr-only-changes:hover {
+  background: var(--vscode-toolbar-hoverBackground);
+}
+.cr-only-changes[aria-pressed="true"] {
+  background: var(--vscode-toolbar-activeBackground);
+}
+.cr-only-changes:focus-visible {
+  outline: 1px solid var(--vscode-focusBorder);
+  outline-offset: -1px;
+}
+.cr-switch {
+  display: flex;
+  width: 26px;
+  height: 14px;
+  flex-shrink: 0;
+  align-items: center;
+  padding: 0 2px;
+  border: 1px solid var(--vscode-checkbox-border, var(--vscode-editorWidget-border, var(--vscode-panel-border)));
+  border-radius: 7px;
+  background: var(--vscode-input-background, transparent);
+}
+.cr-switch-knob {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--vscode-descriptionForeground);
+}
+.cr-switch[data-on] {
+  justify-content: flex-end;
+  border-color: var(--vscode-focusBorder);
+  background: var(--vscode-focusBorder);
+}
+.cr-switch[data-on] .cr-switch-knob {
+  background: #fff;
+}
+
+/* 「只看改动」时连着没变的块折成的一条：虚线框，点开恢复 */
+.cr-unchanged {
+  border: 1px dashed var(--vscode-editorWidget-border, var(--vscode-panel-border));
+  color: var(--vscode-descriptionForeground);
+}
+.cr-unchanged:hover {
+  background: var(--vscode-toolbar-hoverBackground);
+}
+.cr-unchanged:focus-visible {
+  outline: 1px solid var(--vscode-focusBorder);
+  outline-offset: -1px;
+}
+
+/* 预览右边缘的总览条：从筛选栏下面贴到底，每处改动按它在文件里的行画一段刻度（删掉的块一条细线），点刻度跳过去 */
+.cr-ruler {
+  position: fixed;
+  right: 0;
+  bottom: 0;
+  z-index: 5;
+  width: 14px;
+  border-left: 1px solid var(--vscode-editorOverviewRuler-border, var(--vscode-panel-border, transparent));
+  background: var(--vscode-editor-background);
+}
+.cr-ruler-track {
+  position: absolute;
+  inset: 2px 0;
+}
+.cr-ruler-tick {
+  position: absolute;
+  left: 3px;
+  width: 8px;
+  min-height: 4px;
+  cursor: pointer;
+}
+.cr-ruler-tick[data-change="add"] { background: var(--cr-diff-add); }
+.cr-ruler-tick[data-change="mod"] { background: var(--cr-diff-mod); }
+.cr-ruler-tick[data-change="del"] {
+  min-height: 2px;
+  height: 2px;
+  background: var(--cr-diff-del);
+}
+.cr-ruler-tick:hover,
+.cr-ruler-tick:focus-visible {
+  outline: 1px solid var(--vscode-focusBorder);
+}