ComunicWeb/assets/css/components/calls/callWindow.css

111 lines
1.6 KiB
CSS

/**
* Calls window stylesheet
*
* @author Pierre HUBERT
*/
.call-window {
background-color: white;
width: 300px;
position: fixed;
top: 100px;
right: 10px;
z-index: 100;
border: 1px black solid;
display: flex;
flex-direction: column;
background-color: #000000b3;
}
.call.window.body {
flex: 1;
}
/**
* Toolbar
*/
.call-toolbar {
height: 20px;
background-color: #000000b3;
color: white;
display: flex;
align-items: center;
padding-left: 10px;
}
.call-toolbar > i:first-child {
margin-right: 6px;
}
.call-title {
flex: 1;
}
/**
* Loading message
*/
.loading-message-container {
position: absolute;
min-height: 112px;
width: 100%;
display: flex;
background: 1px #0009;
flex-direction: column;
justify-content: space-around;
text-align: center;
font-size: 150%;
color: white;
}
/**
* Stream target
*/
.call-window .streams-target {
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.call-window .streams-target video {
width: 149px;
}
/**
* Footer
*/
.call-window .call-footer {
height: 40px;
display: flex;
justify-content: space-around;
align-items: center;
}
.call-window .call-footer .call-option-button {
color: #fff6;
flex: 1;
text-align: center;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.call-window .call-footer .call-option-button.selected {
color: white;
}
.call-window .call-footer .call-option-button:hover {
background-color: #ffffff4d;
}
.call-window .call-footer .call-option-button:active {
background-color: #fff3;
}
.call-window .call-footer .call-option-button.hang-up-button {
color: #dd4b39;
}