body { font: 12px Arial;} path { stroke: steelblue; stroke-width: 2; fill: none; } .axis path, .axis line { fill: none; stroke: grey; stroke-width: 1; shape-rendering: crispEdges; } .grid .tick { stroke: lightgrey; stroke-opacity: 0.7; shape-rendering: crispEdges; } .grid path { stroke-width: 0; } /* * ************************************************** * Darstellung Tooltipp Grundfarbe: lightsteelblue * ************************************************** * */ div.tooltip { position: absolute; text-align: center; width: 100px; height: 40px; padding: 2px; font: 12px sans-serif; background: lightsteelblue; border: 1px solid lightgray; border-radius: 8px; pointer-events: none; } /* * ************************************************** * Darstellung Temperatur Grundfarbe: lightsteelblue * ************************************************** * */ #graphTemperature { border: 3px solid #7070ED; width: 600px; } #graphTemperature .title { background: #7070ED; color: white; font-size:2em; text-align:center; } #graphTemperature .y { fill: steelblue; background: #7070ED; } #graphTemperature .linecolor { stroke: #7070ED; stroke-width: 2; fill: none; } #graphTemperature .tooltip1 { background: lightsteelblue; } /* * ************************************************** * Darstellung Luftdruck Grundfarbe: dunkelrot * ************************************************** * */ #graphPressure { border: 3px solid Gray; width: 600px; } #graphPressure .title { background: #BB0202; color: white; font-size:2em; text-align:center; } #graphPressure .y { fill: #BB0202 } #graphPressure .linecolor { stroke: #BB0202; stroke-width: 2; fill: none; } #graphPressure .tooltippfarbe{ background: #DCAFAF; } /* * ************************************************** * Darstellung Luftfeuchtigkeit Grundfarbe: lindgrün * ************************************************** * */ #graphHumidity { border: 3px solid #BDE7BD; width: 600px; } #graphHumidity .title { background: #BDE7BD; color: gray; font-size:2em; text-align:center; } #graphHumidity .y { fill: green; } #graphHumidity .linecolor { stroke: green; stroke-width: 2; fill: none; } #graphHumidity .tooltip { background: #BDE7BD; } /* * ************************************************** * Darstellung TT + P Grundfarbe: hellgrau * ************************************************** * */ #graphTemperaturePressure { border: 3px solid #BDE7BD; width: 1220px; color: black; } #graphTemperaturePressure .title { background: lightgray; color: black; font-size:2em; text-align:center; } #graphTemperaturePressure .y1 { fill: blue } #graphTemperaturePressure .y2 { fill: red; } #graphTemperaturePressure .linecolor1 { stroke: lightsteelblue; stroke-width: 2; fill: none; } #graphTemperaturePressure .linecolor2 { stroke: red; stroke-width: 2; fill: none; } #graphTemperaturePressure .tooltip { background: #BDE7BD; } /* ************************************************* * Darstellung aktueller Werte * ************************************************* */ .messwert { float:left; margin-right: 2px; margin-left: 2px; border: 1px solid gray; padding-right: 10px; padding-left: 0px; /* width:300px; */ /* background-image: url(celsius.png); */ height: 85px; } .text { float:left; font-size:5em; padding-left:0; color:lightgray; } .value {padding-left:85px; margin-top:8px; font-size:1.2em; font-family: monospace; font-weight: bold; text-align:right; } .min {margin:2px; background-color:blue; color:white;} .max {margin:2px; background-color:red; color:white;} .avg {margin:2px; background-color:green; color:white;} .aktuell {margin:2px; background-color:yellow; color:black;}