Skip to content

Commit 6808861

Browse files
committed
markdown
1 parent a0ff950 commit 6808861

3 files changed

Lines changed: 544 additions & 0 deletions

File tree

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Title</title>
6+
</head>
7+
<style>
8+
9+
.su-toolbar {
10+
width: 100%;
11+
height: 45px;
12+
display: block;
13+
background: #f5f5f5;
14+
padding: 5px;
15+
border: solid 1px;
16+
border-color: #cccccc;
17+
}
18+
19+
.su-toolbar .tool-block {
20+
cursor: pointer;
21+
display: block;
22+
width: 35px;
23+
margin: 0 1%;
24+
height: 35px;
25+
float: left;
26+
padding: 5px;
27+
}
28+
29+
.su-toolbar .tool-block * {
30+
left: 20%;
31+
top: 20%;
32+
}
33+
34+
.su-toolbar .tool-block:hover {
35+
background: #00ffff;
36+
}
37+
38+
.su-toolbar button {
39+
margin-top: 5px;
40+
}
41+
42+
.suEditor {
43+
width: 50%;
44+
float: left;
45+
display: block;
46+
47+
}
48+
49+
.suEditor textarea {
50+
width: 100%;
51+
height: 400px;
52+
background: #f5f5f5;
53+
tab-size: 4;
54+
border: solid 1px;
55+
border-top: none;
56+
border-color: #cccccc;
57+
padding: 20px;
58+
resize: none;
59+
}
60+
61+
.suEditor textarea:focus {
62+
background: #fff;
63+
border-color: #cccccc;
64+
outline: none;
65+
}
66+
67+
.suPreview {
68+
width: 50%;
69+
left: 50%;
70+
float: left;
71+
background: #f5f5f5;
72+
height: 400px;
73+
display: block;
74+
overflow: auto;
75+
padding: 0 20px;
76+
border-right: solid 1px;
77+
border-bottom: solid 1px;
78+
border-color: #cccccc;
79+
80+
}
81+
82+
</style>
83+
<body>
84+
85+
86+
<div class="su-toolbar">
87+
<div class="tool-block su-tool-bold" title="加粗(Ctrl+B)" data-placement="top" data-toggle="tooltip">
88+
<span class="glyphicon glyphicon-bold"></span>
89+
</div>
90+
<div class="tool-block su-tool-italic" title="斜体(Ctrl+I)" data-placement="top" data-toggle="tooltip">
91+
<span class="glyphicon glyphicon-italic"></span>
92+
</div>
93+
<div class="tool-block su-tool-head" title="标题(Ctrl+H)" data-placement="top" data-toggle="tooltip">
94+
<span class="glyphicon glyphicon-header"></span>
95+
</div>
96+
<div class="tool-block su-tool-link" title="链接(Ctrl+L)" data-placement="top" data-toggle="tooltip">
97+
<span class="glyphicon glyphicon-link"></span>
98+
</div>
99+
<div class="tool-block su-tool-img" title="图片(Ctrl+G)" data-placement="top" data-toggle="tooltip">
100+
<span class="glyphicon glyphicon-picture"></span>
101+
</div>
102+
<div class="tool-block su-tool-list" title="无序列表(Ctrl+U)" data-placement="top" data-toggle="tooltip">
103+
<span class="glyphicon glyphicon-list"></span>
104+
</div>
105+
<div class="tool-block su-tool-orderlist" title="有序列表(Ctrl+O)" data-placement="top" data-toggle="tooltip">
106+
<span class="glyphicon glyphicon-th-list"></span>
107+
</div>
108+
<div class="tool-block su-tool-code" title="单行代码(Ctrl+K)" data-placement="top" data-toggle="tooltip">
109+
<span class="glyphicon glyphicon-asterisk"></span>
110+
</div>
111+
<div class="tool-block su-tool-block" title="区块(Ctrl+Q)" data-placement="top" data-toggle="tooltip">
112+
<span class="glyphicon glyphicon-comment"></span>
113+
</div>
114+
115+
<button class="btn btn-sm btn-primary pull-right su-tool-preview">
116+
<span class="glyphicon glyphicon-search"></span>
117+
Preview
118+
</button>
119+
</div>
120+
121+
122+
<div class="suEditor">
123+
124+
<textarea></textarea>
125+
126+
</div>
127+
128+
129+
<div class="suPreview">
130+
131+
</div>
132+
</body>
133+
</html>

0 commit comments

Comments
 (0)