181 lines
3.1 KiB
SCSS
181 lines
3.1 KiB
SCSS
@import "client/common.css.scss";
|
|
|
|
[layout-id="session"] {
|
|
|
|
.settings {
|
|
margin-left:15px;
|
|
}
|
|
|
|
#session-controls {
|
|
|
|
width:100%;
|
|
padding:11px 0px 11px 0px;
|
|
background-color:#4c4c4c;
|
|
min-height:20px;
|
|
overflow-x:hidden;
|
|
}
|
|
|
|
#volume {
|
|
position:relative;
|
|
font-size:12px;
|
|
margin-top:5px;
|
|
margin-left:12px;
|
|
color:#ccc;
|
|
float:left;
|
|
width:120px;
|
|
/*background-image:url(../images/content/bkg_volume.png);*/
|
|
background-image: url('/assets/content/bkg_volume.png');
|
|
background-position:right;
|
|
background-repeat:no-repeat;
|
|
}
|
|
|
|
.slider-volume {
|
|
position:absolute;
|
|
top:2px;
|
|
right:30px;
|
|
width:8px;
|
|
height:17px;
|
|
}
|
|
|
|
/* Session Tracks */
|
|
.session-track {
|
|
width: 125px;
|
|
height: 300px;
|
|
border: 1px solid #fff;
|
|
position:relative;
|
|
float:left;
|
|
}
|
|
.session-track [track-role] { margin:4px; }
|
|
.session-track .latency { text-align:center; }
|
|
.session-track .latency.good { color:#00ff00; }
|
|
.session-track .latency.medium { color:#ffff00; }
|
|
.session-track .latency.bad { color:#ff0000; }
|
|
|
|
.session-track .mute {
|
|
background-color:#bbb; color:#000;
|
|
position: absolute;
|
|
bottom: 80px;
|
|
width: 117px;
|
|
text-align: center;
|
|
}
|
|
|
|
.session-track .name {
|
|
background-color:#ddd; color:#000;
|
|
position: absolute;
|
|
bottom: 60px;
|
|
width: 117px;
|
|
text-align: center;
|
|
}
|
|
.session-track .part {
|
|
background-color:#fff; color:#000;
|
|
position: absolute;
|
|
bottom: 40px;
|
|
width: 117px;
|
|
text-align: center;
|
|
}
|
|
|
|
.session-track .avatar {
|
|
position:absolute;
|
|
width: 32px;
|
|
height: 32px;
|
|
bottom:4px;
|
|
left: 46px;
|
|
}
|
|
.session-track .avatar img {
|
|
width: 32px; height: 32px;
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
#session-mytracks {
|
|
margin-left:-20px;
|
|
float:left;
|
|
display:inline-block;
|
|
width:19%;
|
|
min-width:165px;
|
|
border-right:solid 1px #666;
|
|
}
|
|
|
|
#session-tracks-scroller {
|
|
overflow-x:auto;
|
|
overflow-y:hidden;
|
|
width:100%;
|
|
height:340px;
|
|
float:left;
|
|
white-space:nowrap;
|
|
}
|
|
|
|
.track {
|
|
width:70px;
|
|
height:290px;
|
|
display:inline-block;
|
|
margin-right:8px;
|
|
position:relative;
|
|
background-color:#242323;
|
|
}
|
|
|
|
.track-empty {
|
|
min-width:230px;
|
|
height:201px;
|
|
margin-right:8px;
|
|
padding-top:70px;
|
|
text-align:center;
|
|
font-weight:600;
|
|
font-style:italic;
|
|
font-size:16px;
|
|
white-space:normal;
|
|
color:#666;
|
|
}
|
|
|
|
.track-empty a {
|
|
color:#aaa;
|
|
}
|
|
|
|
.track-vu-left {
|
|
position:absolute;
|
|
bottom:8px;
|
|
left:0px;
|
|
}
|
|
|
|
.track-vu-right {
|
|
position:absolute;
|
|
bottom:8px;
|
|
right:0px;
|
|
}
|
|
|
|
.vu-red-off {
|
|
background-color:#6c1709;
|
|
}
|
|
|
|
.vu-red-on {
|
|
background-color:#e73619;
|
|
}
|
|
|
|
.vu-green-off {
|
|
background-color:#244105;
|
|
}
|
|
|
|
.vu-green-on {
|
|
background-color:#72a43b;
|
|
}
|
|
|
|
.track-label {
|
|
position: absolute;
|
|
width: 55px;
|
|
top: 3px;
|
|
left: 7px;
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.track-close {
|
|
position:absolute;
|
|
top:3px;
|
|
right:3px;
|
|
width:12px;
|
|
height:12px;
|
|
}
|