Changes by Monika DV
This commit is contained in:
@@ -30,11 +30,11 @@
|
|||||||
<div class="collapse navbar-collapse" id="navbarNav">
|
<div class="collapse navbar-collapse" id="navbarNav">
|
||||||
<ul class="navbar-nav ms-auto">
|
<ul class="navbar-nav ms-auto">
|
||||||
<li class="nav-item pad-menu">
|
<li class="nav-item pad-menu">
|
||||||
<a class="nav-link" href="setting.html">Setting</a>
|
<a class="nav-link nav-setting" href="setting.html">Setting</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item pad-menu">
|
<li class="nav-item pad-menu">
|
||||||
<form action="/logout" method="get">
|
<form action="/logout" method="get">
|
||||||
<button class="btn btn-outline-light" type="submit">Logout</button>
|
<button class="btn btn-outline-light nav-logout" type="submit">Logout</button>
|
||||||
</form>
|
</form>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
@@ -108,7 +108,7 @@
|
|||||||
<br>
|
<br>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-3 ">
|
<div class="col-3 ">
|
||||||
<p>Pan Speed</p>
|
<p class="text-dash">Pan Speed</p>
|
||||||
<div class="btn-group-vertical">
|
<div class="btn-group-vertical">
|
||||||
<button id="pan1" class="btn btn-outline-dark btn-sm" value="16" onclick="set_pan_speed(16)">1</button>
|
<button id="pan1" class="btn btn-outline-dark btn-sm" value="16" onclick="set_pan_speed(16)">1</button>
|
||||||
<button id="pan2" class="btn btn-outline-dark btn-sm" value="32" onclick="set_pan_speed(32)">2</button>
|
<button id="pan2" class="btn btn-outline-dark btn-sm" value="32" onclick="set_pan_speed(32)">2</button>
|
||||||
@@ -156,7 +156,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-3">
|
<div class="col-3">
|
||||||
<p>Tilt Speed</p>
|
<p class="text-dash">Tilt Speed</p>
|
||||||
<div class="btn-group-vertical">
|
<div class="btn-group-vertical">
|
||||||
<button id="tilt1" class="btn btn-outline-dark btn-sm" value="16" onclick="set_tilt_speed(16)">1</button>
|
<button id="tilt1" class="btn btn-outline-dark btn-sm" value="16" onclick="set_tilt_speed(16)">1</button>
|
||||||
<button id="tilt2" class="btn btn-outline-dark btn-sm" value="32" onclick="set_tilt_speed(32)">2</button>
|
<button id="tilt2" class="btn btn-outline-dark btn-sm" value="32" onclick="set_tilt_speed(32)">2</button>
|
||||||
@@ -166,14 +166,14 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p class="text-center">Zoom</p>
|
<p class="text-center text-dash">Zoom</p>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-10">
|
<div class="col-10">
|
||||||
<input id="zoom" type="range" class="form-range" min="1" max="10909" oninput="this.nextElementSibling.value = this.value">
|
<input id="zoom" type="range" class="form-range" min="1" max="10909" oninput="this.nextElementSibling.value = this.value">
|
||||||
<output class="output"></output>
|
<output class="output"></output>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-2">
|
<div class="col-2">
|
||||||
<button class="btn btn-primary" onclick="set_zoom()">SET</button>
|
<button class="btn btn-primary" id="set_zoom" onclick="set_zoom()">SET</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -250,7 +250,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<br>
|
<br>
|
||||||
<div>
|
<div>
|
||||||
<label for="customRange" class="form-label">Volume</label>
|
<label for="customRange" class="form-label text-dash">Volume</label>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
||||||
<div class="col-10 pad-bar">
|
<div class="col-10 pad-bar">
|
||||||
@@ -276,7 +276,7 @@
|
|||||||
|
|
||||||
<!-- SECTION 3 -->
|
<!-- SECTION 3 -->
|
||||||
<div class="container-fluid footer1 outside">
|
<div class="container-fluid footer1 outside">
|
||||||
<p>2024 Copyright © Galva Technologies. All rights reserved.</p>
|
<p class="footer">2024 Copyright © Galva Technologies. All rights reserved.</p>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@@ -833,7 +833,6 @@ input.checkbox{
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Style the labels (Off and On) */
|
/* Style the labels (Off and On) */
|
||||||
|
|
||||||
.toggle-label {
|
.toggle-label {
|
||||||
@@ -911,3 +910,433 @@ select {
|
|||||||
.padleft{
|
.padleft{
|
||||||
padding-left: 3px;
|
padding-left: 3px;
|
||||||
}
|
}
|
||||||
|
.nav-setting{
|
||||||
|
font-size: 1.2em;
|
||||||
|
}
|
||||||
|
.nav-logout{
|
||||||
|
font-size: 1.2em !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*-------------------------------------SET RESPONSIVE -----------------*/
|
||||||
|
@media (max-width: 900px) {
|
||||||
|
/*Pan Tilt Speed*/
|
||||||
|
button#tilt1,
|
||||||
|
button#tilt2,
|
||||||
|
button#tilt3,
|
||||||
|
button#tilt4,
|
||||||
|
button#pan1,
|
||||||
|
button#pan2,
|
||||||
|
button#pan3,
|
||||||
|
button#pan4{
|
||||||
|
padding: 0.75rem 1rem;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
border-radius: .2rem;
|
||||||
|
}
|
||||||
|
/*End Pan Tilt Speed*/
|
||||||
|
/* ---- NAVIGATION ----- */
|
||||||
|
.btn-nav{
|
||||||
|
margin: 0;
|
||||||
|
font-size: 7em;
|
||||||
|
color: lightgray;
|
||||||
|
}
|
||||||
|
.btn-nav:hover{
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.btn-nav:active{
|
||||||
|
color: dodgerblue;
|
||||||
|
}
|
||||||
|
.btn-nav-center{
|
||||||
|
font-size: 3em;
|
||||||
|
top: -12px;
|
||||||
|
color: dodgerblue;
|
||||||
|
}
|
||||||
|
.btn-center-unactive{
|
||||||
|
font-size: 2em;
|
||||||
|
color: #434343;
|
||||||
|
}
|
||||||
|
.pad-img{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.img-cctv{
|
||||||
|
box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin: 1.5em;
|
||||||
|
}
|
||||||
|
.btn-circle{
|
||||||
|
width: 13em;
|
||||||
|
height: 13em;
|
||||||
|
background-color: black;
|
||||||
|
align-items: center;
|
||||||
|
align-content: center;
|
||||||
|
margin: 5%;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;
|
||||||
|
}
|
||||||
|
.pad-top{
|
||||||
|
margin-top: -17px;
|
||||||
|
margin-bottom: -10px;
|
||||||
|
}
|
||||||
|
.pad-left{
|
||||||
|
margin-top: -40px;
|
||||||
|
margin-right: -20px;
|
||||||
|
}
|
||||||
|
.pad-right{
|
||||||
|
margin-top: -40px;
|
||||||
|
margin-left: -20px;
|
||||||
|
}
|
||||||
|
.pad-bottom{
|
||||||
|
margin-top: -40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ---- END - NAVIGATION ----- */
|
||||||
|
/* Mute Button */
|
||||||
|
.btn-mute{
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #f7f7f7;
|
||||||
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
|
||||||
|
background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
color: black;
|
||||||
|
width: 2.5em;
|
||||||
|
height: 2.5em;
|
||||||
|
padding: 0.2em;
|
||||||
|
position: relative;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
|
||||||
|
border: solid 1px transparent;
|
||||||
|
font-size: 1.1em;
|
||||||
|
}
|
||||||
|
/* End Mute Button */
|
||||||
|
|
||||||
|
.toggle-label {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #555;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-left: 5px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
/* Style the toggle switch (input) */
|
||||||
|
.toggle-switch {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
width: 55px;
|
||||||
|
height: 30px;
|
||||||
|
background-color: #ccc;
|
||||||
|
border-radius: 25px;
|
||||||
|
position: relative;
|
||||||
|
transition: background-color 0.3s;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Circle inside the switch */
|
||||||
|
.toggle-switch::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 3px;
|
||||||
|
left: 3px;
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 50%;
|
||||||
|
transition: transform 0.3s;
|
||||||
|
}
|
||||||
|
/* When checked (toggle to On), change background color and move the circle */
|
||||||
|
.toggle-switch:checked {
|
||||||
|
background-color: #0d6efd;
|
||||||
|
}
|
||||||
|
.toggle-switch:checked::before {
|
||||||
|
transform: translateX(25px);
|
||||||
|
}
|
||||||
|
.align-right{
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
/* End Switch */
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 900px) and (max-width: 1050px) {
|
||||||
|
#streaming_status{
|
||||||
|
text-align: left;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
.padleft{
|
||||||
|
padding-left: 3px;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
.icon-system{
|
||||||
|
margin-top: -13px;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
button#tilt1,
|
||||||
|
button#tilt2,
|
||||||
|
button#tilt3,
|
||||||
|
button#tilt4,
|
||||||
|
button#pan1,
|
||||||
|
button#pan2,
|
||||||
|
button#pan3,
|
||||||
|
button#pan4{
|
||||||
|
padding: 0.75rem 1.5rem;
|
||||||
|
font-size: 2.5rem;
|
||||||
|
border-radius: .2rem;
|
||||||
|
}
|
||||||
|
.text-dash{
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
.text-status1{
|
||||||
|
color: black;
|
||||||
|
font-size: 3em;
|
||||||
|
}
|
||||||
|
/* ----- SWITCH ------ */
|
||||||
|
.toggle-label {
|
||||||
|
font-size: 1.8rem;
|
||||||
|
color: #555;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-left: 5px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
/* Style the toggle switch (input) */
|
||||||
|
.toggle-switch {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
/*width: 50px;*/
|
||||||
|
/*height: 25px;*/
|
||||||
|
width: 75px;
|
||||||
|
height: 50px;
|
||||||
|
background-color: #ccc;
|
||||||
|
border-radius: 25px;
|
||||||
|
position: relative;
|
||||||
|
transition: background-color 0.3s;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
/* Circle inside the switch */
|
||||||
|
.toggle-switch::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 3px;
|
||||||
|
left: 3px;
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 50%;
|
||||||
|
transition: transform 0.3s;
|
||||||
|
}
|
||||||
|
/* When checked (toggle to On), change background color and move the circle */
|
||||||
|
.toggle-switch:checked {
|
||||||
|
background-color: #0d6efd;
|
||||||
|
}
|
||||||
|
.toggle-switch:checked::before {
|
||||||
|
transform: translateX(25px);
|
||||||
|
}
|
||||||
|
/*----- END SWITCH -----*/
|
||||||
|
|
||||||
|
/* --- Button CONTENT ---- */
|
||||||
|
.btn-play1{
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #f7f7f7;
|
||||||
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
|
||||||
|
background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
color: black;
|
||||||
|
/*width: 4.2em;*/
|
||||||
|
/*height: 4.2em;*/
|
||||||
|
width: 7em;
|
||||||
|
height: 7em;
|
||||||
|
position: relative;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
|
||||||
|
border: solid 1px transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-play1:before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
background: #fff;
|
||||||
|
border-top: 2px solid #ddd;
|
||||||
|
position: absolute;
|
||||||
|
z-index: -1;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: inset 0px 8px 48px #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-play1:active {
|
||||||
|
box-shadow: 0px 3px 8px #aaa inset, 0px 2px 3px #fff;
|
||||||
|
}
|
||||||
|
.btn-play1:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
/*color: #555;*/
|
||||||
|
color: black;
|
||||||
|
background: #f5f5f5;
|
||||||
|
}
|
||||||
|
.icon1{
|
||||||
|
margin: 27%;
|
||||||
|
font-size: 4.5em;
|
||||||
|
position: absolute;
|
||||||
|
top: -9px;
|
||||||
|
left: -1px;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.icon2{
|
||||||
|
margin: 27%;
|
||||||
|
font-size: 4.5em;
|
||||||
|
position: absolute;
|
||||||
|
top: -9px;
|
||||||
|
left: 5px;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
/* --- END Button CONTENT ---- */
|
||||||
|
|
||||||
|
.btn-mute{
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #f7f7f7;
|
||||||
|
background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
|
||||||
|
background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
|
||||||
|
color: black;
|
||||||
|
width: 2.2em;
|
||||||
|
height: 2.2em;
|
||||||
|
padding: 0.1em;
|
||||||
|
position: relative;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
|
||||||
|
border: solid 1px transparent;
|
||||||
|
font-size: 2.2em;
|
||||||
|
}
|
||||||
|
/* ---- NAVIGATION ----- */
|
||||||
|
.btn-nav{
|
||||||
|
margin: 0;
|
||||||
|
font-size: 13em;
|
||||||
|
color: lightgray;
|
||||||
|
}
|
||||||
|
.btn-nav:hover{
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.btn-nav:active{
|
||||||
|
color: dodgerblue;
|
||||||
|
}
|
||||||
|
.btn-nav-center{
|
||||||
|
font-size: 5em;
|
||||||
|
top: -20px;
|
||||||
|
color: dodgerblue;
|
||||||
|
}
|
||||||
|
.btn-center-unactive{
|
||||||
|
font-size: 2em;
|
||||||
|
color: #434343;
|
||||||
|
}
|
||||||
|
.pad-img{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.img-cctv{
|
||||||
|
box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin: 1.5em;
|
||||||
|
}
|
||||||
|
.btn-circle{
|
||||||
|
width: 20em;
|
||||||
|
height: 20em;
|
||||||
|
background-color: black;
|
||||||
|
align-items: center;
|
||||||
|
align-content: center;
|
||||||
|
margin: 5%;
|
||||||
|
border-radius: 70%;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;
|
||||||
|
}
|
||||||
|
.pad-top{
|
||||||
|
margin-top: -40px;
|
||||||
|
margin-bottom: -45px;
|
||||||
|
}
|
||||||
|
.pad-left{
|
||||||
|
margin-top: -65px;
|
||||||
|
margin-right: -40px;
|
||||||
|
}
|
||||||
|
.pad-right{
|
||||||
|
margin-top: -65px;
|
||||||
|
margin-left: -40px;
|
||||||
|
}
|
||||||
|
.pad-bottom{
|
||||||
|
margin-top: -110px;
|
||||||
|
}
|
||||||
|
#set_zoom{
|
||||||
|
padding: .5rem 1rem;
|
||||||
|
font-size: 1.7rem;
|
||||||
|
border-radius: .3rem;
|
||||||
|
}
|
||||||
|
.footer{
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
.p-title{
|
||||||
|
font-size: 3.5em !important;
|
||||||
|
}
|
||||||
|
.nav-setting{
|
||||||
|
font-size: 1.8em;
|
||||||
|
line-height: 2em;
|
||||||
|
}
|
||||||
|
.nav-logout{
|
||||||
|
font-size: 1.8em !important;
|
||||||
|
}
|
||||||
|
input[type="range"] {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
width: 100%;
|
||||||
|
height: 20px;
|
||||||
|
background: #ddd;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="range"]::-webkit-slider-runnable-track {
|
||||||
|
height: 20px;
|
||||||
|
background: #dddddd;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="range"]::-webkit-slider-thumb {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
background: #0d6efd;
|
||||||
|
border-radius: 50%;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.output{
|
||||||
|
padding-left: 20%;
|
||||||
|
font-size: 1.8em;
|
||||||
|
}
|
||||||
|
.text-setting{
|
||||||
|
font-size: 1.7em;
|
||||||
|
}
|
||||||
|
.text-input{
|
||||||
|
font-size: 0.9em !important;
|
||||||
|
}
|
||||||
|
#icon_confirm,
|
||||||
|
#icon_password,
|
||||||
|
#icon_camera{
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
.btn-setting{
|
||||||
|
padding: .5rem 1rem !important;
|
||||||
|
font-size: 1.1rem !important;
|
||||||
|
border-radius: .3rem !important;
|
||||||
|
}
|
||||||
|
.setting-title{
|
||||||
|
font-size: 1.3em;
|
||||||
|
}
|
||||||
|
span.navbar-toggler-icon {
|
||||||
|
font-size: 1.8em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -28,11 +28,11 @@
|
|||||||
<div class="collapse navbar-collapse" id="navbarNav">
|
<div class="collapse navbar-collapse" id="navbarNav">
|
||||||
<ul class="navbar-nav ms-auto">
|
<ul class="navbar-nav ms-auto">
|
||||||
<li class="nav-item pad-menu">
|
<li class="nav-item pad-menu">
|
||||||
<a class="nav-link" href="setting.html">Setting</a>
|
<a class="nav-link nav-setting" href="setting.html">Setting</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item pad-menu">
|
<li class="nav-item pad-menu">
|
||||||
<form action="/logout" method="get">
|
<form action="/logout" method="get">
|
||||||
<button class="btn btn-outline-light" type="submit">Logout</button>
|
<button class="btn btn-outline-light nav-logout" type="submit">Logout</button>
|
||||||
</form>
|
</form>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
@@ -46,7 +46,7 @@
|
|||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="card card-shadow">
|
<div class="card card-shadow">
|
||||||
<div class="card-header bg-secondary text-light">
|
<div class="card-header bg-secondary text-light">
|
||||||
<h5 class="text-md-center">Audio Files</h5>
|
<h5 class="text-md-center setting-title">Audio Files</h5>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body bg-gray">
|
<div class="card-body bg-gray">
|
||||||
<!-- PRESET 1-->
|
<!-- PRESET 1-->
|
||||||
@@ -55,7 +55,7 @@
|
|||||||
<p>Preset 1</p>
|
<p>Preset 1</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
||||||
<select id="preset1" class="form-control class100">
|
<select id="preset1" class="form-control text-input class100">
|
||||||
<option>Option 1</option>
|
<option>Option 1</option>
|
||||||
<option>Option 2</option>
|
<option>Option 2</option>
|
||||||
</select>
|
</select>
|
||||||
@@ -67,7 +67,7 @@
|
|||||||
<p>Preset 2</p>
|
<p>Preset 2</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
||||||
<select id="preset2" class="form-control class100">
|
<select id="preset2" class="form-control text-input class100">
|
||||||
<option>Option 1</option>
|
<option>Option 1</option>
|
||||||
<option>Option 2</option>
|
<option>Option 2</option>
|
||||||
</select>
|
</select>
|
||||||
@@ -79,7 +79,7 @@
|
|||||||
<p>Preset 3</p>
|
<p>Preset 3</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
||||||
<select id="preset3" class="form-control class100">
|
<select id="preset3" class="form-control text-input class100">
|
||||||
<option>Option 1</option>
|
<option>Option 1</option>
|
||||||
<option>Option 2</option>
|
<option>Option 2</option>
|
||||||
</select>
|
</select>
|
||||||
@@ -91,7 +91,7 @@
|
|||||||
<p>Preset 4</p>
|
<p>Preset 4</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
||||||
<select id="preset4" class="form-control class100">
|
<select id="preset4" class="form-control text-input class100">
|
||||||
<option>Option 1</option>
|
<option>Option 1</option>
|
||||||
<option>Option 2</option>
|
<option>Option 2</option>
|
||||||
</select>
|
</select>
|
||||||
@@ -103,7 +103,7 @@
|
|||||||
<p>Preset 5</p>
|
<p>Preset 5</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-6">
|
||||||
<select id="preset5" class="form-control class100">
|
<select id="preset5" class="form-control text-input class100">
|
||||||
<option>Option 1</option>
|
<option>Option 1</option>
|
||||||
<option>Option 2</option>
|
<option>Option 2</option>
|
||||||
</select>
|
</select>
|
||||||
@@ -112,7 +112,7 @@
|
|||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
<div class="col-6"></div>
|
<div class="col-6"></div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<button id="save_audio" class="btn btn-primary class100" onclick="save_audio()">SAVE</button>
|
<button id="save_audio" class="btn btn-primary btn-setting class100" onclick="save_audio()">SAVE</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -120,7 +120,7 @@
|
|||||||
|
|
||||||
<div class="card mt-5 card-shadow">
|
<div class="card mt-5 card-shadow">
|
||||||
<div class="card-header bg-secondary text-light">
|
<div class="card-header bg-secondary text-light">
|
||||||
<h5 class="text-center"> Upload Audio</h5>
|
<h5 class="text-center setting-title"> Upload Audio</h5>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body bg-gray">
|
<div class="card-body bg-gray">
|
||||||
<form action="/setting/uploadaudiofile" method="post" enctype="multipart/form-data">
|
<form action="/setting/uploadaudiofile" method="post" enctype="multipart/form-data">
|
||||||
@@ -129,10 +129,10 @@
|
|||||||
<p> Upload audio files</p>
|
<p> Upload audio files</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-sm-6 col-md-4 col-lg-4 col-xl-4">
|
<div class="col-6 col-sm-6 col-md-4 col-lg-4 col-xl-4">
|
||||||
<input class="form-control" type="file" name="file" required title="Select Audio File">
|
<input class="form-control text-input" type="file" name="file" required title="Select Audio File">
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6 col-sm-6 col-md-2 col-lg-2 col-xl-2">
|
<div class="col-6 col-sm-6 col-md-2 col-lg-2 col-xl-2">
|
||||||
<button id="uploadd_file" type="submit" class="btn btn-dark class100">Upload</button>
|
<button id="uploadd_file" type="submit" class="btn btn-setting btn-dark class100">Upload</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
@@ -142,7 +142,7 @@
|
|||||||
|
|
||||||
<div class="card mt-5 card-shadow">
|
<div class="card mt-5 card-shadow">
|
||||||
<div class="card-header bg-secondary text-light ">
|
<div class="card-header bg-secondary text-light ">
|
||||||
<h5 class="text-center">Camera</h5>
|
<h5 class="text-center setting-title">Camera</h5>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body bg-gray">
|
<div class="card-body bg-gray">
|
||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
@@ -150,7 +150,7 @@
|
|||||||
<p>IP Address</p>
|
<p>IP Address</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<input id="setting_ip" name="ip" class="form-control" title="IP Address">
|
<input id="setting_ip" name="ip" class="form-control text-input" title="IP Address">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
@@ -158,7 +158,7 @@
|
|||||||
<p>Port</p>
|
<p>Port</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<input id="setting_port" name="port" class="form-control" title="Port">
|
<input id="setting_port" name="port" class="form-control text-input" title="Port">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -167,7 +167,7 @@
|
|||||||
<p>Username</p>
|
<p>Username</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<input id="setting_username" name="username" class="form-control" title="Username">
|
<input id="setting_username" name="username" class="form-control text-input" title="Username">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -177,7 +177,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<div class="input-group">
|
<div class="input-group">
|
||||||
<input type="password" id="setting_password" name="password" class="form-control" title="Password">
|
<input type="password" id="setting_password" name="password" class="form-control text-input" title="Password">
|
||||||
<span class="input-group-text" onclick="cameraPassword()">
|
<span class="input-group-text" onclick="cameraPassword()">
|
||||||
<i class="fa-solid fa-eye" id="icon_camera"></i>
|
<i class="fa-solid fa-eye" id="icon_camera"></i>
|
||||||
</span>
|
</span>
|
||||||
@@ -187,7 +187,7 @@
|
|||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
<div class="col-6"></div>
|
<div class="col-6"></div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<button id="save_camera" class="btn btn-primary class100" onclick="save_camera()">SAVE</button>
|
<button id="save_camera" class="btn btn-primary btn-setting class100" onclick="save_camera()">SAVE</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -195,7 +195,7 @@
|
|||||||
|
|
||||||
<div class="card mt-5 card-shadow">
|
<div class="card mt-5 card-shadow">
|
||||||
<div class="card-header bg-secondary text-light">
|
<div class="card-header bg-secondary text-light">
|
||||||
<h5 class="text-center">Login</h5>
|
<h5 class="text-center setting-title">Login</h5>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body bg-gray">
|
<div class="card-body bg-gray">
|
||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
@@ -203,7 +203,7 @@
|
|||||||
<p>Username</p>
|
<p>Username</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<input id="login_username" class="form-control" title="Username">
|
<input id="login_username" class="form-control text-input" title="Username">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
@@ -212,7 +212,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<div class="input-group">
|
<div class="input-group">
|
||||||
<input type="password" id="edit_password" class="form-control" title="Password">
|
<input type="password" id="edit_password" class="form-control text-input" title="Password">
|
||||||
<span class="input-group-text" onclick="showPassword()">
|
<span class="input-group-text" onclick="showPassword()">
|
||||||
<i class="fa-solid fa-eye" id="icon_password"></i>
|
<i class="fa-solid fa-eye" id="icon_password"></i>
|
||||||
</span>
|
</span>
|
||||||
@@ -225,7 +225,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<div class="input-group">
|
<div class="input-group">
|
||||||
<input type="password" id="confirm_password" class="form-control" title="Confirm Password">
|
<input type="password" id="confirm_password" class="form-control text-input" title="Confirm Password">
|
||||||
<span class="input-group-text" onclick="showConfirm()">
|
<span class="input-group-text" onclick="showConfirm()">
|
||||||
<i class="fa-solid fa-eye" id="icon_confirm"></i>
|
<i class="fa-solid fa-eye" id="icon_confirm"></i>
|
||||||
</span>
|
</span>
|
||||||
@@ -235,7 +235,7 @@
|
|||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
<div class="col-6"></div>
|
<div class="col-6"></div>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<button id="save_login" class="btn btn-primary class100" onclick="save_login()">SAVE</button>
|
<button id="save_login" class="btn btn-primary btn-setting class100" onclick="save_login()">SAVE</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -245,7 +245,7 @@
|
|||||||
|
|
||||||
<!-- SECTION 3 -->
|
<!-- SECTION 3 -->
|
||||||
<div class="container-fluid footer1 outside">
|
<div class="container-fluid footer1 outside">
|
||||||
<p>2024 Copyright © Galva Technologies. All rights reserved.</p>
|
<p class="footer">2024 Copyright © Galva Technologies. All rights reserved.</p>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Reference in New Issue
Block a user