graph controls
This commit is contained in:
Stuart Nelson
parent
8ce89f0086
commit
46f7bd2820
|
|
@ -51,6 +51,7 @@ a:active { color: black; }
|
|||
}
|
||||
|
||||
.y_axis {
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
bottom: 0;
|
||||
|
|
@ -198,10 +199,46 @@ select name="insert_metric" {
|
|||
}
|
||||
|
||||
input[name="end_input"], input[name="range_input"] {
|
||||
margin-left: -4px;
|
||||
margin-right: -4px;
|
||||
margin-left: 4px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.error {
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.prometheus_input_group {
|
||||
display: inline-block;
|
||||
margin: 10px 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.prometheus_input_group .prometheus_checkbox {
|
||||
height: 25px;
|
||||
line-height: 2;
|
||||
}
|
||||
|
||||
.prometheus_input_group .input {
|
||||
width: 100px;
|
||||
height: 29px;
|
||||
padding: 6px 12px;
|
||||
font-size: 14px;
|
||||
line-height: 1.42857143;
|
||||
color: #555;
|
||||
background-color: #fff;
|
||||
background-image: none;
|
||||
border: 1px solid #ccc;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
|
||||
-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
|
||||
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
||||
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
||||
}
|
||||
|
||||
.prometheus_input_group .date_input {
|
||||
width: 200px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,52 +28,48 @@
|
|||
<li><a href="#console{{id}}">Tabular</a></li>
|
||||
</ul>
|
||||
<div id="graph{{id}}" class="graph_container reload">
|
||||
<div class="config">
|
||||
<label for="range_input{{id}}">Range:</label>
|
||||
<div>
|
||||
<!-- Extracted to force grouped inputs. -->
|
||||
<input type="hidden" name="range">
|
||||
<div class="input-prepend input-append">
|
||||
|
||||
<div class="prometheus_input_group">
|
||||
<button
|
||||
class="btn btn-mini"
|
||||
type="button"
|
||||
name="dec_range"
|
||||
title="Shrink the time range.">
|
||||
<i class="icon-minus"></i>
|
||||
class="btn btn-default pull-left"
|
||||
type="button"
|
||||
name="dec_range"
|
||||
title="Shrink the time range.">
|
||||
<i class="glyphicon glyphicon-minus"></i>
|
||||
</button>
|
||||
|
||||
<input
|
||||
class="input-mini"
|
||||
id="range_input{{id}}"
|
||||
title="Time range of graph"
|
||||
type="text"
|
||||
name="range_input"
|
||||
size="3"
|
||||
value="{{range_input}}">
|
||||
|
||||
class="pull-left input"
|
||||
id="range_input{{id}}"
|
||||
title="Time range of graph"
|
||||
type="text"
|
||||
name="range_input"
|
||||
size="3"
|
||||
value="{{range_input}}">
|
||||
<button
|
||||
class="btn btn-mini"
|
||||
class="btn btn-default pull-left"
|
||||
type="button"
|
||||
name="inc_range"
|
||||
title="Grow the time range.">
|
||||
<i class="icon-plus"></i>
|
||||
<i class="glyphicon glyphicon-plus"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Extracted to force grouped inputs. -->
|
||||
<input type="hidden" name="end">
|
||||
<div class="input-prepend input-append">
|
||||
<div class="prometheus_input_group">
|
||||
|
||||
<button
|
||||
class="btn btn-mini"
|
||||
class="btn btn-default pull-left"
|
||||
type="button"
|
||||
name="dec_end"
|
||||
title="Rewind the end time.">
|
||||
<i class="icon-backward"></i>
|
||||
<i class="glyphicon glyphicon-backward"></i>
|
||||
</button>
|
||||
|
||||
<input
|
||||
class="input-medium"
|
||||
class="pull-left date_input input"
|
||||
id="end{{id}}"
|
||||
title="End time of graph"
|
||||
placeholder="Until"
|
||||
|
|
@ -83,22 +79,26 @@
|
|||
value="{{end}}">
|
||||
|
||||
<button
|
||||
class="btn btn-mini"
|
||||
class="btn btn-default pull-left"
|
||||
type="button"
|
||||
name="inc_end"
|
||||
title="Advance the end time.">
|
||||
<i class="icon-forward"></i>
|
||||
<i class="glyphicon glyphicon-forward"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<input class="input-small" title="Resolution in seconds" placeholder="Res. (s)" type="text" name="step_input" id="step_input{{id}}" value="{{step_input}}" size="6">
|
||||
<input type="hidden" name="step">
|
||||
<div class="prometheus_input_group">
|
||||
<input class="input" title="Resolution in seconds" placeholder="Res. (s)" type="text" name="step_input" id="step_input{{id}}" value="{{step_input}}" size="6">
|
||||
<input type="hidden" name="step">
|
||||
</div>
|
||||
|
||||
<label class="checkbox inline">
|
||||
<input type="checkbox" name="stacked" {{stacked_checked}}>
|
||||
Stacked
|
||||
</label>
|
||||
<div class="prometheus_input_group checkbox">
|
||||
<label class="prometheus_checkbox">
|
||||
<input type="checkbox" name="stacked" {{stacked_checked}}>
|
||||
Stacked
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="graph_area">
|
||||
|
|
|
|||
Loading…
Reference in New Issue