Reorganize some CSS
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
parent
c2aada6aa7
commit
7ad62a8b1a
2 changed files with 23 additions and 12 deletions
|
@ -19,19 +19,20 @@ limitations under the License.
|
||||||
right: 16px;
|
right: 16px;
|
||||||
bottom: 16px;
|
bottom: 16px;
|
||||||
z-index: 100; // To be above the primary feed
|
z-index: 100; // To be above the primary feed
|
||||||
width: 20%;
|
|
||||||
min-width: 160px;
|
height: 100%;
|
||||||
|
width: 25%;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column-reverse;
|
flex-direction: column-reverse;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: flex-end;
|
||||||
|
gap: 12px;
|
||||||
|
|
||||||
.mx_VideoFeed {
|
> .mx_VideoFeed {
|
||||||
border-radius: 4px;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-bottom: 12px;
|
|
||||||
|
|
||||||
&.mx_VideoFeed_voice {
|
&.mx_VideoFeed_voice {
|
||||||
background-color: $inverted-bg-color;
|
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
@ -39,16 +40,13 @@ limitations under the License.
|
||||||
min-width: 160px;
|
min-width: 160px;
|
||||||
min-height: 90px;
|
min-height: 90px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.mx_VideoFeed_video {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.mx_CallViewSidebar_pipMode {
|
&.mx_CallViewSidebar_pipMode {
|
||||||
top: 16px;
|
top: 16px;
|
||||||
bottom: unset;
|
bottom: unset;
|
||||||
min-width: unset;
|
justify-content: flex-end;
|
||||||
|
gap: 4px;
|
||||||
|
|
||||||
.mx_VideoFeed_voice {
|
.mx_VideoFeed_voice {
|
||||||
min-width: 64px;
|
min-width: 64px;
|
||||||
|
|
|
@ -14,6 +14,19 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
.mx_VideoFeed {
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
|
||||||
|
&.mx_VideoFeed_voice {
|
||||||
|
background-color: $inverted-bg-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.mx_VideoFeed_video {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.mx_VideoFeed_mirror {
|
.mx_VideoFeed_mirror {
|
||||||
transform: scale(-1, 1);
|
transform: scale(-1, 1);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue