Skip to content

Commit 29ea072

Browse files
MrWangJustToDoMrWangJustToDo
authored
Merge pull request #70 from MrWangJustToDo/feat/lynx
fix build
2 parents cacf26d + 5634464 commit 29ea072

5 files changed

Lines changed: 131 additions & 4 deletions

File tree

‎packages/lynx/src/_com.css‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
/* Component chrome kept outside Tailwind (surfaces use CSS vars — Lynx-reliable stylesheet path).
2+
* Layout utilities come from @tailwind via src/tailwind.css.
3+
*/
4+
5+
.diff-view-lynx-scroll {
6+
width: 100%;
7+
flex: 1;
8+
}
9+
10+
.diff-line-content-text {
11+
white-space: pre-wrap;
12+
}
13+
14+
.diff-extend.diff-extend-column {
15+
flex-direction: column;
16+
}

‎packages/lynx/src/_theme.css‎

Lines changed: 111 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
/* Lynx theming: define CSS vars on class themes (not [data-theme] alone). */
2+
.diff-view-lynx.theme-light {
3+
--diff-add-content--: #e6ffec;
4+
--diff-del-content--: #ffebe9;
5+
--diff-plain-content--: #ffffff;
6+
--diff-expand-content--: #fafafa;
7+
--diff-empty-content--: #fafafa;
8+
--diff-add-lineNumber--: #ccffd8;
9+
--diff-del-lineNumber--: #ffd7d5;
10+
--diff-plain-lineNumber--: #fafafa;
11+
--diff-expand-lineNumber--: #fafafa;
12+
--diff-hunk-lineNumber--: #c7ecff;
13+
--diff-plain-content-color--: #24292e;
14+
--diff-plain-lineNumber-color--: #555555;
15+
/* Context / expand nums: slightly more muted than diff nums (split parity via opacity + hue). */
16+
--diff-expand-lineNumber-color--: #8b949e;
17+
--diff-hunk-content-color--: #777777;
18+
--diff-add-content-highlight--: #abf2bc;
19+
--diff-del-content-highlight--: #ffb3ad;
20+
--diff-hunk-content--: #ddf4ff;
21+
--diff-border--: #dedede;
22+
--diff-font-size--: 13px;
23+
}
24+
25+
.diff-view-lynx.theme-dark {
26+
--diff-add-content--: #14261f;
27+
--diff-del-content--: #311b1f;
28+
--diff-plain-content--: #0d1117;
29+
--diff-expand-content--: #161b22;
30+
--diff-empty-content--: #161b22;
31+
--diff-add-lineNumber--: #1f4429;
32+
--diff-del-lineNumber--: #552527;
33+
--diff-plain-lineNumber--: #161b22;
34+
--diff-expand-lineNumber--: #161b22;
35+
--diff-hunk-lineNumber--: #204274;
36+
/* Match react dark `[data-state] { color: white }` — content text had no FG and stayed black. */
37+
--diff-plain-content-color--: #e6edf3;
38+
--diff-plain-lineNumber-color--: #a0aaab;
39+
--diff-expand-lineNumber-color--: #6e7681;
40+
--diff-hunk-content-color--: #9298a0;
41+
--diff-add-content-highlight--: #1f572d;
42+
--diff-del-content-highlight--: #80312f;
43+
--diff-hunk-content--: #131d2e;
44+
--diff-border--: #3d444d;
45+
--diff-font-size--: 13px;
46+
}
47+
48+
/* Surfaces — consume vars in stylesheet (Lynx-reliable). Do not use var() in inline styles. */
49+
.diff-surface-add {
50+
background-color: var(--diff-add-content--);
51+
}
52+
.diff-surface-del {
53+
background-color: var(--diff-del-content--);
54+
}
55+
.diff-surface-plain {
56+
background-color: var(--diff-plain-content--);
57+
}
58+
.diff-surface-expand {
59+
background-color: var(--diff-expand-content--);
60+
}
61+
.diff-surface-empty {
62+
background-color: var(--diff-empty-content--);
63+
}
64+
.diff-surface-hunk {
65+
background-color: var(--diff-hunk-content--);
66+
}
67+
.diff-surface-hunk-num {
68+
background-color: var(--diff-hunk-lineNumber--);
69+
}
70+
.diff-surface-add-num {
71+
background-color: var(--diff-add-lineNumber--);
72+
}
73+
.diff-surface-del-num {
74+
background-color: var(--diff-del-lineNumber--);
75+
}
76+
.diff-surface-plain-num {
77+
background-color: var(--diff-plain-lineNumber--);
78+
}
79+
.diff-surface-expand-num {
80+
background-color: var(--diff-expand-lineNumber--);
81+
}
82+
83+
.diff-fg-num {
84+
color: var(--diff-plain-lineNumber-color--);
85+
}
86+
.diff-fg-num-expand {
87+
color: var(--diff-expand-lineNumber-color--);
88+
}
89+
.diff-fg-hunk {
90+
color: var(--diff-hunk-content-color--);
91+
}
92+
/* Base content / operator text (plain runs have no inline color). */
93+
.diff-fg-content {
94+
color: var(--diff-plain-content-color--);
95+
}
96+
97+
.diff-border-bg {
98+
background-color: var(--diff-border--);
99+
}
100+
101+
.diff-inline-hl-add {
102+
background-color: var(--diff-add-content-highlight--);
103+
}
104+
.diff-inline-hl-del {
105+
background-color: var(--diff-del-content-highlight--);
106+
}
107+
108+
/* Match DOM hunk action: `color: var(--diff-plain-lineNumber-color--)` + icon fill-current. */
109+
.diff-hunk-action {
110+
color: var(--diff-plain-lineNumber-color--);
111+
}

‎packages/lynx/src/components/DiffExpand.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { useDiffViewContext } from "./DiffViewContext";
99

1010
type IconProps = { size?: number };
1111

12-
/** Keep in sync with `--diff-plain-lineNumber-color--` in theme.css / react `_com.css`. */
12+
/** Keep in sync with `--diff-plain-lineNumber-color--` in `_theme.css` / react `_com.css`. */
1313
const PLAIN_LINE_NUMBER_COLOR = { light: "#555555", dark: "#a0aaab" } as const;
1414

1515
/** `A.25.25` / `a.75.75` → `A 0.25 0.25` / `a 0.75 0.75` */

‎packages/lynx/src/tailwind.css‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
@import "./styles/theme.css";
2-
@import "./styles/diff-view.css";
1+
@import "./_theme.css";
2+
@import "./_com.css";
33

44
@tailwind components;
55
@tailwind utilities;

‎packages/lynx/src/theme.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* Theme helpers for Lynx — colors live in CSS variables (theme.css).
2+
* Theme helpers for Lynx — colors live in CSS variables (`_theme.css`).
33
* Prefer className + stylesheet `var(--*)` over inline `var()` / hex.
44
*/
55

0 commit comments

Comments
 (0)