Bug 30695: (follow-up) Fix selenium test
[koha.git] / koha-tmpl / intranet-tmpl / prog / css / cateditor.css
1 /*> Infrastructure */
2 body {
3     padding: 0;
4 }
5
6 #loading {
7     background-color: #FFF;
8     cursor: wait;
9     height: 100%;
10     left: 0;
11     opacity: .7;
12     position: fixed;
13     top: 0;
14     width: 100%;
15     z-index: 1000;
16 }
17
18 #loading div {
19     background : transparent url(../img/loading.gif) top left no-repeat;
20     font-size : 175%;
21     font-weight: bold;
22     height: 2em;
23     left: 50%;
24     margin: -1em 0 0 -2.5em;
25     padding-left : 50px;
26     position: absolute;
27     top: 50%;
28     width: 15em;
29 }
30
31 #alerts-container {
32     font-size: 12px;
33 }
34
35 #alerts-container h3 {
36     font-size: inherit;
37 }
38
39 #alerts-container > ul {
40     padding: 0;
41 }
42
43 #alerts-container > ul > li {
44     border-bottom: 1px solid #DDD;
45     display: block;
46     padding: 4px 0;
47 }
48
49 #alerts-container > ul > li:first-child {
50     padding-top: 0;
51 }
52
53 #alerts-container > ul > li:last-child {
54     border-bottom: none;
55     padding-bottom: 0;
56 }
57
58 .humanMsg.humanSuccess {
59         left: 75%;
60     width: 20%;
61     top: 160px;
62 }
63
64 #shortcuts-container {
65     font-size: 12px;
66 }
67
68 /*> MARC editor */
69 #editor .CodeMirror {
70     line-height: 1.2;
71 }
72
73 .cm-tagnumber {
74     color: #080;
75     font-weight: bold;
76 }
77
78 .cm-bad-tagnumber {
79     color: #A20;
80     font-weight: bold;
81 }
82
83 .cm-indicator {
84     color: #884;
85 }
86
87 .cm-subfieldcode {
88     background-color: #F4F4F4;
89     color: #187848;
90     border-radius: 3px;
91     border-right: 2px solid white;
92     font-weight: bold;
93     padding-left: 3px;
94     padding-right: 3px;
95     margin-right: -2px;
96 }
97
98 .cm-bad-subfieldcode {
99     background-color: #FFD9D9;
100     color: #482828;
101     border-radius: 3px 8px 8px 3px;
102     font-weight: bold;
103 }
104
105 .cm-end-space {
106     background-color: #DDDDBB;
107 }
108
109 .cm-double-space {
110     border-bottom: 2px dotted #CC3333;
111 }
112
113 #editor .modified-line-gutter {
114     width: 10px;
115 }
116
117 #editor .modified-line {
118     background: #F8F8F8;
119     border-left: 5px solid black;
120     margin-left: -10px;
121     padding-left: 5px;
122 }
123
124 #editor .CodeMirror-gutters {
125     background: transparent;
126     border-right: none;
127 }
128
129 /*> MARC editor widgets */
130
131 #editor .subfield-widget {
132     color: #538200;
133     border: solid 2px #538200;
134     border-radius: 6px;
135     font-family: inherit;
136     line-height: 2.75;
137     margin: 3px 0;
138     padding: 2px;
139 }
140
141 #editor .subfield-widget button {
142     font-family: inherit;
143     font-size: inherit;
144     height: 1.5em;
145     line-height: 1em;
146     margin-left: 5px;
147     vertical-align: middle;
148 }
149
150 #editor .subfield-widget select, #editor .subfield-widget input {
151     height: 1.5em;
152     vertical-align: middle;
153 }
154
155 #editor .subfield-widget select:focus {
156     outline: 2px #83A230 solid;
157 }
158
159 #editor .fixed-widget input {
160     width: 4em;
161     padding: 0;
162     border-radius: 2px;
163     border-width: 1px;
164 }
165
166 #editor .fixed-widget select {
167     width: 3em;
168 }
169
170 #editor .fixed-widget .material-select {
171     width: 4.5em;
172     margin-right: .5em;
173 }
174
175 #editor .fixed-collapsed {
176     display: inline-block;
177     margin: 0 .25em;
178     text-align: center;
179     text-decoration: underline;
180 }
181
182 #editor .hidden-widget {
183     color: #999999;
184     border: solid 2px #AAAAAA;
185     line-height: 2;
186     padding: 2px;
187 }
188
189 .structure-error {
190     background: #FFEEEE;
191     font-size: 0.9em;
192     line-height: 1.5;
193     margin: .5em;
194     padding: 0 .5em;
195 }
196
197 .structure-error i {
198     vertical-align: text-bottom;
199 }
200
201 #statusbar {
202     background-color: #F4F8F9;
203     border: solid 2px #b9d8d9;
204     border-radius: 6px;
205     overflow: auto;
206     padding: 4px;
207 }
208
209 #statusbar #status-tag-info, #statusbar #status-subfield-info {
210     float: left;
211     overflow: hidden;
212     padding-right: 2%;
213     width: 48%;
214 }
215
216 #record-info .label {
217     float: none;
218 }
219
220 #record-info .label + span {
221     display: block;
222     padding-left: 1em;
223 }
224
225 /*> Search */
226
227 #advanced-search-ui .modal-lg, #search-results-ui .modal-lg, #macro-ui .modal-lg {
228     width: 90%;
229 }
230
231 .modal-body {
232     max-height: none;
233 }
234
235 .modal-lg .modal-body {
236     overflow-y: auto;
237 }
238
239 #quicksearch-overlay {
240     background: rgba(255, 255, 255, .9);
241     border: 2px solid #CC8877;
242     border-radius: 5px;
243     -moz-box-sizing: border-box;
244     -webkit-box-sizing: border-box;
245     box-sizing: border-box;
246     color: #664444;
247     position: relative;
248     vertical-align: middle;
249 }
250
251 #quicksearch-overlay h3 {
252     font-size: 1.5em%;
253     margin: 0;
254     text-align: center;
255     padding: 50px 5px;
256 }
257
258 #quicksearch-overlay p {
259     bottom: 0;
260     font-size: .8em;
261     overflow: hidden;
262     padding: 8px 15px;
263     position: absolute;
264     text-align: center;
265 }
266
267 #quicksearch input, #quicksearch a {
268     font-size: 1.2em;
269     padding: 3px 0;
270     width: 96%; /* I have no idea why this is necessary */
271 }
272
273 #show-advanced-search {
274     display: block;
275     margin-top: .3em;
276 }
277
278 #advanced-search-fields {
279     -moz-column-width: 26em;
280     -webkit-column-width: 26em;
281     column-width: 26em;
282     margin: 0;
283     padding: 0;
284 }
285
286 #advanced-search-fields li {
287     display: block;
288     list-style-type: none;
289 }
290
291 #advanced-search-fields label {
292     display: inline-block;
293     font-weight: bold;
294     padding: 1em 1em 1em 0;
295     width: 10em;
296     text-align: right;
297 }
298
299 #advanced-search-fields input {
300     display: inline-block;
301     margin: 0px auto;
302     width: 14em;
303 }
304
305
306 /*> Search results */
307
308 #search-serversinfo li {
309     list-style-type: none;
310 }
311
312 #search-serversinfo .search-toggle-server {
313     margin-right: 5px;
314 }
315
316 #searchresults table {
317     width: 100%;
318 }
319
320 .sourcecol {
321     width: 50px;
322 }
323
324 .results-info {
325     height: 100px;
326     overflow: auto;
327 }
328
329 .toolscol {
330     padding: 0;
331     width: 100px;
332 }
333
334 .toolscol ul {
335     margin: 0;
336     padding: 0;
337 }
338
339 #searchresults .toolscol li {
340     list-style-type: none;
341     list-style-image: none;
342 }
343
344 .toolscol a {
345     border-bottom: 1px solid #BCBCBC;
346     display: block;
347     padding: 0 1em;
348     line-height: 24px;
349 }
350
351 .marccol {
352     font-family: monospace;
353     height: auto;
354     white-space: pre-wrap;
355 }
356
357 #searchresults {
358     position: relative;
359 }
360
361 #search-overlay {
362     background: white;
363     bottom: 0;
364     font-size: 2em;
365     left: 0;
366     opacity: .7;
367     padding: 2em;
368     position: absolute;
369     right: 0;
370     text-align: center;
371     top: 0;
372     z-index: 9001;
373 }
374
375 /*> Macros */
376 #macro-save-message {
377     color: #666;
378     font-size: 13px;
379     float: right;
380     line-height: 26px;
381 }
382
383 #macro-list > li {
384     border: 2px solid #F0F0F0;
385     border-radius: 6px;
386     display: block;
387     font-size: 115%;
388 }
389
390 #macro-list > li + li {
391     margin-top: -2px;
392 }
393
394 #macro-list .active {
395     background: #EDF4F6;
396     border-color: none;
397 }
398
399 #macro-list a {
400     display: block;
401     padding: 6px;
402 }
403
404 #macro-list a:focus {
405     outline: none;
406 }
407
408 .macro-info {
409     background-color: #F4F4F4;
410     display: none;
411     margin: 0;
412     padding: 10px;
413     text-align: right;
414 }
415
416 .macro-info li {
417     color: #666;
418     font-size: 75%;
419     list-style-type: none;
420 }
421
422 .macro-info .label {
423     clear: left;
424     font-weight: bold;
425     float: left;
426 }
427
428 #macro-list .active .macro-info {
429     display: block;
430 }
431
432 .btn-toolbar label, .btn-toolbar select {
433     font-size: 13px;
434     vertical-align: middle;
435 }
436
437 .btn-toolbar label {
438     margin-left: 1em;
439 }
440
441 .btn-toolbar select {
442     padding: 2px;
443 }
444
445 #macro-editor {
446     display: flex;
447     flex-direction: column;
448     height: 100%;
449 }
450
451 #macro-editor .CodeMirror {
452     flex: 1;
453     font-size: 13px;
454 }
455
456 /* Hotpatch from latest CodeMirror: Fix gutter positioning */
457 .CodeMirror-gutter-wrapper {
458     position: absolute;
459 }
460
461 /* Small devices (tablets, 768px and up) */
462 @media (min-width: @screen-sm-min) {
463     #statusbar {
464         border-bottom-style: none;
465         border-radius: 6px 6px 0 0;
466         margin-bottom: -32px;
467     }
468 }
469
470 #keyboard-layout .layouts {
471     column-count: 2;
472 }
473
474 #keyboard-layout .layouts > div {
475     cursor: pointer;
476 }
477
478 .ui-keyboard-accept {
479     display: none;
480 }