|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
1 |
#console_body { |
2 |
background-color: black; |
|
|
346
by mattgiuca
consolee/console.css: |
3 |
position: absolute; |
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
4 |
color: white; |
5 |
padding: 0; |
|
6 |
width: 100%; |
|
|
346
by mattgiuca
consolee/console.css: |
7 |
top: 0; |
8 |
bottom: 0; |
|
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
9 |
}
|
10 |
/* console_body when displayed as a window panel and not the whole app */
|
|
11 |
#console_body.windowpane { |
|
12 |
position: fixed; |
|
|
346
by mattgiuca
consolee/console.css: |
13 |
top: auto; /* Do not fix to top */ |
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
14 |
bottom: 0; |
15 |
left: 0; |
|
16 |
right: 0; |
|
|
332
by mattgiuca
console plugin: Now presents minimize/maximize buttons, allowing itself to be |
17 |
z-index: 1; /* Go in front of console_filler */ |
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
18 |
}
|
|
346
by mattgiuca
consolee/console.css: |
19 |
#console_body.windowpane #console_body2 { |
20 |
/* Need some padding in windowpane mode */
|
|
21 |
/* (In full mode, things are positioned absolutely) */
|
|
|
332
by mattgiuca
console plugin: Now presents minimize/maximize buttons, allowing itself to be |
22 |
padding: 0.5em; |
23 |
}
|
|
24 |
/* Heading bar */
|
|
25 |
#console_heading { |
|
26 |
background-color: gray; |
|
27 |
border: 2px solid black; |
|
28 |
padding: 2px; |
|
29 |
color: black; |
|
30 |
font-family: monospace; |
|
31 |
font-weight: bold; |
|
32 |
}
|
|
33 |
/* If "minimized", console_heading and console_output are hidden */
|
|
34 |
#console_body.minimal #console_heading, |
|
35 |
#console_body.minimal #console_output, |
|
36 |
/* If "maximized", the maximize button is hidden */
|
|
37 |
#console_body.maximal .maximize { |
|
38 |
display: none; |
|
39 |
}
|
|
40 |
/* Minimize/maximize button */
|
|
41 |
.console_button { |
|
42 |
cursor: pointer; /* Display hand cursor, since this is a button */ |
|
43 |
position: absolute; |
|
44 |
right: 0.5em; |
|
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
45 |
}
|
|
328
by mattgiuca
console: Renamed HTML element IDs to prefix "console_". |
46 |
#console_output { |
|
346
by mattgiuca
consolee/console.css: |
47 |
/*height: 20em;*/ /* Might be needed for windowpane mode */ |
48 |
/*margin-bottom: 0.5em;*/
|
|
49 |
position: absolute; |
|
50 |
/* 2em is to accomodate the header bar, and some padding */
|
|
51 |
top: 2em; |
|
52 |
/* 2.5em is to accomodate the input bar, and padding either side */
|
|
53 |
bottom: 2.5em; |
|
54 |
/* left and right 0.5em are just for horizontal padding */
|
|
55 |
left: 0.5em; |
|
56 |
right: 0.5em; |
|
57 |
/* Display scroll bars */
|
|
58 |
overflow: scroll; |
|
|
382
by mattgiuca
media/console/console.css: CSS hack to remove horizontal scrollbar on some |
59 |
/* Some browsers support overflow-x and overflow-y. In this case, use
|
60 |
* overflow-x: auto to disable the horizontal scroll bar.
|
|
61 |
* (If unsupported this will simply fall back to a harmless but annoying
|
|
62 |
* horizontal scroll bar).
|
|
63 |
*/
|
|
64 |
overflow-x: auto; |
|
|
346
by mattgiuca
consolee/console.css: |
65 |
}
|
66 |
#console_body.windowpane #console_output { |
|
67 |
/* Don't want this absolutely positioned in windowpane mode */
|
|
68 |
position: static; |
|
69 |
/* Give it an explicit height instead */
|
|
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
70 |
height: 20em; |
|
332
by mattgiuca
console plugin: Now presents minimize/maximize buttons, allowing itself to be |
71 |
margin-bottom: 0.5em; |
|
276
by mattgiuca
Console now runs inside IVLE (without requiring an IFRAME). The separate |
72 |
}
|
|
328
by mattgiuca
console: Renamed HTML element IDs to prefix "console_". |
73 |
#console_input { |
|
346
by mattgiuca
consolee/console.css: |
74 |
position: absolute; |
75 |
/* Input bar goes along the bottom. Pad all sides */
|
|
76 |
left: 0.5em; |
|
77 |
right: 0.5em; |
|
78 |
bottom: 0.5em; |
|
79 |
}
|
|
80 |
#console_body.windowpane #console_input { |
|
81 |
/* Don't want this absolutely positioned in windowpane mode */
|
|
82 |
position: static; |
|
|
276
by mattgiuca
Console now runs inside IVLE (without requiring an IFRAME). The separate |
83 |
}
|
|
328
by mattgiuca
console: Renamed HTML element IDs to prefix "console_". |
84 |
#console_prompt { |
|
276
by mattgiuca
Console now runs inside IVLE (without requiring an IFRAME). The separate |
85 |
font-family: monospace; |
86 |
}
|
|
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
87 |
#console_inputText { |
88 |
background-color: black; |
|
89 |
color: white; |
|
90 |
width: 90%; |
|
91 |
}
|
|
92 |
/* console filler takes up the same space as console_body.windowpane
|
|
93 |
* but its position is relative, not fixed.
|
|
94 |
* This avoids having the console overlap with the bottom 28em of page
|
|
|
332
by mattgiuca
console plugin: Now presents minimize/maximize buttons, allowing itself to be |
95 |
* content.
|
96 |
* It has two classes. "windowpane" turns it on. "minimal" or "maximal"
|
|
97 |
* control its height.
|
|
98 |
*/
|
|
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
99 |
#console_filler { |
100 |
display: none; |
|
101 |
}
|
|
102 |
#console_filler.windowpane { |
|
103 |
display: block; |
|
|
332
by mattgiuca
console plugin: Now presents minimize/maximize buttons, allowing itself to be |
104 |
z-index: -1; /* Go behind the actual console */ |
105 |
width: 100%; |
|
106 |
position: relative; |
|
107 |
bottom: 0; |
|
108 |
left: 0; |
|
109 |
right: 0; |
|
110 |
}
|
|
111 |
#console_filler.maximal { |
|
112 |
/* total height of console = 20em + 1em + 0.5em + 0.5em + 0.5em + 1em + borders
|
|
113 |
*/
|
|
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
114 |
height: 24em; |
|
332
by mattgiuca
console plugin: Now presents minimize/maximize buttons, allowing itself to be |
115 |
}
|
116 |
#console_filler.minimal { |
|
117 |
/* total height of console = 1em + 0.5em + 0.5em
|
|
118 |
*/
|
|
119 |
height: 2em; |
|
|
331
by mattgiuca
Console: Configured console to display properly as a "floating" window in the |
120 |
}
|
|
276
by mattgiuca
Console now runs inside IVLE (without requiring an IFRAME). The separate |
121 |
pre.errorMsg { |
122 |
color: red; |
|
123 |
margin-top: 0em; |
|
124 |
margin-bottom: 0em; |
|
125 |
}
|
|
126 |
pre.inputMsg { |
|
127 |
color: gray; |
|
128 |
margin-top: 0em; |
|
129 |
margin-bottom: 0em; |
|
130 |
}
|
|
131 |
pre.outputMsg { |
|
132 |
margin-top: 0em; |
|
133 |
margin-bottom: 0em; |
|
134 |
}
|