97 * +----------------------------------------------------_ |
79 * +----------------------------------------------------_ |
98 * |+-------------------++--------++-------------------+| |
80 * |+-------------------++--------++-------------------+| |
99 * || || || || |
81 * || || || || |
100 * || || chiller|| || |
82 * || || chiller|| || |
101 * || || || || |
83 * || || || || |
102 * || |=--------+| || |
84 * || |+--------+| || |
103 * || Air temp |+--------+| Beer temp || |
85 * || Air temp | | Beer temp || |
104 * || || || || |
86 * || | | || |
105 * || || Temps || || |
87 * || | | || |
106 * || || digits || || |
88 * || | | || |
107 * |+-------------------++--------++-------------------+| |
89 * |+-------------------+ +-------------------+| |
108 * +----------------------------------------------------+ |
90 * +----------------------------------------------------+ |
109 */ |
91 */ |
110 |
92 |
111 #fermenter_thermometers { |
93 #fermenter_thermometers { |
112 width: 720px; |
94 width: 960px; |
113 height: 295px; |
95 height: 390px; |
|
96 float: left; |
114 background-color: #252526; |
97 background-color: #252526; |
115 margin: 5px; |
98 margin: 5px; |
116 border: 2px solid; |
99 border: 2px solid; |
117 border-color: #59b4d4; |
100 border-color: #59b4d4; |
118 border-radius: 5px 5px 5px 5px; |
101 border-radius: 5px 5px 5px 5px; |
119 } |
102 } |
120 |
103 |
|
104 /* |
|
105 * +----------panel_top------------+ |
|
106 * |+-------------++--------------+| |
|
107 * || || powerled || |
|
108 * || selector |+--------------+| |
|
109 * || |+--------------+| |
|
110 * || || mode control || |
|
111 * |+-------------++--------------+| |
|
112 * +-------------------------------+ |
|
113 * +---------panel_display---------+ |
|
114 * |+--------++---------++--------+| |
|
115 * || disp 1 || disp 2 || disp 3 || |
|
116 * |+--------++---------++--------+| |
|
117 * +-------------------------------+ |
|
118 * +---------panel_control---------+ |
|
119 * |+--------++---------++--------+| |
|
120 * || led 1 || led 2 || led 3 || |
|
121 * |+--------++---------++--------+| |
|
122 * |+--------++---------++--------+| |
|
123 * || sw 1 || sw 2 || sw 3 || |
|
124 * |+--------++---------++--------+| |
|
125 * +-------------------------------+ |
|
126 * +--------panel_buttons----------+ |
|
127 * | | |
|
128 * +-------------------------------+ |
|
129 */ |
|
130 #fermentor_panel_top { |
|
131 width: 280px; |
|
132 height: 200px; |
|
133 float: right; |
|
134 margin: 5px; |
|
135 background-color: #252526; |
|
136 border: 2px solid; |
|
137 border-color: #59b4d4; |
|
138 border-radius: 5px 5px 5px 5px; |
|
139 } |
|
140 |
|
141 #fermentor_selector { |
|
142 width: 100px; |
|
143 height: 198px; |
|
144 float: left; |
|
145 } |
|
146 |
|
147 input.select { |
|
148 margin-left: 10px; |
|
149 margin-top: 13px; |
|
150 } |
|
151 |
|
152 #fermentor_alarmled { |
|
153 width: 50px; |
|
154 height: 30px; |
|
155 float: left; |
|
156 text-align: center; |
|
157 margin-top: 10px; |
|
158 margin-left: 20px; |
|
159 } |
|
160 |
|
161 #fermentor_powerled { |
|
162 width: 50px; |
|
163 height: 30px; |
|
164 float: left; |
|
165 text-align: center; |
|
166 margin-top: 10px; |
|
167 margin-left: 42px; |
|
168 } |
|
169 |
|
170 #fermentor_mode_control { |
|
171 width: 148px; |
|
172 height: 110px; |
|
173 float: left; |
|
174 margin-top: 10px; |
|
175 background-color: #ddd; |
|
176 } |
|
177 |
|
178 #fermentor_panel_display { |
|
179 width: 280px; |
|
180 height: 80px; |
|
181 float: right; |
|
182 margin: 5px; |
|
183 background-color: #252526; |
|
184 border: 2px solid; |
|
185 border-color: #59b4d4; |
|
186 border-radius: 5px 5px 5px 5px; |
|
187 margin-bottom: 3px; |
|
188 } |
|
189 |
|
190 #fermentor_display1 { |
|
191 width: 93px; |
|
192 height: 76px; |
|
193 float: left; |
|
194 text-align: center; |
|
195 margin-top: 7px; |
|
196 } |
|
197 |
|
198 #fermentor_display2 { |
|
199 width: 93px; |
|
200 height: 76px; |
|
201 float: left; |
|
202 text-align: center; |
|
203 margin-top: 7px; |
|
204 } |
|
205 |
|
206 #fermentor_display3 { |
|
207 width: 93px; |
|
208 height: 76px; |
|
209 float: left; |
|
210 text-align: center; |
|
211 margin-top: 7px; |
|
212 } |
|
213 |
|
214 .dtemp { |
|
215 font-weight: bold; |
|
216 color: yellow; |
|
217 } |
|
218 |
|
219 .ltemp { |
|
220 font-weight: bold; |
|
221 color: green; |
|
222 } |
|
223 |
|
224 .htemp { |
|
225 font-weight: bold; |
|
226 color: red; |
|
227 } |
|
228 |
|
229 #fermentor_panel_control { |
|
230 width: 280px; |
|
231 height: 120px; |
|
232 float: right; |
|
233 margin: 5px; |
|
234 background-color: #252526; |
|
235 border: 2px solid; |
|
236 border-color: #59b4d4; |
|
237 border-radius: 5px 5px 5px 5px; |
|
238 margin-bottom: 3px; |
|
239 } |
|
240 |
|
241 #fermentor_led1 { |
|
242 width: 93px; |
|
243 height: 30px; |
|
244 float: left; |
|
245 text-align: center; |
|
246 margin-top: 8px; |
|
247 } |
|
248 |
|
249 #fermentor_led2 { |
|
250 width: 93px; |
|
251 height: 30px; |
|
252 float: left; |
|
253 text-align: center; |
|
254 margin-top: 8px; |
|
255 } |
|
256 |
|
257 #fermentor_led3 { |
|
258 width: 93px; |
|
259 height: 30px; |
|
260 float: left; |
|
261 text-align: center; |
|
262 margin-top: 8px; |
|
263 } |
|
264 |
|
265 #fermentor_toggle1 { |
|
266 width: 93px; |
|
267 height: 70px; |
|
268 float: left; |
|
269 text-align: center; |
|
270 margin-top: 10px; |
|
271 } |
|
272 |
|
273 #fermentor_toggle2 { |
|
274 width: 93px; |
|
275 height: 70px; |
|
276 float: left; |
|
277 text-align: center; |
|
278 margin-top: 10px; |
|
279 } |
|
280 |
|
281 #fermentor_toggle3 { |
|
282 width: 93px; |
|
283 height: 70px; |
|
284 float: left; |
|
285 text-align: center; |
|
286 margin-top: 10px; |
|
287 } |
|
288 |
|
289 |
|
290 #fermentor_panel_buttons { |
|
291 width: 280px; |
|
292 height: 130px; |
|
293 float: right; |
|
294 margin: 5px; |
|
295 background-color: #252526; |
|
296 border: 2px solid; |
|
297 border-color: #59b4d4; |
|
298 border-radius: 5px 5px 5px 5px; |
|
299 margin-bottom: 3px; |
|
300 } |
121 |
301 |
122 |
302 |
123 #fermenter_tempdigits { |
303 #fermenter_tempdigits { |
124 width: 145px; |
304 width: 145px; |
125 height: 120px; |
305 height: 120px; |
130 border-color: #59b4d4; |
310 border-color: #59b4d4; |
131 border-radius: 5px 5px 5px 5px; |
311 border-radius: 5px 5px 5px 5px; |
132 } |
312 } |
133 |
313 |
134 |
314 |
135 /* |
315 |
136 .LEDred_on { |
316 .LEDred_on { |
137 margin: 5px auto; |
317 margin: 5px auto; |
138 width: 12px; |
318 width: 18px; |
139 height: 12px; |
319 height: 18px; |
140 background-color: #F40; |
320 background-color: #F40; |
141 border-radius: 50%; |
321 border-radius: 50%; |
142 box-shadow: #000 0 0px 4px 1px, inset #C33 0 -1px 5px, #f44 0 2px 12px; |
322 box-shadow: #000 0 0px 4px 1px, inset #C33 0 -1px 5px, #f44 0 2px 12px; |
143 } |
323 } |
144 |
324 |
145 .LEDred_off { |
325 .LEDred_off { |
146 margin: 5px auto; |
326 margin: 5px auto; |
147 width: 12px; |
327 width: 18px; |
148 height: 12px; |
328 height: 18px; |
149 background-color: #820; |
329 background-color: #820; |
150 border-radius: 50%; |
330 border-radius: 50%; |
151 box-shadow: #400 0 0px 1px 1px; |
331 box-shadow: #400 0 0px 1px 1px; |
152 } |
332 } |
153 |
333 |
154 .LEDyellow_on { |
334 .LEDyellow_on { |
155 margin: 5px auto; |
335 margin: 5px auto; |
156 width: 12px; |
336 width: 18px; |
157 height: 12px; |
337 height: 18px; |
158 background-color: #FF0; |
338 background-color: #FF0; |
159 border-radius: 50%; |
339 border-radius: 50%; |
160 box-shadow: #000 0 0px 4px 1px, inset #860 0 -1px 5px, #DD0 0 2px 12px; |
340 box-shadow: #000 0 0px 4px 1px, inset #860 0 -1px 5px, #DD0 0 2px 12px; |
161 } |
341 } |
162 |
342 |
163 .LEDyellow_off { |
343 .LEDyellow_off { |
164 margin: 5px auto; |
344 margin: 5px auto; |
165 width: 12px; |
345 width: 18px; |
166 height: 12px; |
346 height: 18px; |
167 background-color: #A90; |
347 background-color: #A90; |
168 border-radius: 50%; |
348 border-radius: 50%; |
169 box-shadow: #440 0 0px 1px 1px; |
349 box-shadow: #440 0 0px 1px 1px; |
170 } |
350 } |
171 |
351 |
172 .LEDgreen_on { |
352 .LEDgreen_on { |
173 margin: 5px auto; |
353 margin: 5px auto; |
174 width: 12px; |
354 width: 18px; |
175 height: 12px; |
355 height: 18px; |
176 background-color: #5E0; |
356 background-color: #5E0; |
177 border-radius: 50%; |
357 border-radius: 50%; |
178 box-shadow: #000 0 0px 4px 1px, inset #270 0 -1px 5px, #5D0 0 2px 12px; |
358 box-shadow: #000 0 0px 4px 1px, inset #270 0 -1px 5px, #5D0 0 2px 12px; |
179 } |
359 } |
180 |
360 |
181 .LEDgreen_off { |
361 .LEDgreen_off { |
182 margin: 5px auto; |
362 margin: 5px auto; |
183 width: 12px; |
363 width: 18px; |
184 height: 12px; |
364 height: 18px; |
185 background-color: #270; |
365 background-color: #270; |
186 border-radius: 50%; |
366 border-radius: 50%; |
187 box-shadow: #250 0 0px 1px 1px; |
367 box-shadow: #250 0 0px 1px 1px; |
188 } |
368 } |
189 |
369 |
190 .LEDblue_on { |
370 .LEDblue_on { |
191 margin: 5px auto; |
371 margin: 5px auto; |
192 width: 12px; |
372 width: 18px; |
193 height: 12px; |
373 height: 18px; |
194 background-color: #4AF; |
374 background-color: #4AF; |
195 border-radius: 50%; |
375 border-radius: 50%; |
196 box-shadow: #000 0 0px 4px 1px, inset #247 0 -1px 5px, #48F 0 2px 12px; |
376 box-shadow: #000 0 0px 4px 1px, inset #247 0 -1px 5px, #48F 0 2px 12px; |
197 } |
377 } |
198 |
378 |
199 .LEDblue_off { |
379 .LEDblue_off { |
200 margin: 5px auto; |
380 margin: 5px auto; |
201 width: 12px; |
381 width: 18px; |
202 height: 12px; |
382 height: 18px; |
203 background-color: #137; |
383 background-color: #137; |
204 border-radius: 50%; |
384 border-radius: 50%; |
205 box-shadow: #024 0 0px 1px 1px; |
385 box-shadow: #024 0 0px 1px 1px; |
206 } |
386 } |
207 */ |
387 |
208 |
388 |
209 |
389 |
210 /* |
390 /* |
211 * New recipe wizzard |
391 * New recipe wizzard |
212 */ |
392 */ |