obsidian-plugin/silvanocerza_github-gitless-sync
1
0
Fork 0
mirror of https://github.com/silvanocerza/github-gitless-sync.git synced 2026-07-22 12:10:28 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Some styling

Browse source
This commit is contained in:
Silvano Cerza 2025-02-13 15:13:47 +01:00
parent f409216320
commit 6d7c0c8772
2 changed files with 43 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/views/conflicts-resolution/component.tsx
View file

@ -3,7 +3,6 @@ import { useEffect, useRef } from "react";
import { EditorView } from "@codemirror/view"; import { EditorView } from "@codemirror/view";
import { EditorState } from "@codemirror/state"; import { EditorState } from "@codemirror/state";
import { markdown } from "@codemirror/lang-markdown"; import { markdown } from "@codemirror/lang-markdown";
import { basicSetup } from "codemirror";
import diff from "./diff"; import diff from "./diff";
import { createDiffHighlightPlugin } from "./diff-highlight-plugin"; import { createDiffHighlightPlugin } from "./diff-highlight-plugin";
@ -11,10 +10,10 @@ import { createDiffHighlightPlugin } from "./diff-highlight-plugin";
const styles = document.createElement("style"); const styles = document.createElement("style");
styles.innerHTML = ` styles.innerHTML = `
.diff-remove-background { .diff-remove-background {
background-color: rgba(255, 0, 0, 0.1); background-color: rgba(var(--background-modifier-error-rgb), 0.1);
} }
.diff-add-background { .diff-add-background {
background-color: rgba(0, 255, 0, 0.1); background-color: rgba(var(--color-green-rgb), 0.1);
} }
`; `;
document.head.appendChild(styles); document.head.appendChild(styles);
@ -64,11 +63,26 @@ const DiffView: React.FC<DiffViewProps> = ({
const state = EditorState.create({ const state = EditorState.create({
doc: content, doc: content,
extensions: [ extensions: [
basicSetup, // basicSetup minus line numbers
markdown(),
EditorView.lineWrapping, EditorView.lineWrapping,
EditorView.editable.of(!readOnly), EditorView.editable.of(!readOnly),
highlightPlugin, highlightPlugin,
EditorView.theme({
"&": {
backgroundColor: "var(--background-primary)",
color: "var(--text-normal)",
},
".cm-line": {
padding: "0 4px",
},
"&.cm-focused .cm-selectionBackground, .cm-selectionBackground": {
background: "var(--text-selection)",
},
"&.cm-focused .cm-cursor": {
borderLeftColor: "var(--text-normal)",
},
}),
markdown(),
...changeListener, ...changeListener,
], ],
}); });

44
src/views/conflicts-resolution/diff-highlight-plugin.ts
View file

@ -21,27 +21,31 @@ export function createDiffHighlightPlugin(spec: DiffHighlightPluginSpec) {
} }
buildDecorations(view: EditorView): DecorationSet { buildDecorations(view: EditorView): DecorationSet {
const doc = view.state.doc.toString(); const decorations = [];
const doc = view.state.doc;
const decorations = spec.diff // Go through the document line by line
.map((d) => { for (let i = 1; i <= doc.lines; i++) {
if ( const line = doc.line(i);
(spec.isOriginal && d.type === "remove") || const lineText = line.text;
(!spec.isOriginal && d.type === "add")
) { // Find matching diff for this line
// Find the text position in the actual document const diff = spec.diff.find((d) => d.value === lineText);
const pos = doc.indexOf(d.value);
if (pos !== -1) { if (
return Decoration.mark({ diff &&
class: spec.isOriginal ((spec.isOriginal && diff.type === "remove") ||
? "diff-remove-background" (!spec.isOriginal && diff.type === "add"))
: "diff-add-background", ) {
}).range(pos, pos + d.value.length); decorations.push(
} Decoration.mark({
} class: spec.isOriginal
return null; ? "diff-remove-background"
}) : "diff-add-background",
.filter((d): d is NonNullable<typeof d> => d !== null); }).range(line.from, line.to),
);
}
}
return Decoration.set(decorations, true); return Decoration.set(decorations, true);
} }