Changeset View
Changeset View
Standalone View
Standalone View
src/resources/sass/meet.scss
- This file was added.
#app.meet { | |||||
height: 100%; | |||||
#meet-component { | |||||
overflow: hidden; | |||||
} | |||||
} | |||||
#meet-component { | |||||
flex-grow: 1; | |||||
display: flex; | |||||
flex-direction: column; | |||||
& + .filler { | |||||
display: none; | |||||
} | |||||
} | |||||
#meet-session-toolbar { | |||||
display: flex; | |||||
justify-content: center; | |||||
} | |||||
#meet-session-menu { | |||||
button { | |||||
font-size: 1.3rem; | |||||
padding: 0.5rem 1rem; | |||||
} | |||||
} | |||||
#meet-session { | |||||
display: flex; | |||||
justify-content: center; | |||||
flex-wrap: wrap; | |||||
flex: 1; | |||||
overflow: hidden; | |||||
} | |||||
.meet-video { | |||||
position: relative; | |||||
video { | |||||
// To make object-fit:cover working we have to set the height in pixels | |||||
// on the wrapper element. This is what javascript method will do. | |||||
object-fit: cover; | |||||
width: 100%; | |||||
height: 100%; | |||||
} | |||||
} | |||||
#meet-setup { | |||||
} | |||||
#setup-preview { | |||||
display: flex; | |||||
video { | |||||
width: 100%; | |||||
transform: rotateY(180deg); | |||||
background: black; | |||||
} | |||||
} |