更新 volume.html
parent
120f4e73ea
commit
bc3a717218
722
volume.html
722
volume.html
|
@ -32,7 +32,7 @@
|
|||
</header>
|
||||
|
||||
<main class="px-3 d-flex justify-content-center">
|
||||
<div>
|
||||
<div class="content-container">
|
||||
<div class="d-flex">
|
||||
<div class="me-3"
|
||||
style="border-left: 2px solid #000;border-right: 2px solid #000;border-bottom: 2px solid #000;">
|
||||
|
@ -40,153 +40,462 @@
|
|||
<div class="divider-text"><span class="fw-bold">MIC 1</span></div>
|
||||
</div>
|
||||
<div class="p-3 d-flex justify-content-center">
|
||||
<div style="width: 250px;">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<div class="me-3">48V Phantom</div>
|
||||
<div style="width: 200px;">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30px;">
|
||||
<div class="me-3" style="font-size: 12px;">48V Phantom</div>
|
||||
<div class="d-flex redio-switche">
|
||||
<input type="radio" class="btn-check" name="options-base" id="option5"
|
||||
<input type="radio" class="btn-check" name="mic1" id="mic1-on"
|
||||
autocomplete="off" checked>
|
||||
<label class="btn" for="option5">ON</label>
|
||||
<label class="btn btn-sm redio-btn on-btn" for="mic1-on">ON</label>
|
||||
|
||||
<input type="radio" class="btn-check" name="options-base" id="option6"
|
||||
<input type="radio" class="btn-check" name="mic1" id="mic1-off"
|
||||
autocomplete="off">
|
||||
<label class="btn" for="option6">OFF</label>
|
||||
<label class="btn btn-sm redio-btn off-btn" for="mic1-off">OFF</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100" step="0.1"
|
||||
value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100"
|
||||
step="0.1" value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 55px;" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="ms-5" style="display: grid;grid-template-rows: 1fr 1fr 1fr;">
|
||||
<div class="ms-4" style="display: grid;grid-template-rows: 1fr 1fr 1fr;">
|
||||
<div>
|
||||
按钮1
|
||||
<input type="checkbox" class="btn-check" id="btn-max-check"
|
||||
autocomplete="off">
|
||||
<label class="btn btn-sm state-btn" for="btn-max-check">xx</label>
|
||||
</div>
|
||||
<div>
|
||||
按钮2
|
||||
<input type="checkbox" class="btn-check" id="btn-check"
|
||||
autocomplete="off">
|
||||
<label class="btn btn-sm state-btn" for="btn-check">xx</label>
|
||||
</div>
|
||||
<div>
|
||||
按钮3
|
||||
<input type="checkbox" class="btn-check" id="btn-close-check"
|
||||
autocomplete="off">
|
||||
<label class="btn btn-sm state-btn" for="btn-close-check">xx</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 50px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
<div class="me-3"
|
||||
style="border-left: 2px solid #000;border-right: 2px solid #000;border-bottom: 2px solid #000;">
|
||||
<div class="divider">
|
||||
<div class="divider-text"><span class="fw-bold">MIC 1</span></div>
|
||||
</div>
|
||||
<div class="p-3 d-flex justify-content-center">
|
||||
<div style="width: 320px;">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<div class="me-3">48V Phantom</div>
|
||||
<div style="width: 200px;">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30px;">
|
||||
<div class="me-3" style="font-size: 12px;">48V Phantom</div>
|
||||
<div class="d-flex redio-switche">
|
||||
<input type="radio" class="btn-check" name="options-base" id="option5"
|
||||
<input type="radio" class="btn-check" name="mic2" id="mic2-on"
|
||||
autocomplete="off" checked>
|
||||
<label class="btn" for="option5">ON</label>
|
||||
<label class="btn btn-sm redio-btn on-btn" for="mic2-on">ON</label>
|
||||
|
||||
<input type="radio" class="btn-check" name="options-base" id="option6"
|
||||
<input type="radio" class="btn-check" name="mic2" id="mic2-off"
|
||||
autocomplete="off">
|
||||
<label class="btn" for="option6">OFF</label>
|
||||
<label class="btn btn-sm redio-btn off-btn" for="mic2-off">OFF</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100" step="0.1"
|
||||
value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100"
|
||||
step="0.1" value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 55px;" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="ms-4" style="display: grid;grid-template-rows: 1fr 1fr 1fr;">
|
||||
<div>
|
||||
<input type="checkbox" class="btn-check" id="btn-max-check"
|
||||
autocomplete="off">
|
||||
<label class="btn btn-sm state-btn" for="btn-max-check">xx</label>
|
||||
</div>
|
||||
<div>
|
||||
<input type="checkbox" class="btn-check" id="btn-check"
|
||||
autocomplete="off">
|
||||
<label class="btn btn-sm state-btn" for="btn-check">xx</label>
|
||||
</div>
|
||||
<div>
|
||||
<input type="checkbox" class="btn-check" id="btn-close-check"
|
||||
autocomplete="off">
|
||||
<label class="btn btn-sm state-btn" for="btn-close-check">xx</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 60px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="me-3"
|
||||
style="border-left: 2px solid #000;border-right: 2px solid #000;border-bottom: 2px solid #000;">
|
||||
<div class="divider">
|
||||
<div class="divider-text"><span class="fw-bold">Equalization</span></div>
|
||||
</div>
|
||||
<div class="p-3 d-flex justify-content-center">
|
||||
<div style="width: 100px;">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30px;">
|
||||
<div class="me-3" style="font-size: 12px;">40Hz</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100"
|
||||
step="0.1" value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 55px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100px;">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30px;">
|
||||
<div class="me-3" style="font-size: 12px;">150Hz</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100"
|
||||
step="0.1" value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 55px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100px;">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30px;">
|
||||
<div class="me-3" style="font-size: 12px;">500Hz</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100"
|
||||
step="0.1" value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 55px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100px;">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30px;">
|
||||
<div class="me-3" style="font-size: 12px;">2kHz</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100"
|
||||
step="0.1" value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 55px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100px;">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30px;">
|
||||
<div class="me-3" style="font-size: 12px;">10KHz</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100"
|
||||
step="0.1" value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);">
|
||||
</div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 55px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -195,19 +504,9 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="row d-flex">
|
||||
<div class="col-12">
|
||||
<!-- <div class="music">
|
||||
<div class="item one"></div>
|
||||
<div class="item two"></div>
|
||||
<div class="item three"></div>
|
||||
<div class="item four"></div>
|
||||
<div class="item five"></div>
|
||||
<div class="item six"></div>
|
||||
<div class="item seven"></div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="pb-5">
|
||||
<!-- <div class="progress-4"></div> -->
|
||||
|
||||
|
||||
<div>
|
||||
<div class="box-inner">
|
||||
<div>
|
||||
<div class="row _slider_customizations cus_handle">
|
||||
|
@ -225,197 +524,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="d-flex justify-content-center">
|
||||
<div class="me-3"
|
||||
style="border-left: 2px solid #000;border-right: 2px solid #000;border-bottom: 2px solid #000;">
|
||||
<div class="divider">
|
||||
<div class="divider-text"><span class="fw-bold">MIC 1</span></div>
|
||||
</div>
|
||||
<div class="p-3 d-flex justify-content-center">
|
||||
<div style="width: 250px;">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<div class="me-3">48V Phantom</div>
|
||||
<div class="d-flex redio-switche">
|
||||
<input type="radio" class="btn-check" name="options-base" id="option5"
|
||||
autocomplete="off" checked>
|
||||
<label class="btn" for="option5">ON</label>
|
||||
|
||||
<input type="radio" class="btn-check" name="options-base" id="option6"
|
||||
autocomplete="off">
|
||||
<label class="btn" for="option6">OFF</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100" step="0.1"
|
||||
value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);"></div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 50px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="border-left: 2px solid #000;border-right: 2px solid #000;border-bottom: 2px solid #000;">
|
||||
<div class="divider">
|
||||
<div class="divider-text"><span class="fw-bold">MIC 1</span></div>
|
||||
</div>
|
||||
<div class="p-3 d-flex justify-content-center">
|
||||
<div style="width: 320px;">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<div class="me-3">48V Phantom</div>
|
||||
<div class="d-flex redio-switche">
|
||||
<input type="radio" class="btn-check" name="options-base" id="option5"
|
||||
autocomplete="off" checked>
|
||||
<label class="btn" for="option5">ON</label>
|
||||
|
||||
<input type="radio" class="btn-check" name="options-base" id="option6"
|
||||
autocomplete="off">
|
||||
<label class="btn" for="option6">OFF</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="volume-slider-container">
|
||||
<div class="d-flex justify-content-center mt-3">
|
||||
<div class="d-flex">
|
||||
<div class="volume-slider-box">
|
||||
<div class="volume-slider" data-slider-value="50">
|
||||
<input type="range" orient="vertical" min="0" max="100" step="0.1"
|
||||
value="30">
|
||||
<div class="range-slider-bar" style="height: calc(45% + 15px);"></div>
|
||||
<div class="range-slider-thumb" style="bottom: 45%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<section class="volume-ruler">
|
||||
<section class="cm">
|
||||
<span>0</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-10</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-20</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-30</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-40</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-50</span>
|
||||
<section class="mm"></section>
|
||||
</section>
|
||||
<section class="cm">
|
||||
<span>-60</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="slider-value-box">
|
||||
<input class="slider-value" style="width: 60px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<div class="music">
|
||||
<div class="item one"></div>
|
||||
<div class="item two"></div>
|
||||
<div class="item three"></div>
|
||||
<div class="item four"></div>
|
||||
<div class="item five"></div>
|
||||
<div class="item six"></div>
|
||||
<div class="item seven"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form">
|
||||
|
||||
<div>
|
||||
<div class="progress-4"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
<div class="box-inner">
|
||||
<div>
|
||||
<div class="row _slider_customizations cus_handle">
|
||||
<div class="block">
|
||||
<div class="cell">
|
||||
<div id="handle1"></div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-5 pb-5">
|
||||
<button type="button" class="btn btn-dark border border-black px-5">Confirm</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</main>
|
||||
|
||||
<footer class="mt-auto text-white-50">
|
||||
|
|
Loading…
Reference in New Issue