blob: 27eb80286c480998fe3be669730e6e85a6e35297 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
|
package web
templ RideRangeFilter(field RangeFilterConfig) {
<fieldset class="ride-filter-group">
<legend>{ field.Legend }</legend>
<div class="range-values"><output data-range-value="min" for={ field.IDPrefix + "-min" }>{ field.FormatValue(field.ValueMin) }</output><span aria-hidden="true">to</span><output data-range-value="max" for={ field.IDPrefix + "-max" }>{ field.FormatValue(field.ValueMax) }</output></div>
<div class="range-control" data-range-filter={ field.Format } data-range-format={ field.Format }>
<div class="range-track" data-range-track></div>
<input id={ field.IDPrefix + "-min" } class="range-input range-input-min" type="range" name={ field.ParamMin } min={ formatRideFilterInt(field.BoundMin) } max={ formatRideFilterInt(field.BoundMax) } step={ formatRideFilterInt(field.Step) } value={ formatRideFilterInt(field.ValueMin) } data-range-min aria-label={ field.LabelMin }/>
<input id={ field.IDPrefix + "-max" } class="range-input range-input-max" type="range" name={ field.ParamMax } min={ formatRideFilterInt(field.BoundMin) } max={ formatRideFilterInt(field.BoundMax) } step={ formatRideFilterInt(field.Step) } value={ formatRideFilterInt(field.ValueMax) } data-range-max aria-label={ field.LabelMax }/>
</div>
</fieldset>
}
|