diff -r f019ea6a9d31 -r ab90da2da45d www-thermferm/css/style.css --- a/www-thermferm/css/style.css Tue Jul 29 21:33:38 2014 +0200 +++ b/www-thermferm/css/style.css Wed Jul 30 15:26:29 2014 +0200 @@ -143,82 +143,145 @@ float: left; } -#fermentor_panel { - width: 240px; - height: 377px; +/* + * +-------------panel_top--------------+ + * |+----------------------++----------+| + * || || || + * || selector || powerled || + * || || || + * |+----------------------++----------+| + * +------------------------------------+ + * +-----------panel_display------------+ + * |+----------++----------++----------+| + * || display1 || display2 || display3 || + * |+----------++----------++----------+| + * +------------------------------------+ + * +-----------panel_control------------+ + * |+----------++----------++----------+| + * || led1 || led2 || led3 || + * |+----------++----------++----------+| + * |+----------++----------++----------+| + * || switch1 || switch2 || switch3 || + * |+----------++----------++----------+| + * +------------------------------------+ + */ + +#fermentor_panel_top { + width: 236px; + height: 143px; float: right; - background-color: #f0f0f0; + background-color: #bbb; + border: 2px solid; + border-color: #888; + border-radius: 5px 5px 5px 5px; + margin-bottom: 5px; } #fermentor_selector { - width: 160px; - height: 160px; + width: 158px; + height: 156px; float: left; } #fermentor_powerled { - width: 80px; - height: 160px; + width: 78px; + height: 56px; float: left; + text-align: center; + margin-top: 10px; +} + + +#fermentor_panel_display { + width: 236px; + height: 50px; + float: right; + background-color: #bbb; + border: 2px solid; + border-color: #888; + border-radius: 5px 5px 5px 5px; + margin-bottom: 5px; } #fermentor_display1 { - width: 80px; - height: 40px; + width: 79px; + height: 46px; float: left; + text-align: center; + margin-top: 7px; } #fermentor_display2 { - width: 80px; - height: 40px; + width: 78px; + height: 46px; float: left; + text-align: center; + margin-top: 7px; } #fermentor_display3 { - width: 80px; - height: 40px; + width: 79px; + height: 46px; float: left; + text-align: center; + margin-top: 7px; +} + +#fermentor_panel_control { + width: 236px; + height: 136px; + float: right; + background-color: #bbb; + border: 2px solid; + border-color: #888; + border-radius: 5px 5px 5px 5px; } #fermentor_led1 { - width: 80px; - height: 40px; + width: 79px; + height: 30px; float: left; + text-align: center; + margin-top: 10px; } #fermentor_led2 { - width: 80px; - height: 40px; + width: 78px; + height: 30px; float: left; + text-align: center; + margin-top: 10px; } #fermentor_led3 { - width: 80px; - height: 40px; + width: 79px; + height: 30px; float: left; + text-align: center; + margin-top: 10px; } #fermentor_toggle1 { - width: 80px; + width: 79px; height: 90px; float: left; + text-align: center; + margin-top: 10px; } #fermentor_toggle2 { - width: 80px; + width: 78px; height: 90px; float: left; + text-align: center; + margin-top: 10px; } #fermentor_toggle3 { - width: 80px; + width: 79px; height: 90px; float: left; + text-align: center; + margin-top: 10px; } -#fermentor_control { - width: 240px; - height: 40px; - float: left; -} -