Skip to content

Commit 1ac3074

Browse files
RexSkzRexSkz
committed
chore: move @types/lodash to devDependencies
1 parent 849b8ed commit 1ac3074

File tree

5 files changed

+289
-8
lines changed

5 files changed

+289
-8
lines changed

‎docs/index.css

Lines changed: 206 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,206 @@
1+
html,
2+
body {
3+
margin: 0;
4+
padding: 0;
5+
background: #f2f4f6;
6+
font-family: sans-serif;
7+
font-size: 14px;
8+
}
9+
code {
10+
background: #f9f2f4;
11+
color: #c7254e;
12+
padding: 0 4px;
13+
}
14+
a,
15+
a:visited {
16+
color: #2196f3;
17+
}
18+
[disabled] {
19+
cursor: not-allowed;
20+
}
21+
.demo-root {
22+
background: #fff;
23+
box-shadow: 0 0 30px rgba(0, 0, 0, 0.01);
24+
box-sizing: border-box;
25+
max-width: 1200px;
26+
margin: auto;
27+
padding: 1em 2em;
28+
position: relative;
29+
width: 100%;
30+
}
31+
.demo-root .statistics img {
32+
margin-right: 8px;
33+
}
34+
.demo-root blockquote {
35+
margin: 0 0 1em;
36+
line-height: 24px;
37+
}
38+
.demo-root .diff-config form,
39+
.demo-root .view-config form {
40+
overflow: hidden;
41+
}
42+
.demo-root .diff-config form > label,
43+
.demo-root .view-config form > label {
44+
display: flex;
45+
align-items: center;
46+
margin-right: 8px;
47+
padding: 0 4px;
48+
border-radius: 4px;
49+
user-select: none;
50+
font-weight: bold;
51+
background: #e5e6e9;
52+
}
53+
.demo-root .diff-config form > label span,
54+
.demo-root .view-config form > label span {
55+
font-weight: normal;
56+
margin-left: 1em;
57+
}
58+
.demo-root .diff-config form > label input,
59+
.demo-root .view-config form > label input,
60+
.demo-root .diff-config form > label select,
61+
.demo-root .view-config form > label select {
62+
margin-left: 8px;
63+
}
64+
.demo-root .diff-config form > label input[type=number],
65+
.demo-root .view-config form > label input[type=number] {
66+
min-width: 8em;
67+
}
68+
.demo-root .diff-result .json-diff-viewer {
69+
border: 1px solid;
70+
border-radius: 4px;
71+
box-sizing: border-box;
72+
margin-top: 1em;
73+
padding: 1em;
74+
}
75+
.demo-root .demo-footer {
76+
border-top: 1px dashed;
77+
margin: 4em 0 0;
78+
padding: 2em 0;
79+
text-align: center;
80+
}
81+
.toolbox .toggle {
82+
font-family: monospace;
83+
font-size: 14px;
84+
margin-bottom: 1em;
85+
user-select: none;
86+
cursor: pointer;
87+
}
88+
.toolbox .toggle:hover {
89+
text-decoration: underline;
90+
}
91+
.toolbox .inputs {
92+
display: flex;
93+
align-content: stretch;
94+
width: 100%;
95+
}
96+
.toolbox .inputs textarea {
97+
border-radius: 4px;
98+
flex: 1 1 auto;
99+
height: 300px;
100+
resize: vertical;
101+
padding: 1em;
102+
}
103+
.toolbox button {
104+
margin: 1em 1em 0 0;
105+
padding: 0.5em;
106+
}
107+
.toolbox .error {
108+
color: red;
109+
font-size: 14px;
110+
}
111+
.toolbox .viewer {
112+
border: 1px solid;
113+
border-radius: 4px;
114+
margin-top: 1em;
115+
padding: 1em;
116+
}
117+
.toolbox hr {
118+
border: none;
119+
border-top: 1px solid;
120+
margin: 2em 0;
121+
}
122+
.json-diff-viewer {
123+
border-spacing: 0;
124+
table-layout: fixed;
125+
width: 100%;
126+
}
127+
.json-diff-viewer tr {
128+
vertical-align: top;
129+
}
130+
.json-diff-viewer tr .line-add {
131+
background: #a5d6a7;
132+
}
133+
.json-diff-viewer tr .line-remove {
134+
background: #ef9a9a;
135+
}
136+
.json-diff-viewer tr .line-modify {
137+
background: #ffe082;
138+
}
139+
.json-diff-viewer tr:hover td {
140+
position: relative;
141+
}
142+
.json-diff-viewer tr:hover td::before {
143+
position: absolute;
144+
top: 0;
145+
left: 0;
146+
width: 100%;
147+
height: 100%;
148+
background: rgba(0, 0, 0, 0.05);
149+
content: '';
150+
pointer-events: none;
151+
}
152+
.json-diff-viewer tr.expand-line {
153+
text-align: center;
154+
}
155+
.json-diff-viewer tr.expand-line td {
156+
padding: 4px 0;
157+
}
158+
.json-diff-viewer tr.expand-line:hover td:before {
159+
background: transparent;
160+
}
161+
.json-diff-viewer tr.expand-line .has-lines-before {
162+
border-bottom: 1px solid;
163+
}
164+
.json-diff-viewer tr.expand-line .has-lines-after {
165+
border-top: 1px solid;
166+
}
167+
.json-diff-viewer tr.expand-line button {
168+
margin: 0 0.5em;
169+
padding: 0;
170+
color: #2196f3;
171+
font-family: sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
172+
font-size: 12px;
173+
border: none;
174+
background: transparent;
175+
user-select: none;
176+
cursor: pointer;
177+
}
178+
.json-diff-viewer tr.expand-line button:hover {
179+
text-decoration: underline;
180+
}
181+
.json-diff-viewer td.line-number {
182+
border-right: 1px solid;
183+
box-sizing: content-box;
184+
font-family: monospace;
185+
padding: 0 8px;
186+
text-align: right;
187+
user-select: none;
188+
}
189+
.json-diff-viewer pre {
190+
margin: 0;
191+
font-size: 12px;
192+
line-height: 16px;
193+
overflow: hidden;
194+
white-space: pre-wrap;
195+
word-break: break-all;
196+
}
197+
.json-diff-viewer pre .inline-diff-add {
198+
background: rgba(0, 0, 0, 0.08);
199+
text-decoration: underline;
200+
word-break: break-all;
201+
}
202+
.json-diff-viewer pre .inline-diff-remove {
203+
background: rgba(0, 0, 0, 0.08);
204+
text-decoration: line-through;
205+
word-break: break-all;
206+
}

‎docs/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>JSON Diff Kit Demo</title>
5+
<link rel="stylesheet" href="index.css" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script src="index.js"></script>
10+
</body>
11+
</html>

0 commit comments

Comments
 (0)