use bootstrap styling for the slider, center it vertically; move slider between the two volume buttons

This commit is contained in:
Daniel Gunzinger 2020-04-16 23:31:08 +02:00 committed by Terry Geng
parent 08c76aab9d
commit b8ebcce945
2 changed files with 10 additions and 5 deletions

View File

@ -108,4 +108,7 @@
font-style: italic !important; font-style: italic !important;
font-weight: 300; font-weight: 300;
} }
#volume-slider {
margin-top: 8px;
margin-right: 6px;
}

View File

@ -68,15 +68,17 @@
onclick="request('post', {action : 'volume_down'})"> onclick="request('post', {action : 'volume_down'})">
<i class="fa fa-volume-down" aria-hidden="true"></i> <i class="fa fa-volume-down" aria-hidden="true"></i>
</button> </button>
<input type="range" class="custom-range" id="volume-slider"
min="0" max="100" step="1" value="50"
onchange="request('post', {action : 'volume_set_value', new_volume : this.value})">
</input>
<button type="button" class="btn btn-warning btn-space" <button type="button" class="btn btn-warning btn-space"
onclick="request('post', {action : 'volume_up'})"> onclick="request('post', {action : 'volume_up'})">
<i class="fa fa-volume-up" aria-hidden="true"></i> <i class="fa fa-volume-up" aria-hidden="true"></i>
</button> </button>
<input id="volume-slider" type="range"
min="0" max="100" step="1" value="50"
onchange="request('post', {action : 'volume_set_value', new_volume : this.value})">
</input>
</div> </div>
<table class="table"> <table class="table">