如何在 WebRTC Angular 中按人数组织视频盒？

Question

我安装了这个位于 WebRTC 存储库中的项目。在我的会议应用程序项目中，我希望随着加入房间的人数（带有红色框架）的增加而减小框架的大小。这样我就可以在不使用滚动的情况下查看所有与会者。

这是那段代码：

<div id="app">
<form class="center bg-paint-white" *ngIf="!conversation" [formGroup]="conversationFormGroup"
    (ngSubmit)="getOrcreateConversation()">
    <mat-form-field>
        <mat-label>Oda Kodu</mat-label>
        <input type="text" matInput formControlName="name" /> </mat-form-field>&nbsp;
    <button class="button" mat-raised-button color="primary" type="submit" [disabled]="!conversationFormGroup.valid"
        title="Konferans Oluştur/Katıl">
        Konferans Oluştur
    </button>
</form>
<div *ngIf="conversation" class="container">
    <div id="remote-container" class="fullscreen"></div>

    <div id="local-container" [ngClass]="{ over: remotesCounter > 0 }">
        <video #localVideo autoplay playsinline></video>
    </div>
</div>