merge latest dev

front/style/style.css

@@ -142,6 +142,11 @@ body .message-info.warning {
     right: 15px;
     bottom: 30px;
     max-height: 20%;
+    transition: right 350ms;
+}
+
+#div-myCamVideo.hide {
+    right: -20vw;
 }
 
 video#myCamVideo {
@@ -202,12 +207,12 @@ video#myCamVideo {
     display: inline-flex;
     bottom: 10px;
     right: 15px;
-    width: 15vw;
+    width: 180px;
     height: 40px;
     text-align: center;
     align-content: center;
     align-items: center;
-    justify-content: center;
+    justify-content: flex-end;
     justify-items: center;
 }
 
@@ -220,7 +225,6 @@ video#myCamVideo {
     width: auto;
     transform: translateY(20px);
     transition-timing-function: ease-in-out;
-    margin-bottom: 20px;
     margin: 0 4%;
 }
 
@@ -259,8 +263,13 @@ video#myCamVideo {
     transition: all .2s;
     /*right: 224px;*/
 }
-
-.btn-copy {
+.btn-monitor.hide {
+    transform: translateY(60px);
+}
+.btn-cam-action:hover .btn-monitor.hide{
+    transform: translateY(60px);
+}
+.btn-copy{
     pointer-events: auto;
     transition: all .3s;
     right: 44px;
@@ -359,6 +368,8 @@ video#myCamVideo {
 #myCamVideoSetup {
     width: 100%;
     height: 100%;
+    -webkit-transform: scaleX(-1);
+    transform: scaleX(-1);
 }
 
 .webrtcsetup.active {