Changeset View
Changeset View
Standalone View
Standalone View
src/resources/themes/meet.scss
Show First 20 Lines • Show All 59 Lines • ▼ Show 20 Lines | video { | ||||
height: 100%; | height: 100%; | ||||
background: #000; | background: #000; | ||||
& + .watermark { | & + .watermark { | ||||
display: none; | display: none; | ||||
} | } | ||||
} | } | ||||
&.screen video { | |||||
// For shared screen videos we use the original aspect ratio | |||||
object-fit: scale-down; | |||||
background: none; | |||||
} | |||||
&.fullscreen { | &.fullscreen { | ||||
video { | video { | ||||
// We don't want the video to be cut in fullscreen | // We don't want the video to be cut in fullscreen | ||||
// This will preserve the aspect ratio of the video stream | // This will preserve the aspect ratio of the video stream | ||||
object-fit: contain; | object-fit: contain; | ||||
} | } | ||||
} | } | ||||
▲ Show 20 Lines • Show All 114 Lines • ▼ Show 20 Lines | #meet-session-menu { | ||||
} | } | ||||
} | } | ||||
#meet-session-layout { | #meet-session-layout { | ||||
flex: 1; | flex: 1; | ||||
overflow: hidden; | overflow: hidden; | ||||
} | } | ||||
#meet-publishers { | |||||
height: 100%; | |||||
position: relative; | |||||
} | |||||
#meet-subscribers { | |||||
padding: 0.15em; | |||||
overflow-y: auto; | |||||
.meet-subscriber { | |||||
margin: 0.15em; | |||||
max-width: calc(25% - 0.4em); | |||||
} | |||||
// Language interpreters will be displayed as subscribers, but will have still | |||||
// the video element that we will hide | |||||
video { | |||||
display: none; | |||||
} | |||||
} | |||||
#meet-session { | #meet-session { | ||||
display: flex; | display: flex; | ||||
justify-content: center; | flex-direction: column; | ||||
flex-wrap: wrap; | |||||
flex: 1; | flex: 1; | ||||
position: relative; // for #meet-subscribers positioning | overflow: hidden; | ||||
} | |||||
#meet-subscribers { | & > div { | ||||
display: flex; | display: flex; | ||||
flex-wrap: wrap; | flex-wrap: wrap; | ||||
order: 999; | |||||
padding: 0.15em; | |||||
width: 100%; | width: 100%; | ||||
overflow-y: auto; | |||||
&:empty { | &:empty { | ||||
display: none; | display: none; | ||||
} | } | ||||
.meet-subscriber { | |||||
margin: 0.15em; | |||||
max-width: calc(25% - 0.4em); | |||||
} | } | ||||
// when the subscribers list is the only child this means | #meet-publishers:empty { | ||||
// there's no publisher videos in the room yet | & + #meet-subscribers { | ||||
&:only-child { | |||||
justify-content: center; | justify-content: center; | ||||
align-content: center; | align-content: center; | ||||
flex: 1; | |||||
} | |||||
} | } | ||||
&:not(:only-child) { | #meet-publishers:not(:empty) { | ||||
& + #meet-subscribers { | |||||
max-height: 30%; | max-height: 30%; | ||||
} | } | ||||
// Language interpreters will be displayed as subscribers, but will have still | |||||
// the video element that we will hide | |||||
video { | |||||
display: none; | |||||
} | } | ||||
} | } | ||||
#meet-chat { | #meet-chat { | ||||
width: 0; | width: 0; | ||||
display: none; | display: none; | ||||
flex-direction: column; | flex-direction: column; | ||||
▲ Show 20 Lines • Show All 141 Lines • Show Last 20 Lines |