www/css/style.css

Fri, 28 Sep 2018 17:29:23 +0200

author
Michiel Broek <mbroek@mbse.eu>
date
Fri, 28 Sep 2018 17:29:23 +0200
changeset 72
93a0be4f5be3
parent 71
e1c50b21b7e3
child 139
eb1ac7487710
permissions
-rw-r--r--

Added category and type to the recipe style. Added tooltips in the edit screen. Added Alcohol and Carbonation to the recipe style. Redesigned the main edit window and added the style limits.

/*
 */

body {
    background: #ccc;
    font-family: Verdana, Arial, sans-serif;
    margin: 0px;
}



#MainPanel {
    width: 1278px;
    height: 628px;
    border: 2px solid #4297d7;
    background: #252526;
    color: #eeeeee;
}



#water_totals {
    width: 960px;
    background: #353536;
    margin-top: 15px;
    border: 1px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


#about_table {
    width: 960px;
    background: #353536;
    margin: 150px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


#node_table {
    width: 600px;
    background: #353536;
    margin: 50px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}



#fermenter_table {
    width: 720px;
    background: #252526;
    margin: 5px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}



.temperature {
    display: inline-block;
    width: 64px;
    height: 20px;
    white-space: nowrap;
    color: #00eeee;
}



.NUM {
    font-family: "Arial Black", Gadget, sans-serif;
    color: #00eeee;
    padding: 2px;
    margin: 2px;
    background-color: #212121;
}


/*
 * +----------------------------------------------------_
 * |+-------------------++--------++-------------------+|
 * ||                   ||        ||                   ||
 * ||			|| chiller||                   ||
 * ||                   ||        ||                   ||
 * ||                   |=--------+|                   ||
 * ||     Air temp      |+--------+|     Beer temp     ||
 * ||                   ||        ||                   ||
 * ||                   || Temps  ||                   ||
 * ||                   || digits ||                   ||
 * |+-------------------++--------++-------------------+|
 * +----------------------------------------------------+
 */

#fermenter_thermometers {
    width: 720px;
    height: 295px;
    background-color: #252526;
    margin: 5px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}



#fermenter_tempdigits {
    width: 145px;
    height: 120px;
    float: left;
    margin-top: 170;
    background-color: #252526;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


/*
.LEDred_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #F40;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #C33 0 -1px 5px, #f44 0 2px 12px;
}

.LEDred_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #820;
    border-radius: 50%;
    box-shadow: #400 0 0px 1px 1px;
}

.LEDyellow_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #FF0;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #860 0 -1px 5px, #DD0 0 2px 12px;
}

.LEDyellow_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #A90;
    border-radius: 50%;
    box-shadow: #440 0 0px 1px 1px;
}

.LEDgreen_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #5E0;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #270 0 -1px 5px, #5D0 0 2px 12px;
}

.LEDgreen_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #270;
    border-radius: 50%;
    box-shadow: #250 0 0px 1px 1px;
}

.LEDblue_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #4AF;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #247 0 -1px 5px, #48F 0 2px 12px;
}

.LEDblue_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #137;
    border-radius: 50%;
    box-shadow: #024 0 0px 1px 1px;
}
*/


/*
 * New recipe wizzard
 */
#hintBase, #hintStyle {
    float: left;
    margin-top: 30px;
    margin-right: 20px;
    padding: 5px;
    width: 600px;
    color: yellow;
}
#section {
    margin: 5px;
}
#baseButtonsWrapper {
    float: right;
    margin-top: 30px;
    margin-right: 10px;
    width: 160px;
}
#styleButtonsWrapper {
    float: right;
    margin-top: 30px;
    margin-right: 10px;
    width: 320px;
}
#completedButtonsWrapper {
    float: right;
    margin-right: 10px;
    width: 320px;
    margin-top: 160px;
}
.nextButton {
    float: right;
    margin-left: 0px;
}
.backButton {
    float: left;
    margin-left: 10px;
}

mercurial