1
2 /* Styles for game builder
3
4 TODO: put all of this in some order and comment it
5
6 */
7
8 html, body {
9 height: 100%;
10 background-color: #E8ECF2;
11 color: #0A3300;
12 font-size: 1.1em;
13 margin: 0;
14 padding: 0;
15 overflow: hidden;
16 }
17
18 h2 {
19 margin-top: 0;
20 text-align: center;
21 }
22
23 h3 {
24 color: #FCE17A;
25 }
26
27 a, a:visited, a:active { color: #A7C0E5; }
28
29 a:hover { color: #A8CBFF; }
30
31
32
33 #layout {
34 height: 100%;
35 }
36
37 #code-panel {
38 width: 59%;
39 height: 95%;
40 float:right;
41 padding: 0;
42 margin: 0;
43 }
44
45 #code-panel h1{
46 font-size: 1.5em;
47 color: #C6C3BF;
48 padding: 0;
49 margin: 0;
50 text-align: center;
51 }
52
53
54 #output-panel {
55 width: 39%;
56 float: left;
57 padding: 0;
58 height: 100%;
59 }
60
61
62 /* This class (and extraneous div tag) shouldn't have to exist
63 at all, but for some insane reason, the designers of CSS decided that
64 it shouldn't account for margins or borders or EVEN PADDING
65 anything when calculating height! */
66 .css-blows {
67 max-height: 95%;
68 overflow: auto;
69 }
70
71
72
73 #output-panel .tabContent {
74 padding: 1em;
75 background-color: #5878A6;
76 color: #FFFBF4;
77 }
78
79
80 ul.tablist {
81 padding: 0;
82 list-style: none;
83 margin: 0;
84 }
85
86
87 ul.tablist li { /* unselected tab */
88 display: inline-block;
89 margin: 0 0 0 .5em;
90 padding: .2em .6em;
91 cursor: pointer;
92 position: relative;
93 background-color: #B6B8BC;
94 color: #FFFFFF;
95 }
96
97 ul.tablist li.selected { /* selected tab */
98 background-color: #5878A6;
99 border-bottom-color: #5878A6;
100 color: #FFFFFF;
101 }
102
103 ul.tablist li:hover {
104 color: #A7C0E5;
105 background-color: #5878A6;
106 }
107
108
109
110
111 .errorhell { /* error area */
112 background-color: #FFF;
113 color: #A60000;
114 padding: 1em;
115 display: none;
116 font-family: monospace;
117 line-height: 1.5em;
118 }
119 .errorhell u { /* the snippet of bad code */
120 background-color: #A60000;
121 border: 1px solid #F2C1C1;
122 color: #FFFFFF;
123 text-decoration: none;
124 font-weight: bold;
125 padding: 1px;
126 white-space: nowrap;
127 }
128 .errorhell i { /* ellipsis to show snippet boundaries and returns */
129 font-style: normal;
130 color: #F2C1C1;
131 font-weight: normal;
132 }
133 .errorhell b { /* a correct code example */
134 background-color: #C9F76F;
135 border: 1px solid #679B00;
136 color: #000;
137 font-style: normal;
138 font-weight: bold;
139 padding: 1px;
140 white-space: nowrap;
141 }
142
143
144 #docs pre {
145 font-size: .9em;
146 max-width: 100%;
147 overflow: auto;
148 background-color: #1D3D6C;
149 padding: .4em;
150 border: 2px solid #9CB2D3;
151 }
152
153 #docs pre.snippet {
154 background-color: transparent;
155 border: none;
156 }
157
158 #docs img {
159 display: block;
160 margin: auto;
161 }
162
163
164 #structurearea {
165 font-size: .9em;
166 }
167
168
169 #buildarea {
170 width: 100%;
171 height: 400px;
172 }
173
174
175
176 #playarea {
177 background-color: #1D3D6C;
178 padding: 1em;
179 border: 2px solid #9CB2D3;
180 }
181
182 #playarea hr {
183 width: 100px;
184 border-style: none;
185 border-top: 1px dashed #999;
186 margin: 1em auto 1em auto;
187 }
188
189
190
191
192 textarea#source {
193 background-color: transparent;
194 color: #0A3300;
195 width: 100%;
196 height: 100%;
197 margin: 0;
198 padding: 0;
199 border: 0;
200 outline: none;
201 resize: none;
202 font-size: 1em;
203 border-top: 1px solid #C6C3BF;
204 }
205
206 /* ========================================================================== */
207
208 /* displaying pretty structure styles */
209
210 .disp-func { border: 2px solid #9CB2D3; margin-bottom: 1em; }
211 .disp-func .funcname { font-weight: bold; color: #FFF; background-color: #9CB2D3; display: block; padding: .1em; }
212 .disp-func-inner { padding:.3em; }
213 .disp-if { border: 2px solid #7695C4; }
214 .disp-if-test { background-color: #7695C4; display: block; padding: .1em; }
215 .disp-if-inner { padding:.5em; }
216 .disp-unk { background-color: red; }
217 .disp-print u { color: #A7C0E5; }
218 .disp-print b { color: #A7C0E5; }
219 .disp-statement { background-color: #819ECA; display: inline-block; padding: .1em; margin: .2em; }
220 .disp-var { font-weight: bold; color:#C0ED00; }
Ratfactor.com
>
Dave's Repos