jiti-meet/css/premeeting/_connection-status.scss

72 lines
1.2 KiB
SCSS

.con-status {
border-radius: 6px;
color: #fff;
font-size: 12px;
letter-spacing: 0.16px;
line-height: 16px;
position: absolute;
width: 100%;
&-header {
background-color: rgba(0, 0, 0, 0.7);
align-items: center;
display: flex;
padding: 14px 16px;
}
&-circle {
border-radius: 50%;
display: inline-block;
padding: 4px;
margin-right: 16px;
}
&--good {
background: #31B76A;
}
&--poor {
background: #E12D2D;
}
&--non-optimal {
background: #E39623;
}
&-arrow {
margin-left: auto;
transition: background-color 0.16s ease-out;
&--up {
transform: rotate(180deg);
}
&>svg {
cursor: pointer;
}
&:hover {
background-color: rgba(1,1,1, 0.1);
}
}
&-text {
text-align: center;
}
&-details {
background-color: rgba(0, 0, 0, 0.7);
border-top: 1px solid #5E6D7A;
padding: 16px;
transition: opacity 0.16s ease-out;
&-visible {
opacity: 1;
}
&-hidden {
opacity: 0;
}
}
}