|
0
|
1 body{
|
|
|
2 font-family:Helvetica,"Adobe 宋體";
|
|
|
3 font-size:18px;
|
|
|
4 padding:0;
|
|
|
5 margin:0;
|
|
|
6 }
|
|
|
7 #loading{
|
|
|
8 position:fixed;
|
|
|
9 z-index:2000;
|
|
|
10 background:rgba(0,0,0,0.5);
|
|
|
11 color:#fff;
|
|
|
12 width:100vw;
|
|
|
13 height:100vh;
|
|
|
14 padding:300px 0;
|
|
|
15 text-align:center;
|
|
|
16 vertical-align:middle;
|
|
|
17 font-size:20px;
|
|
|
18 line-height:20px;
|
|
|
19 }
|
|
|
20 #container{
|
|
|
21 padding:10px;
|
|
|
22 }
|
|
|
23 #searchResults{
|
|
|
24 margin:30px 0;
|
|
|
25 }
|
|
|
26 #bookContainer{
|
|
|
27 display:table;
|
|
|
28 border-collapse: collapse;
|
|
|
29 border-spacing:10px;
|
|
|
30 }
|
|
|
31 .missingPageContainer{
|
|
|
32 font-style:italic;
|
|
|
33 display:table-row;
|
|
|
34 }
|
|
|
35 .missingPage{
|
|
|
36 border:1px dashed #000;
|
|
|
37 width:400px;
|
|
|
38 text-align:center;
|
|
|
39 padding:10px;
|
|
|
40 margin:20px 0;
|
|
|
41 }
|
|
|
42 #bookContainer td{
|
|
|
43 padding:10px;
|
|
|
44 }
|
|
|
45 table{
|
|
|
46 margin-bottom:20px;
|
|
|
47 }
|
|
|
48 td.level1, td.level2,td.level3, td.period{
|
|
|
49 width:70px;
|
|
|
50 }
|
|
|
51 div.entry{
|
|
|
52 display:table-row;
|
|
|
53 vertical-align:middle;
|
|
|
54 cursor:move;
|
|
|
55 }
|
|
|
56 div.entry .cell{
|
|
|
57 display:table-cell;
|
|
|
58 }
|
|
|
59 div.level1 .cell{
|
|
|
60 vertical-align:middle;
|
|
|
61 padding:15px 0px 5px 0px;
|
|
|
62 }
|
|
|
63 div.level2 .cell{
|
|
|
64 padding:5px 0px;
|
|
|
65 }
|
|
|
66 div.level3 .cell{
|
|
|
67 padding:10px 0px;
|
|
|
68 }
|
|
|
69 div.entry .sequence{
|
|
|
70 display:inline-block;
|
|
|
71 width:36px;
|
|
|
72 text-align:right;
|
|
|
73 padding-left:10px;
|
|
|
74 padding-right:10px;
|
|
|
75 font-size:14px;
|
|
|
76 margin-right:30px;
|
|
|
77 border-right:1px #888 solid;
|
|
|
78 color:#888;
|
|
|
79 }
|
|
|
80 div.entry .name{
|
|
|
81 display:inline-block;
|
|
|
82 width:350px;
|
|
|
83 margin-left:20px;
|
|
|
84 min-height:20px;
|
|
|
85 }
|
|
|
86 div.entry .page{
|
|
|
87 display:inline-block;
|
|
|
88 padding:0px;
|
|
|
89 }
|
|
|
90 div.startPage{
|
|
|
91 display:inline-block;
|
|
|
92 text-align:center;
|
|
|
93 width:50px;
|
|
|
94 min-height:20px;
|
|
|
95 }
|
|
|
96 div.endPage{
|
|
|
97 display:inline-block;
|
|
|
98 text-align:center;
|
|
|
99 width:50px;
|
|
|
100 min-height:20px;
|
|
|
101 }
|
|
|
102 div.level1{
|
|
|
103 border-bottom:1px solid #000;
|
|
|
104 }
|
|
|
105 div.level2{
|
|
|
106 }
|
|
|
107 div.level2 .name{
|
|
|
108 text-indent:40px;
|
|
|
109 }
|
|
|
110 div.level3{
|
|
|
111 }
|
|
|
112 div.level3 .name{
|
|
|
113 text-indent:80px;
|
|
|
114 }
|
|
|
115 div.overlapper{
|
|
|
116 background:#F5A9A9;
|
|
|
117 }
|
|
|
118 div.entry .editLevel{
|
|
|
119 display:inline-block;
|
|
|
120 margin:0 5px;
|
|
|
121 }
|
|
|
122 div.entry .deleteEntry{
|
|
|
123 display:inline-block;
|
|
|
124 padding-right:5px;
|
|
|
125 position:relative;
|
|
|
126 }
|
|
|
127 div.deleteEntry input{
|
|
|
128 width:60px;
|
|
|
129 text-align:center;
|
|
|
130 }
|
|
|
131 #deleteRange{
|
|
|
132 position:absolute;
|
|
|
133 z-index:102;
|
|
|
134 background:#000;
|
|
|
135 color:#fff;
|
|
|
136 -webkit-border-radius: 10px;
|
|
|
137 -moz-border-radius: 10px;
|
|
|
138 border-radius: 10px;
|
|
|
139 padding:10px;
|
|
|
140 width:260px;
|
|
|
141 font-size:16px;
|
|
|
142 line-height:24px;
|
|
|
143 top:-15px;
|
|
|
144 left:65px
|
|
|
145 }
|
|
|
146 #deleteRange .deleteFrom,#deleteRange .deleteTo,#deleteRange .deleteRangeButton{
|
|
|
147 display:inline-block;
|
|
|
148 }
|
|
|
149 #deleteRange .deleteButton{
|
|
|
150 margin-left:10px;
|
|
|
151 }
|
|
|
152 div.deleted{
|
|
|
153 opacity:0.2;
|
|
|
154 }
|
|
|
155 div.page input[type="text"]{
|
|
|
156 width:45px;
|
|
|
157 height:17px;
|
|
|
158 text-align:center;
|
|
|
159 }
|
|
|
160 input{
|
|
|
161 margin:0;
|
|
|
162 padding:0;
|
|
|
163 }
|
|
|
164 input[type="text"]{
|
|
|
165 -webkit-border-radius: 4px;
|
|
|
166 -moz-border-radius: 4px;
|
|
|
167 border-radius: 4px;
|
|
|
168 border:1px #888 solid;
|
|
|
169 font-size:16px;
|
|
|
170 font-family:inherit;
|
|
|
171 }
|
|
|
172 input[type="button"]{
|
|
|
173 font-size:20px;
|
|
|
174 font-family:inherit;
|
|
|
175 }
|
|
|
176 #panel{
|
|
|
177 position:fixed;
|
|
|
178 top:30px;
|
|
|
179 right:0px;
|
|
|
180 font-size:16px;
|
|
|
181 line-height:24px;
|
|
|
182 }
|
|
|
183 #saveBook,#configure{
|
|
|
184 background:#000;
|
|
|
185 color:#fff;
|
|
|
186 padding:15px;
|
|
|
187 -webkit-border-top-left-radius: 10px;
|
|
|
188 -webkit-border-bottom-left-radius: 10px;
|
|
|
189 -moz-border-radius-topleft: 10px;
|
|
|
190 -moz-border-radius-bottomleft: 10px;
|
|
|
191 border-top-left-radius: 10px;
|
|
|
192 border-bottom-left-radius: 10px;
|
|
|
193 vertical-align:middle;
|
|
|
194 }
|
|
|
195 #configure{
|
|
|
196
|
|
|
197 }
|
|
|
198 #configure input[type="checkbox"]{
|
|
|
199 margin-right:5px;
|
|
|
200 -ms-transform: scale(1.2); /* IE */
|
|
|
201 -moz-transform: scale(1.2); /* FF */
|
|
|
202 -webkit-transform: scale(1.2); /* Safari and Chrome */
|
|
|
203 -o-transform: scale(1.2); /* Opera */
|
|
|
204 position:relative;
|
|
|
205 top:-2px;
|
|
|
206 *overflow:hidden;
|
|
|
207 }
|
|
|
208 #saveBook{
|
|
|
209 margin-top:10px;
|
|
|
210 text-align:right;
|
|
|
211 }
|
|
|
212 #saveBook .label{
|
|
|
213 display:block;
|
|
|
214 text-align:left;
|
|
|
215 margin-bottom:10px;
|
|
|
216 }
|
|
|
217 #saveBook .editor{
|
|
|
218 display:block;
|
|
|
219 margin:4px 0;
|
|
|
220 }
|
|
|
221 #saveBook .save{
|
|
|
222 }
|
|
|
223 .hovered{
|
|
|
224 background:#ddd !important;
|
|
|
225 }
|
|
|
226 div.entry .insert{
|
|
|
227 display:inline-block;
|
|
|
228 color:#fff;
|
|
|
229 text-align:center;
|
|
|
230 vertical-align:center;
|
|
|
231 position:relative;
|
|
|
232 }
|
|
|
233 .insertIcon{
|
|
|
234 display:inline-block;
|
|
|
235 margin: auto 5px;
|
|
|
236 background:#444;
|
|
|
237 padding:5px 7px;
|
|
|
238 -webkit-border-radius: 5px;
|
|
|
239 -moz-border-radius: 5px;
|
|
|
240 border-radius: 5px;
|
|
|
241 cursor:pointer;
|
|
|
242 font-size:16px;
|
|
|
243 line-height:16px;
|
|
|
244 }
|
|
|
245 .insertOption{
|
|
|
246 position:absolute;
|
|
|
247 left:33px;
|
|
|
248 width:190px;
|
|
|
249 top:-15px;
|
|
|
250 text-align:left;
|
|
|
251 background:#000;
|
|
|
252 color:#fff;
|
|
|
253 -webkit-border-radius: 10px;
|
|
|
254 -moz-border-radius: 10px;
|
|
|
255 border-radius: 10px;
|
|
|
256 padding:10px;
|
|
|
257 font-size:16px;
|
|
|
258 line-height:24px;
|
|
|
259 }
|
|
|
260 .insertBefore{
|
|
|
261 text-align:center;
|
|
|
262 display:inline-block;
|
|
|
263 cursor:pointer;
|
|
|
264 }
|
|
|
265 .insertAfter{
|
|
|
266 text-align:center;
|
|
|
267 display:inline-block;
|
|
|
268 margin-left:5px;
|
|
|
269 }
|
