PluginProbe
WPIDE – File Manager & Code Editor / 2.4.0
WPIDE – File Manager & Code Editor v2.4.0
3.5.8 3.5.7 2.0.14 2.0.15 2.0.16 2.0.2 2.0.4 2.0.5 2.0.6 2.0.7 2.0.8 2.0.9 2.1 2.2 2.3 2.3.1 2.3.2 2.4.0 2.5 2.6 3.0 3.1 3.2 3.3 3.4 All 54 releases
wpide / wpide.css

wpide.css in WPIDE – File Manager & Code Editor 2.4.0, at wpide.css

703 lines 14.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* This is to make sure the IDE does not overlap anything else in the window */
2 .toplevel_page_wpide #wpcontent {
3 z-index: 10;
4 position: relative;
5 }
6
7 #quicktags, #post-status-info, #editor-toolbar, #newcontent, .ace_print_margin { display: none; }
8 #fancyeditordiv {
9 position: relative;
10 width: 70%;
11 height: 400px;
12 }
13 #template div{margin-right:0 !important;}
14
15 #fancyeditordiv #resizer {
16 width: 16px;
17 height: 16px;
18 position: absolute;
19 bottom: 0px;
20 right: 0px;
21 cursor: nw-resize;
22 background-image: url( 'images/resize-handle.png' );
23 }
24 #template div{margin-right:0 !important;}
25
26 #wpide_toolbar{
27 width: 75%;
28 min-height: 30px;
29 text-align: right;
30 padding-top: 5px;
31 position: relative;
32 float: left;
33 }
34 #wpide_toolbar form{
35 position: absolute;
36 left: 104%;
37 }
38 #wpide_toolbar_tabs{
39 width:100%;
40 }
41
42 #wpide_toolbar .wpide_tab {
43 position:relative;
44 height: 18px;
45 font: 13px/18px Arial,Helvetica,sans-serif normal;
46 margin-top: -2px;
47 margin-right: 2px;
48 padding: 6px;
49 padding-right:20px;
50 float: left;
51 cursor: pointer;
52 border-width: 1px;
53 border-style: solid;
54 -webkit-border-top-right-radius: 3px;
55 -webkit-border-top-left-radius: 3px;
56 border-top-right-radius: 3px;
57 border-top-left-radius: 3px;
58 background-color: #E8E8E8;
59 border-color: #DFDFDF #DFDFDF #CCC;
60 color: #B00001;
61 text-decoration: none;
62 font-style: italic;
63 -moz-opacity:.60;
64 filter:alpha(opacity=60);
65 opacity:.60;
66 }
67 #wpide_toolbar .wpide_tab.active {
68 -moz-opacity:1;
69 filter:alpha(opacity=1);
70 opacity:1;
71 border-left-color:#bbb;
72 border-right-color:#bbb;
73 border-top-color:#bbb;
74 border-bottom-color:#dedede;
75 }
76 #wpide_toolbar .wpide_tab.modified {
77 color: blue;
78 font-weight: bold;
79 }
80 #wpide_toolbar .wpide-tab.modified:after {
81 content: ' *';
82 }
83
84 #wpide_toolbar .close_tab {
85 color: #575757;
86 font-style: normal;
87 padding-bottom: 7px;
88 padding-left: 7px;
89 position: absolute;
90 right: 3px;
91 text-decoration: none;
92 top: -2px;
93 outline: none !important;
94 }
95 #wpide_toolbar .close_tab:hover{
96 color:#B00001;
97 font-weight:bold;
98 }
99 #wpide_toolbar .close_tab:active {
100 color: #444444;
101 font-weight: bold;
102 }
103
104 #wpide_file_browser{
105 margin-right:2%;
106 text-align:left;
107 }
108
109 .toplevel_page_wpide #submitdiv,
110 .toplevel_page_wpide #docinfodiv h3.hndle{
111 width:100%;
112 float:right;
113 clear:right;
114 }
115 .toplevel_page_wpide #submitdiv h3.hndle,
116 .toplevel_page_wpide #docinfodiv h3.hndle{
117 font-family: Georgia,"Times New Roman";
118 font-size: 15px;
119 font-weight: bold;
120 padding: 7px 10px;
121 margin: 0;
122 line-height: 1;
123 }
124
125 #wpide_toolbar_buttons {
126 position:relative;
127 min-height:30px;
128 width:75%;
129 float:left;
130 clear:left;
131 text-align:left;
132 overflow:hidden;
133 border-bottom: 1px solid #CCC;
134 background-color: #E9E9E9;
135 background-image: -ms-linear-gradient(bottom,#ddd,#e9e9e9);
136 background-image: -moz-linear-gradient(bottom,#ddd,#e9e9e9);
137 background-image: -o-linear-gradient(bottom,#ddd,#e9e9e9);
138 background-image: -webkit-linear-gradient(bottom,#ddd,#e9e9e9);
139 background-image: linear-gradient(bottom,#ddd,#e9e9e9);
140
141 -webkit-border-top-right-radius: 6px;
142 -webkit-border-top-left-radius: 0px;
143 border-top-right-radius: 6px;
144 border-top-left-radius: 0px;
145 }
146
147 #wpide_toolbar_buttons a{
148 display: block;
149 float: right;
150 margin: 2px;
151 padding: 0 10px;
152 height: auto;
153 margin-top: 4px;
154 }
155 #wpide_toolbar_buttons .red{
156 color:#bc201d;
157 }
158
159 #wpwrap div.ace_gutter{
160 background-color:#f4f4f4;
161 color:#aaa;
162 z-index:999;
163 }
164
165 /* The above fix will make tooltips hide behind the gutter.
166 This will bring them in front. */
167 #wpwrap .ace_gutter-tooltip {
168 z-index: 1000;
169 }
170
171 #wpide_save_container{
172 float: left;
173 clear: left;
174 width: 74%;
175 padding: 0.5%;
176 background-color: #E9E9E9;
177
178 border-color: #CCC;
179 -webkit-box-shadow: inset 0 1px 0 #fff;
180 box-shadow: inset 0 1px 0 #fff;
181 -webkit-border-radius: 3px;
182 border-radius: 3px;
183 }
184
185 #wpide_info {
186 position: relative;
187 min-height: 30px;
188 width: 100%;
189 margin-top: 35px;
190 padding-right:2px;
191 float: right;
192 clear: right;
193 text-align: left;
194 overflow: visible;
195 border-bottom: 1px solid #CCC;
196 background-color: #E9E9E9;
197 background-image: -ms-linear-gradient(bottom,#DDD,#E9E9E9);
198 background-image: -moz-linear-gradient(bottom,#DDD,#E9E9E9);
199 background-image: -o-linear-gradient(bottom,#DDD,#E9E9E9);
200 background-image: -webkit-linear-gradient(bottom,#DDD,#E9E9E9);
201 background-image: linear-gradient(bottom,#DDD,#E9E9E9);
202 -webkit-border-top-right-radius: 0px;
203 -webkit-border-top-left-radius: 6px;
204 border-top-right-radius: 0px;
205 border-top-left-radius: 6px;
206
207 }
208
209 #wpide_info_content{
210 margin-top: 8px;
211 margin-left: 10px;
212 }
213 .wpide_func_highlight,
214 .wpide_func_highlight_black {
215 font-size: 120%;
216 }
217 .wpide_func_highlight{
218 color: #4A8EAD;
219 }
220 .wpide_func_params{
221 padding-left:10px;
222 display: block;
223 color:#555;
224 font-family: courier;
225 }
226 .wpide_func_desc{
227 color:#333;
228 }
229 .wpide_func_arg_notrequired{
230 color:#888;
231 }
232 .wpide_func_arg_notrequired em{
233 color: green;
234 display: block;
235 font-size: 80%;
236 line-height: 100%;
237 }
238
239 .inner-sidebar{
240 background-image: url(images/wpide_logo.jpg);
241 background-repeat: no-repeat;
242 background-position: top right;
243 }
244
245 #fancyeditordiv{
246 width:75%;
247 height:1000px;
248 margin-right:0!important;
249 float:left;
250 min-height: 230px;
251 /* Stop browser text selection of the editor.
252 This will not stop selection IN the editor. */
253 -webkit-user-select: none;
254 -moz-user-select: none;
255 user-select: none;
256 }
257
258 #wpide_message{
259 display:none;
260 width: 80%;
261 float: left;
262 text-align: left;
263 margin: 0;
264 padding: 7px;
265 }
266
267 #wpide_message a{
268 float:none;
269 display:inline-block;
270 margin:2px;
271 }
272
273 #wpide_message span{
274 width: 80%;
275 }
276
277 #wpide_message .note{
278 font-size: 10px;
279 margin: 10px 0;
280 display: block;
281 }
282
283 #wpide_footer_message,
284 #wpide_footer_message_last_saved,
285 #wpide_footer_message_unsaved{
286 display:none;
287 float: left;
288 padding: 8px;
289 font-size: 12px;
290 color: #666;
291 }
292 #wpide_footer_message_unsaved{
293 color:#bc201d;
294 }
295
296 #wpide_save{
297 float: right;
298 }
299
300 #wpide_git{
301 float: right;
302 margin-right: 20px;
303 background-image: url(images/git.png);
304 background-repeat: no-repeat;
305 background-position: right center;
306 padding-right: 30px;
307 }
308
309 /* Make sure the modal window doesn't get hidden behind wp toolbar */
310 .ui-dialog{
311 margin-top:30px; /* this just is not working - the WP admin toolbar gets in the way */
312 }
313
314 #gitdiv{
315 display:none;
316 background-color: #efefef;
317 }
318 #gitdiv .red{
319 color: #bc201d;
320 }
321 #gitdivcontent{
322 margin:10px;
323 }
324
325 .git_settings_panel{
326 overflow: hidden;
327 margin:20px 0px;
328 }
329 .input_row{
330 padding: 5px;
331 width: 99%;
332 background-color: #ddd;
333 margin: 2px;
334 display:block;
335 }
336 .input_row input[type=text]{
337 width:98%;
338 }
339 .input_row .input_row em{
340 margin: 2px;
341 font-size: 10px;
342 }
343
344 .git_settings_panel .input_row,
345 .git_settings_panel .input_row em,
346 .git_settings_panel label,
347 .git_settings_panel input[type=text]{
348 float:left;
349 clear:left;
350 }
351
352 .git_log .input_row{
353 padding: 5px;
354 width: 99%;
355 background-color: #ddd;
356 margin: 2px;
357 float: left;
358 }
359 .git_log .input_row .message{
360 display:block;
361 font-weight:bold;
362 margin-bottom:10px;
363 }
364
365 #gitdiv label,
366 #gitdiv input[type=text],
367 #gitdiv a.button{
368 margin:2px;
369 }
370 #gitdiv label{
371 font-weight:bold;
372 }
373
374 #gitdiv .button{
375 text-align: center;
376 height: inherit;
377 line-height: 130%;
378 padding-top: 10px;
379 font-weight:bold;
380 }
381 #gitdiv .button em{
382 display:block;
383 font-size: 10px;
384 font-weight:normal;
385 }
386
387 .gitfilerow{
388 background-color: #bbb;
389 padding: 10px;
390
391
392 }
393 .gitfilerow:hover{
394
395 }
396 .gitfilerow.light{
397 background-color: #ddd;
398 }
399 .gitfilerow input[type=checkbox]{
400 margin-right:20px;
401 }
402 .gitfilerow .filename{
403 width: 70%;
404 display: block;
405 float: left;
406 }
407 .gitfilerow .viewdiff{
408 color: #bc201d;
409 }
410
411 #gitdivcommit{
412 margin-top:20px;
413 padding:10px;
414 border: 1px solid #bbb;
415 }
416 #gitdivcommit a.button-primary{
417 margin-left: 8px;
418 }
419 #gitdiv input.message{
420 width:70%;
421 }
422
423 .gitdivdiff{
424 margin-top: 10px;
425 }
426 .gitdivdiff .diff_line{
427 display:block;
428 padding:5px;
429 font-size:11px;
430 background-color:#fff;
431 }
432 .gitdivdiff .diff_line.plus{
433 background-color:#b5ffce;
434 }
435 .gitdivdiff .diff_line.minus{
436 background-color:#fad3e5;
437 }
438
439 .gitdivdiff .diff-addedline,
440 .gitdivdiff .diff-deletedline{
441 font-size:10px;
442 line-height:130%;
443 }
444
445 #publishing-action img{
446 visibility: hidden;
447 }
448
449 div#side-info-column{
450 width:23%;
451 }
452 #submitdiv.postbox{
453 min-width:220px;
454 }
455
456 /* color assist */
457 .ImageColorPickerWrapper{
458 height: 300px;
459 width: 100%;
460 overflow: scroll;
461 }
462 #wpide_color_assist{
463 position:relative;
464 width: 100%;
465 background-color: whiteSmoke;
466 margin: auto;
467 border: 1px solid #CCC;
468 padding-right: 2px;
469 margin-left: -2px;
470 height: 380px;
471 }
472 #wpide_color_assist img, #wpide_color_assist canvas{
473 margin:auto;
474 display:block;
475 }
476 #wpide_color_assist canvas.ImageColorPickerCanvasColor{
477 position:absolute;
478 left:0;
479 top:0;
480 }
481 #wpide_color_assist input[type=button]{
482 float:left;
483 width:110px;
484 margin: 15px 5px;
485 font-size: 12px;
486 }
487 #wpide_color_assist_input{
488 float:left;
489 width:100px;
490 margin: 15px 5px;
491 }
492
493 .close_color_picker{
494 padding-bottom: 7px;
495 padding-left: 7px;
496 position: absolute;
497 right: 20px;
498 top: 5px;
499 }
500 .close_color_picker a{
501 color: #575757;
502 font-style: normal;
503 text-decoration: none;
504 font-size: 16px;
505 }
506
507 #wpide_color_assist h3{
508 background-color: #F1F1F1;
509 background-image: -ms-linear-gradient(top,#F9F9F9,#ECECEC);
510 background-image: -moz-linear-gradient(top,#F9F9F9,#ECECEC);
511 background-image: -o-linear-gradient(top,#F9F9F9,#ECECEC);
512 background-image: -webkit-gradient(linear,left top,left bottom,from(#F9F9F9),to(#ECECEC));
513 background-image: -webkit-linear-gradient(top,#F9F9F9,#ECECEC);
514 background-image: linear-gradient(top,#F9F9F9,#ECECEC);
515
516 -webkit-border-top-left-radius: 3px;
517 -webkit-border-top-right-radius: 3px;
518 border-top-left-radius: 3px;
519 border-top-right-radius: 3px;
520 }
521
522 .currentColor, .selectedColor {
523 border: 1px solid #000;
524 background-color: #fff;
525 width:30px;
526 height:30px;
527 }
528
529 .ImageColorPickerCanvas {
530 cursor:crosshair;
531 }
532
533 div.ImageColorPickerWrapper{
534
535 }
536
537 #wpfooter{
538 display:none;
539 }
540 #wpbody-content{
541 padding-bottom:0;
542 }
543
544 .wpide-settings {
545 height: 20px;
546 width: 20px;
547 background-image: url( images/settings.png );
548 background-repeat: no-repeat;
549 background-position: 2px 2px;
550 display: inline-block;
551 border: 1px solid transparent;
552 border-radius: 2px;
553 padding: 2px;
554 position: absolute;
555 right: 2px;
556 top: 2px;
557 }
558
559 .editor_settings_dialog-minbutton {
560 display: none;
561 }
562
563 .wpide-settings:hover {
564 border-color: #666666;
565 background-color: #F2F2F2;
566 }
567
568 /* Settings Dialog */
569 #editor_settings_dialog label {
570 display: inline-block;
571 width: 100%;
572 margin: 4px 0;
573 font-weight: bold;
574 }
575 #editor_settings_dialog label .ipt-sel {
576 width: 125px;
577 }
578 #editor_settings_dialog label .number {
579 width: 117px;
580 }
581 #editor_settings_dialog label input, #editor_settings_dialog label select {
582 float: right;
583 font-weight: normal;
584 }
585 #editor_settings_dialog .left {
586 float: left;
587 width: 48%;
588 }
589 #editor_settings_dialog .right {
590 float: right;
591 width: 48%;
592 }
593
594 #editor_find_dialog {
595 overflow: hidden;
596 }
597 #editor_find_dialog_minimized {
598 float: right;
599 }
600 #editor_find_dialog label {
601 display: block;
602 width: 40%;
603 }
604 #editor_find_dialog label.left {
605 display: inline-block;
606 float: left;
607 width: 65%;
608 }
609 #editor_find_dialog input.action_button {
610 display: inline-block;
611 float: right;
612 width: 100%;
613 }
614 #editor_find_dialog input.action_button:active {
615 box-shadow: 0 0 5px lightGrey inset
616 }
617 #editor_find_dialog label.left input {
618 float: right;
619 width: 190px;
620 }
621 #editor_find_dialog div.search_direction {
622 display: inline-block;
623 position: absolute;
624 bottom: 10px;
625 right: 10px;
626 width: 30%;
627 }
628 #editor_find_dialog div.search_direction label {
629 width: 100%;
630 }
631 #editor_find_dialog div.right {
632 display: inline-block;
633 position: absolute;
634 top: 4px;
635 right: 10px;
636 width: 30%
637 }
638 #editor_find_dialog div.right input {
639 border: 1px solid #dfdfdf;
640 background-color: #fefefe;
641 border-radius: 2px;
642 }
643 #editor_find_dialog div.right input:hover {
644 border-color: #AAAAAA;
645 }
646
647 ul.jqueryFileTree a {
648 overflow: hidden;
649 text-overflow: ellipsis;
650 min-width: 123px;
651 margin-right: 26px;
652 }
653
654 .jqueryFileTree .create_new a {
655 min-width: 24px;
656 max-width: 24px;
657 width: 24px;
658 }
659
660 .jqueryFileTree .directory > a,
661 .jqueryFileTree .file > a {
662 border: 1px solid transparent;
663 outline: none !important;
664 }
665
666 .jqueryFileTree .filetree_delete:hover {
667 opacity: 1;
668 }
669
670 .jqueryFileTree .directory > a:hover,
671 .jqueryFileTree .file > a:hover {
672 background-color: #BDF;
673 border: 1px solid #BDF;
674 outline: none !important;
675 }
676
677 .jqueryFileTree .directory > a:active,
678 .jqueryFileTree .file > a:active {
679 border: 1px solid #AAF;
680 background-color: #BDF;
681 outline: none !important;
682 }
683
684 #wpide_file_browser .wpide-context-menu {
685 position: absolute;
686 background: white;
687 border: 1px solid #AAAAAA;
688 padding: 3px;
689 z-index: 100;
690 border-radius: 3px;
691 box-shadow: 6px 6px 11px -7px #333;
692 }
693 #wpide_file_browser .wpide-context-menu li {
694 list-style-type: none;
695 padding: 3px 6px 3px 20px;
696 -webkit-user-select: none;
697 user-select: none;
698 cursor: pointer;
699 font-size: 14px;
700 }
701 #wpide_file_browser .wpide-context-menu li:hover {
702 background-color: #DFDFDF;
703 }