bigbluebutton-Github/bigbluebutton-html5/app/client/stylesheets/users.less

172 lines
3.3 KiB
Plaintext
Executable File

@import "variables";
@import "mixins";
.statusIcon {
font-size: 18px;
}
#usericons {
text-align: right;
color: white;
span i {
@media @landscape, @desktop-portrait {
margin-right: 10px;
font-size: 20px;
}
}
}
.unreadChatNumber {
@media @landscape, @desktop-portrait{
float: left;
margin-top: 5px;
width: 28px;
height: 18px;
border-radius: 41%;
font-size: 12px;
color: #fff;
text-align: center;
background: #3896D3;
}
}
.usernameEntry {
cursor: pointer;
line-height: 1.1;
float:left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: calc(~'100% - 130px');
@media @landscape {
height: 27px;
font-size: 4.5mm;
}
@media @desktop-portrait {
height: 27px;
font-size: 4.5mm;
}
@media @mobile-portrait, @mobile-portrait-with-keyboard {
font-size: 4vw;
}
}
#users {
@media @landscape {
width: 100%;
border-left: 0px;
border-top: 0px;
border-top-right-radius: 0px;
}
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
width: 100%;
height: 100%;
border: none;
.linear-gradient(rgb(65,68,77), rgb(58,60,69));
}
order: 0;
height: 100%;
}
.darkening-in {
opacity: 0;
animation: darken-in 0.5s;
animation-fill-mode: forwards;
}
@keyframes darken-in {
0% {
opacity: 0;
}
100% {
opacity: 0.5;
}
}
#user-contents {
height: calc(~'100% - 50px'); /* user-contents = user-contens - meetingTitle */
@media @landscape, @desktop-portrait{
background-color: #34495E;
}
.userlist {
max-height: 100% !important;
height: 100%;
#content:hover {
@media @landscape, @desktop-portrait {
background-color: #2C4155;
}
}
#content {
span:hover {
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
background: transparent;
}
}
margin-top: 10px;
&:first-child { margin-top: 0px; }
overflow: hidden;
width: 100%;
@media @mobile-portrait, @mobile-portrait-with-keyboard {
/*background: #E6F0FA;*/
background: transparent;
color: white;
}
}
@media @landscape {
padding:10px;
max-height:83vh;
}
@media @desktop-portrait {
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
color: white;
}
@media @desktop-portrait, @mobile-portrait {
max-height: 58vw; //for longer userlist a scrollbar appears
}
}
}
.userCurrent {
font-weight: bold;
}
.toggleUserlistButton, .toggleMenuButton {
span {
@media @landscape, @desktop-portrait {
width: 26px;
margin-left: auto;
margin-right: auto;
height: 8%;
}
}
}
// changing mute/unmute icons on hover:
.muteIcon .ion-ios-mic-outline:hover:before {
content: "\f45f";
}
.muteIcon .ion-ios-mic:hover:before {
content: "\f45f";
}
.muteIcon .ion-ios-mic-off:hover:before {
content: "\f461";
}
.userName {
color: #E6E6E6;
line-height: 1.5;
}
.status {
float: left;
width: 15px;
min-width: 15px;
height: 27px;
margin-right: 10px;
font-size: 18px;
color: #FFFFFF;
}