Skip to content

Commit f5107d2

Browse files
qatocoqatoco
committed
push init setting
1 parent af9220e commit f5107d2

File tree

6 files changed

+6687
-1
lines changed

6 files changed

+6687
-1
lines changed

‎README.md‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,8 @@
1-
# draft-js-image-insert-demo
1+
# draft-js-image-insert-demo
2+
3+
4+
```sh
5+
yarn && yarn start
6+
open http://localhost:3000
7+
```
8+

‎index.html‎

Lines changed: 369 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,369 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>ld. Last Draft</title>
5+
<meta name="author" content="seavae" />
6+
<meta name="description" content="last draft editor example" />
7+
<meta content="last draft" property="og:title" />
8+
<meta content="last draft" property="og:site_name" />
9+
<meta charset="utf-8" />
10+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
11+
12+
<style>
13+
/* override some last Draft styles */
14+
15+
html {
16+
box-sizing: border-box;
17+
}
18+
19+
*,
20+
*:before,
21+
*:after {
22+
box-sizing: inherit;
23+
}
24+
25+
body {
26+
font-size: 16px;
27+
line-height: 1.4;
28+
font-family: 'Open Sans', sans-serif;
29+
color: #555;
30+
background: #fff;
31+
}
32+
33+
#root {
34+
margin: 10rem;
35+
}
36+
37+
a {
38+
color: #2f8be6;
39+
}
40+
41+
h1 {
42+
font-weight: 200;
43+
text-align: center;
44+
margin-bottom: 20px;
45+
font-size: 2.5rem;
46+
letter-spacing: 0.05em;
47+
}
48+
h1 > span {
49+
font-weight: 400;
50+
}
51+
h1 .blue {
52+
text-transform: uppercase;
53+
color: #0cf;
54+
}
55+
h1 .pink {
56+
text-transform: uppercase;
57+
color: #e54cb5;
58+
}
59+
h1 .red {
60+
text-transform: uppercase;
61+
color: #fc6669;
62+
}
63+
h1 .green {
64+
text-transform: uppercase;
65+
color: #0f9;
66+
}
67+
h1 .purple {
68+
text-transform: uppercase;
69+
color: #93f;
70+
}
71+
72+
.title {
73+
margin: 0 auto;
74+
}
75+
76+
.last-draft-editor {
77+
cursor: text;
78+
padding: 1rem;
79+
}
80+
81+
.DraftEditor-editorContainer {
82+
position: relative;
83+
z-index: 1;
84+
}
85+
86+
.paragraph {
87+
margin-bottom: 2rem;
88+
}
89+
90+
.public-DraftEditor-content figure {
91+
margin: 1rem 0;
92+
}
93+
94+
.public-DraftStyleDefault-ul {
95+
list-style-type: disc;
96+
}
97+
98+
.public-DraftStyleDefault-ol {
99+
list-style-type: decimal;
100+
}
101+
102+
.public-DraftStyleDefault-ol,
103+
.public-DraftStyleDefault-ul {
104+
line-height: 2;
105+
margin: 2.2rem 0 4rem 0;
106+
padding-left: 2rem;
107+
}
108+
109+
.public-DraftStyleDefault-ol li,
110+
.public-DraftStyleDefault-ul li {
111+
padding-left: 1rem;
112+
}
113+
114+
.public-DraftEditorPlaceholder-root {
115+
color: #999;
116+
position: absolute;
117+
z-index: 0;
118+
}
119+
120+
.public-DraftEditor-content h2 {
121+
font-weight: 700;
122+
line-height: 1.2;
123+
margin: 4rem 0 2rem 0;
124+
}
125+
126+
.public-DraftEditor-content h2:first-child {
127+
margin-top: 0;
128+
}
129+
.DraftEditor-editorContainer,
130+
.DraftEditor-root,
131+
.public-DraftEditor-content {
132+
height: inherit;
133+
text-align: initial;
134+
}
135+
136+
.public-DraftEditor-content,
137+
.public-DraftEditorPlaceholder-root {
138+
margin: -1rem;
139+
padding: 1rem;
140+
}
141+
142+
.public-DraftEditor-content {
143+
min-height: 10rem;
144+
}
145+
.public-DraftEditor-content[contenteditable='true'] {
146+
-webkit-user-modify: read-write-plaintext-only;
147+
}
148+
.public-DraftEditor-block {
149+
position: relative;
150+
}
151+
152+
.public-DraftEditorPlaceholder-root {
153+
color: #9197a3;
154+
position: absolute;
155+
z-index: 0;
156+
margin: 0;
157+
padding-left: 0;
158+
}
159+
160+
.public-DraftEditorPlaceholder-hasFocus {
161+
color: #bdc1c9;
162+
}
163+
164+
.DraftEditorPlaceholder-hidden {
165+
display: none;
166+
}
167+
168+
.public-DraftStyleDefault-block {
169+
position: relative;
170+
white-space: pre-wrap;
171+
}
172+
173+
.public-DraftStyleDefault-ltr {
174+
direction: ltr;
175+
text-align: left;
176+
}
177+
178+
.public-DraftStyleDefault-rtl {
179+
direction: rtl;
180+
text-align: right;
181+
}
182+
183+
.public-DraftStyleDefault-listLTR {
184+
direction: ltr;
185+
}
186+
187+
.public-DraftStyleDefault-listRTL {
188+
direction: rtl;
189+
}
190+
191+
.DraftEditor {
192+
&-root {
193+
position: relative;
194+
}
195+
196+
&-alignLeft {
197+
.public-DraftStyleDefault-block {
198+
text-align: left;
199+
}
200+
.public-DraftEditorPlaceholder-root {
201+
left: 0;
202+
text-align: left;
203+
}
204+
.public-DraftStyleDefault-block {
205+
text-align: center;
206+
}
207+
.public-DraftEditorPlaceholder-root {
208+
margin: 0 auto;
209+
text-align: center;
210+
width: 100%;
211+
}
212+
.public-DraftStyleDefault-block {
213+
text-align: right;
214+
}
215+
.public-DraftEditorPlaceholder-root {
216+
right: 0;
217+
text-align: right;
218+
}
219+
}
220+
}
221+
222+
.public-DraftStyleDefault-pre {
223+
background-color: rgba(0, 0, 0, 0.05);
224+
font-family: $mono;
225+
font-size: 16px;
226+
padding: 20px;
227+
}
228+
229+
/* list styles */
230+
231+
.public-DraftStyleDefault-orderedListItem,
232+
.public-DraftStyleDefault-unorderedListItem {
233+
margin-bottom: 10px;
234+
}
235+
236+
.public-DraftStyleDefault-orderedListItem,
237+
.public-DraftStyleDefault-unorderedListItem {
238+
margin-bottom: 10px;
239+
}
240+
241+
.public-DraftStyleDefault-ol,
242+
.public-DraftStyleDefault-ul {
243+
margin: 16px 0;
244+
padding: 0;
245+
}
246+
247+
.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listLTR {
248+
margin-left: 1.5em;
249+
}
250+
251+
.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listRTL {
252+
margin-right: 1.5em;
253+
}
254+
255+
.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listLTR {
256+
margin-left: 3em;
257+
}
258+
259+
.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listRTL {
260+
margin-right: 3em;
261+
}
262+
263+
.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listLTR {
264+
margin-left: 4.5em;
265+
}
266+
267+
.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listRTL {
268+
margin-right: 4.5em;
269+
}
270+
271+
.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listLTR {
272+
margin-left: 6em;
273+
}
274+
275+
.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listRTL {
276+
margin-right: 6em;
277+
}
278+
279+
.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listLTR {
280+
margin-left: 7.5em;
281+
}
282+
283+
.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listRTL {
284+
margin-right: 7.5em;
285+
}
286+
287+
.public-DraftStyleDefault-unorderedListItem {
288+
list-style-type: square;
289+
position: relative;
290+
}
291+
292+
.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth0 {
293+
list-style-type: disc;
294+
}
295+
296+
.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth1 {
297+
list-style-type: circle;
298+
}
299+
300+
.public-DraftStyleDefault-orderedListItem {
301+
list-style-type: none;
302+
position: relative;
303+
}
304+
305+
.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listLTR:before {
306+
left: -36px;
307+
position: absolute;
308+
text-align: right;
309+
width: 30px;
310+
}
311+
312+
.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listRTL:before {
313+
position: absolute;
314+
right: -36px;
315+
text-align: left;
316+
width: 30px;
317+
}
318+
319+
.public-DraftStyleDefault-orderedListItem:before {
320+
content: counter(ol0) '. ';
321+
counter-increment: ol0;
322+
}
323+
324+
.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1:before {
325+
content: counter(ol1) '. ';
326+
counter-increment: ol1;
327+
}
328+
329+
.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2:before {
330+
content: counter(ol2) '. ';
331+
counter-increment: ol2;
332+
}
333+
334+
.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3:before {
335+
content: counter(ol3) '. ';
336+
counter-increment: ol3;
337+
}
338+
339+
.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4:before {
340+
content: counter(ol4) '. ';
341+
counter-increment: ol4;
342+
}
343+
344+
.public-DraftStyleDefault-depth0.public-DraftStyleDefault-reset {
345+
counter-reset: ol0;
346+
}
347+
348+
.public-DraftStyleDefault-depth1.public-DraftStyleDefault-reset {
349+
counter-reset: ol1;
350+
}
351+
352+
.public-DraftStyleDefault-depth2.public-DraftStyleDefault-reset {
353+
counter-reset: ol2;
354+
}
355+
356+
.public-DraftStyleDefault-depth3.public-DraftStyleDefault-reset {
357+
counter-reset: ol3;
358+
}
359+
360+
.public-DraftStyleDefault-depth4.public-DraftStyleDefault-reset {
361+
counter-reset: ol4;
362+
}
363+
</style>
364+
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> -->
365+
</head>
366+
<body>
367+
<div id="root"></div>
368+
</body>
369+
</html>

0 commit comments

Comments
 (0)