Putting a wider onhover surface when clicking on one of the buttons to manage screen sharing or video/mic
This commit is contained in:
parent
2ae19b9f30
commit
f60b02f1dc
front/dist
26
front/dist/index.html
vendored
26
front/dist/index.html
vendored
@ -68,19 +68,19 @@
|
||||
<div id="div-myCamVideo" class="video-container">
|
||||
<video id="myCamVideo" autoplay muted></video>
|
||||
</div>
|
||||
<div class="btn-cam-action">
|
||||
<div class="btn-micro">
|
||||
<img id="microphone" src="resources/logos/microphone.svg">
|
||||
<img id="microphone-close" src="resources/logos/microphone-close.svg">
|
||||
</div>
|
||||
<div class="btn-video">
|
||||
<img id="cinema" src="resources/logos/cinema.svg">
|
||||
<img id="cinema-close" src="resources/logos/cinema-close.svg">
|
||||
</div>
|
||||
<div class="btn-monitor">
|
||||
<img id="monitor" src="resources/logos/monitor.svg">
|
||||
<img id="monitor-close" src="resources/logos/monitor-close.svg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-cam-action">
|
||||
<div class="btn-micro">
|
||||
<img id="microphone" src="resources/logos/microphone.svg">
|
||||
<img id="microphone-close" src="resources/logos/microphone-close.svg">
|
||||
</div>
|
||||
<div class="btn-video">
|
||||
<img id="cinema" src="resources/logos/cinema.svg">
|
||||
<img id="cinema-close" src="resources/logos/cinema-close.svg">
|
||||
</div>
|
||||
<div class="btn-monitor">
|
||||
<img id="monitor" src="resources/logos/monitor.svg">
|
||||
<img id="monitor-close" src="resources/logos/monitor-close.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
11
front/dist/resources/style/style.css
vendored
11
front/dist/resources/style/style.css
vendored
@ -79,6 +79,13 @@ video#myCamVideo{
|
||||
}
|
||||
|
||||
|
||||
.btn-cam-action {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 0px;
|
||||
width: 450px;
|
||||
height: 150px;
|
||||
}
|
||||
/*btn animation*/
|
||||
.btn-cam-action div{
|
||||
cursor: pointer;
|
||||
@ -93,7 +100,7 @@ video#myCamVideo{
|
||||
transition-timing-function: ease-in-out;
|
||||
bottom: 20px;
|
||||
}
|
||||
#activeCam:hover .btn-cam-action div{
|
||||
.btn-cam-action:hover div{
|
||||
transform: translateY(0);
|
||||
}
|
||||
.btn-cam-action div:hover{
|
||||
@ -106,7 +113,7 @@ video#myCamVideo{
|
||||
right: 44px;
|
||||
}
|
||||
.btn-video{
|
||||
transition: all .2s;
|
||||
transition: all .25s;
|
||||
right: 134px;
|
||||
}
|
||||
.btn-monitor{
|
||||
|
Loading…
Reference in New Issue
Block a user