Commit 7d0fb313 authored by Michał Woźniak's avatar Michał Woźniak
Browse files

preparing the interface for "start from Xth case per 1M" thing

parent 8203c255
...@@ -208,7 +208,19 @@ ...@@ -208,7 +208,19 @@
background:#404040; background:#404040;
box-shadow: inset 0px 0px 2px #333; box-shadow: inset 0px 0px 2px #333;
} }
.chart-config-container input:checked + label { /*
* chart controls mechanics
*/
.chart-config-container input#chart-type-logarithmic:checked ~ .chart-config-group label[for=chart-type-logarithmic],
.chart-config-container input#chart-type-linear:checked ~ .chart-config-group label[for=chart-type-linear],
.chart-config-container input#chart-cases-cumulative:checked ~ .chart-config-group label[for=chart-cases-cumulative],
.chart-config-container input#chart-cases-new:checked ~ .chart-config-group label[for=chart-cases-new],
.chart-config-container input#chart-values-absolute:checked ~ .chart-config-group label[for=chart-values-absolute],
.chart-config-container input#chart-values-per-million:checked ~ .chart-config-group label[for=chart-values-per-million],
.chart-config-container input#chart-start-first:checked ~ .chart-config-group label[for=chart-start-first],
.chart-config-container input#chart-start-tenth:checked ~ .chart-config-group label[for=chart-start-tenth],
.chart-config-container input#chart-start-hundredth:checked ~ .chart-config-group label[for=chart-start-hundredth],
.chart-config-container input#chart-start-thousandth:checked ~ .chart-config-group label[for=chart-start-thousandth] {
background:springgreen; background:springgreen;
color:black; color:black;
box-shadow: 0px 0px 2px springgreen; box-shadow: 0px 0px 2px springgreen;
...@@ -222,6 +234,12 @@ ...@@ -222,6 +234,12 @@
margin:0em; margin:0em;
padding:0.5em; padding:0.5em;
} }
.chart-config-group .per-million {
display:none;
}
.chart-config-container input#chart-values-per-million:checked ~ .chart-config-group .per-million {
display:inline;
}
</style> </style>
</head> </head>
<body> <body>
...@@ -251,38 +269,38 @@ ...@@ -251,38 +269,38 @@
<canvas id="the-chart"></canvas> <canvas id="the-chart"></canvas>
</div> </div>
<div class="chart-config-container"> <div class="chart-config-container">
<input type="radio" id="chart-type-logarithmic" name="chart-type" value="logarithmic" checked="checked"/>
<input type="radio" id="chart-type-linear" name="chart-type" value="linear"/>
<input type="radio" id="chart-cases-cumulative" name="chart-cases" value="cumulative" checked="checked"/>
<input type="radio" id="chart-cases-new" name="chart-cases" value="new"/>
<input type="radio" id="chart-values-absolute" name="chart-values" value="absolute" checked="checked"/>
<input type="radio" id="chart-values-per-million" name="chart-values" value="per-million"/>
<input type="radio" id="chart-start-first" name="chart-start" value="1"/>
<input type="radio" id="chart-start-tenth" name="chart-start" value="10" checked="checked"/>
<input type="radio" id="chart-start-hundredth" name="chart-start" value="100"/>
<input type="radio" id="chart-start-thousandth" name="chart-start" value="1000"/>
<div class="chart-config-group"> <div class="chart-config-group">
<p>Scale:</p> <p>Scale:</p>
<input type="radio" id="chart-type-logarithmic" name="chart-type" value="logarithmic" checked="checked"/>
<label for="chart-type-logarithmic">logarithmic</label> <label for="chart-type-logarithmic">logarithmic</label>
<input type="radio" id="chart-type-linear" name="chart-type" value="linear">
<label for="chart-type-linear">linear</label> <label for="chart-type-linear">linear</label>
</div> </div>
<div class="chart-config-group"> <div class="chart-config-group">
<p>Cases:</p> <p>Cases:</p>
<input type="radio" id="chart-cases-cumulative" name="chart-cases" value="cumulative" checked="checked"/>
<label for="chart-cases-cumulative">cumulative</label> <label for="chart-cases-cumulative">cumulative</label>
<input type="radio" id="chart-cases-new" name="chart-cases" value="new" >
<label for="chart-cases-new">new</label> <label for="chart-cases-new">new</label>
</div> </div>
<div class="chart-config-group"> <div class="chart-config-group">
<p>Values:</p> <p>Values:</p>
<input type="radio" id="chart-values-absolute" name="chart-values" value="absolute" checked="checked"/>
<label for="chart-values-absolute">absolute</label> <label for="chart-values-absolute">absolute</label>
<input type="radio" id="chart-values-per-million" name="chart-values" value="per-million" >
<label for="chart-values-per-million">per 1M</label> <label for="chart-values-per-million">per 1M</label>
</div> </div>
<div class="chart-config-group"> <div class="chart-config-group">
<p>Start from:</p> <p>Start from:</p>
<input type="radio" id="chart-start-first" name="chart-start" value="1"/>
<label for="chart-start-first">1st</label> <label for="chart-start-first">1st</label>
<input type="radio" id="chart-start-tenth" name="chart-start" value="10" checked="checked"/>
<label for="chart-start-tenth">10th</label> <label for="chart-start-tenth">10th</label>
<input type="radio" id="chart-start-hundredth" name="chart-start" value="100"/>
<label for="chart-start-hundredth">100th</label> <label for="chart-start-hundredth">100th</label>
<input type="radio" id="chart-start-thousandth" name="chart-start" value="1000"/>
<label for="chart-start-thousandth">1000th</label> <label for="chart-start-thousandth">1000th</label>
<p>case</p> <p>case<span class="per-million"> per 1M</span></p>
</div> </div>
</div> </div>
<div id="disclaimers-container"> <div id="disclaimers-container">
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment