archive, bug fixes
This commit is contained in:
Ivan
@ -478,6 +478,7 @@ header h2 span {
|
||||
border: 2px solid rgba(245, 245, 250, 1);
|
||||
border-radius: 30px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.table h1 {
|
||||
@ -1401,17 +1402,6 @@ input[type="datetime-local"] {
|
||||
padding: 12px 33px 26px 33px;
|
||||
}
|
||||
|
||||
.video-container {
|
||||
position: relative;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
video {
|
||||
width: 450px;
|
||||
display: inline-block;
|
||||
border-right: 2px solid rgba(245, 245, 250, 1);
|
||||
}
|
||||
|
||||
.controls {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@ -1476,7 +1466,7 @@ video {
|
||||
transition: 1s;
|
||||
position: relative;
|
||||
float: left;
|
||||
z-index: 10;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.signals-list.hide {
|
||||
@ -1612,12 +1602,24 @@ video {
|
||||
background: rgba(0, 0, 0, 0.10);
|
||||
}
|
||||
|
||||
.map {
|
||||
.stream-map {
|
||||
/* background-color: #ff443a2f; */
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
/* float: right; */
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
|
||||
}
|
||||
|
||||
.map {
|
||||
height: 310px;
|
||||
width: 25%;
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
#map {
|
||||
@ -1631,7 +1633,7 @@ video {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 50%;
|
||||
z-index: 10;
|
||||
z-index: 3;
|
||||
background-color: white;
|
||||
padding: 9px 11px;
|
||||
border-radius: 10px;
|
||||
@ -1674,7 +1676,7 @@ video {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.cameras {
|
||||
.stream-cameras {
|
||||
background: #F5F5FA;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
@ -1682,6 +1684,16 @@ video {
|
||||
width: calc(100% - 345px - 2px);
|
||||
z-index: 3;
|
||||
}
|
||||
.cameras {
|
||||
background: #F5F5FA;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: calc(100% - 310px);
|
||||
z-index: 3;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.cameras-swipe {
|
||||
display: flex;
|
||||
@ -1700,13 +1712,13 @@ video {
|
||||
background: #dcdce2;
|
||||
}
|
||||
|
||||
.video-container {
|
||||
.stream-video-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.video-container video {
|
||||
.stream-video-container video {
|
||||
height: auto;
|
||||
box-sizing: border-box;
|
||||
width: 25%;
|
||||
@ -1714,6 +1726,79 @@ video {
|
||||
border: 1px solid white;
|
||||
}
|
||||
|
||||
.video-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 80%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.video-container div {
|
||||
height: auto;
|
||||
box-sizing: border-box;
|
||||
width: 25%;
|
||||
padding: 0;
|
||||
height: 33.4%;
|
||||
border: 1px solid white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.video-container div,
|
||||
.video-container-right div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
transition: 0.1s;
|
||||
}
|
||||
|
||||
.video-container div:hover,
|
||||
.video-container-right div:hover {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.video-container div img,
|
||||
.video-container-right div img {
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.video-container div span,
|
||||
.video-container-right div span {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.video-container-right {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
float: right;
|
||||
width: 20%;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.video-container-right div {
|
||||
height: auto;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: 25%;
|
||||
padding: 0;
|
||||
border: 1px solid white;
|
||||
|
||||
}
|
||||
|
||||
.report video {
|
||||
width: 450px;
|
||||
border-right: 2px solid rgba(245, 245, 250, 1);
|
||||
}
|
||||
|
||||
|
||||
.edit-container {
|
||||
position: fixed;
|
||||
@ -1806,6 +1891,154 @@ video {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Стили для вашего календаря */
|
||||
.calendar {
|
||||
width: 250px;
|
||||
height: 300px;
|
||||
margin: 5px;
|
||||
padding: 0 25px;
|
||||
border-radius: 15px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 25%;
|
||||
background-color:white;
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
.calendar-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
/* background-color: #f0f0f0; */
|
||||
padding: 20px 5px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.calendar-header h2 {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
margin: 0;
|
||||
color: rgba(0, 0, 0, 0.90);
|
||||
}
|
||||
|
||||
#prevMonth {
|
||||
background-image: url(../img/left.svg);
|
||||
}
|
||||
|
||||
#nextMonth {
|
||||
background-image: url(../img/right.svg);
|
||||
}
|
||||
|
||||
#prevMonth, #nextMonth {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
height: 18px;
|
||||
cursor: pointer;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.daysOfWeek {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 15px 0;
|
||||
font-size: 14px;
|
||||
color: #7E818C;
|
||||
}
|
||||
|
||||
.dates {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(7, 1fr);
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.date {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
border-radius: 50%;
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
|
||||
.date:hover {
|
||||
background-color: #8086F939;
|
||||
}
|
||||
|
||||
.date.selected {
|
||||
background-color: #8086F9;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.video-popup {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/* background-color: rgba(0, 0, 0, 0.6); */
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.video-popup-content {
|
||||
position: absolute;
|
||||
/* top: 10%; */
|
||||
/* left: 50%; */
|
||||
transform: translate(-50%, -50%);
|
||||
/* background-color: white; */
|
||||
padding: 20px;
|
||||
/* box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); */
|
||||
text-align: center;
|
||||
z-index: 101;
|
||||
}
|
||||
|
||||
.close-popup {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.popup-video-container {
|
||||
width: 80%;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.video-time {
|
||||
width: calc(75% - 300px - 10px - 5px);
|
||||
height: 50px;
|
||||
position: absolute;
|
||||
right: 7px;
|
||||
bottom: 7px;
|
||||
background-color:white;
|
||||
border-radius: 15px;
|
||||
}
|
||||
input[type="time"]::-webkit-calendar-picker-indicator {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.video-time input[type="time"] {
|
||||
padding: 6px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.10);
|
||||
background: #FFF;
|
||||
font-size: 16px;
|
||||
outline: none;
|
||||
cursor: text;
|
||||
margin: 8px !important;
|
||||
}
|
||||
|
||||
input[type="time"]:hover,
|
||||
input[type="time"]:focus {
|
||||
border: 1px solid rgba(0, 0, 0, 0.30);
|
||||
}
|
||||
|
||||
@media (max-width: 1950px) {
|
||||
/* при разрешении монитора до 1950 пикселей */
|
||||
|
||||
|
||||
Reference in New Issue
Block a user