Update cowebsite mobile style

This commit is contained in:
Gregoire Parant 2021-04-20 21:11:05 +02:00
parent 30c1825abd
commit 20e0a2553e
2 changed files with 69 additions and 59 deletions

View File

@ -87,51 +87,3 @@
}
}
}
@media (max-aspect-ratio: 1/1) {
#main-container {
display: flex;
flex-direction: column-reverse;
}
#cowebsite {
left: 0;
top: 0;
width: 100%;
height: 50%;
display: flex;
flex-direction: column-reverse;
&.loading {
transform: translateY(-90%);
}
&.hidden {
transform: translateY(-100%);
}
main {
height: 100%;
}
aside {
height: 30px;
cursor: ns-resize;
flex-direction: column;
img {
cursor: ns-resize;
}
}
.top-right-btn {
&#cowebsite-close {
right: 0px;
}
&#cowebsite-fullscreen {
right: 25px;
}
}
}
}

View File

@ -1,6 +1,6 @@
@media only screen and (max-width: 700px) {
video#myCamVideo {
width: 200px;
width: 150px;
}
.sidebar {
@ -21,19 +21,28 @@
}
}
.btn-cam-action div {
bottom: 30px;
&.btn-micro {
right: 15px;
.btn-cam-action {
&:hover{
transform: translateY(20px);
}
div {
&:hover {
background-color: #666;
}
&.btn-monitor {
right: 171px;
}
bottom: 30px;
&.btn-video {
right: 95px;
&.btn-micro {
right: 0;
}
&.btn-monitor {
right: 130px;
}
&.btn-video {
right: 65px;
}
}
}
@ -48,3 +57,52 @@
}
}
@media (max-aspect-ratio: 1/1) {
#main-container {
display: flex;
flex-direction: column-reverse;
}
#cowebsite {
left: 0;
top: 0;
width: 100%;
height: 50%;
display: flex;
flex-direction: column-reverse;
&.loading {
transform: translateY(-90%);
}
&.hidden {
transform: translateY(-100%);
}
main {
height: 100%;
}
aside {
height: 30px;
cursor: ns-resize;
flex-direction: column;
img {
cursor: ns-resize;
}
}
.top-right-btn {
&#cowebsite-close {
right: 0;
}
&#cowebsite-fullscreen {
left: 0;
}
}
}
}