<div class=“modal-body”>
<style> .timepicker-to-column { margin-top: 10px; } .timepicker-input input { outline: 0 !important; border: 0px !important; -webkit-box-shadow: 0; -moz-box-shadow: 0; box-shadow: 0; position: relative; } .timepicker-input input::-webkit-outer-spin-button, .timepicker-input input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } input.timepicker-date { width: 90px; } input.timepicker-hms { width: 20px; } input.timepicker-ms { width: 25px; } div.timepicker-now { float: right; } </style> <div class="timepicker form-horizontal"> <form name="input"> <div class="timepicker-from-column"> <label class="small">From</label> <div class="fake-input timepicker-input"> <input class="timepicker-date" type="text" ng-change="validate(temptime)" ng-model="temptime.from.date" data-date-format="yyyy-mm-dd" required bs-datepicker />@ <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.from.hour" required ng-pattern="patterns.hour" onClick="this.select();"/>: <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.from.minute" required ng-pattern="patterns.minute" onClick="this.select();"/>: <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.from.second" required ng-pattern="patterns.second" onClick="this.select();"/>. <input class="timepicker-ms" type="text" maxlength="3" ng-change="validate(temptime)" ng-model="temptime.from.millisecond" required ng-pattern="patterns.millisecond" onClick="this.select();"/> </div> </div> <div class="timepicker-to-column"> <label class="small">To (<a class="link" ng-class="{'strong':panel.now}" ng-click="setNow();panel.now=true">now</a>)</label> <div class="fake-input timepicker-input"> <div ng-hide="panel.now"> <input class="timepicker-date" type="text" ng-change="validate(temptime)" ng-model="temptime.to.date" data-date-format="yyyy-mm-dd" required bs-datepicker />@ <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.to.hour" required ng-pattern="patterns.hour" onClick="this.select();"/>: <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.to.minute" required ng-pattern="patterns.minute" onClick="this.select();"/>: <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.to.second" required ng-pattern="patterns.second" onClick="this.select();"/>. <input class="timepicker-ms" type="text" maxlength="3" ng-change="validate(temptime)" ng-model="temptime.to.millisecond" required ng-pattern="patterns.millisecond" onClick="this.select();"/> </div> <span type="text" ng-show="panel.now" ng-disabled="panel.now">  <i class="pointer icon-remove-sign" ng-click="setNow();panel.now=false"></i> Right Now <input type="text" name="dummy" style="visibility:hidden" /></span> </div> </div> </form> <div class="clearfix"></div> </div>
</div>
<div class=“modal-footer”>
<form name="input" style="margin-bottom:0"> <span class="" ng-hide="input.$valid">Invalid date or range</span> <button ng-click="setAbsoluteTimeFilter(validate(temptime));dismiss();" ng-disabled="!input.$valid" class="btn btn-success">Apply</button> <button ng-click="dismiss();" class="btn btn-danger">Cancel</button> </form>
</div>