Simplifie CSS

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

res/css/views/voip/_VideoFeed.scss

@@ -20,7 +20,6 @@ limitations under the License.
     background-color: $inverted-bg-color;
 }
 
-
 .mx_VideoFeed_primary {
     width: 100%;
     height: 100%;
@@ -33,12 +32,10 @@ limitations under the License.
     }
 }
 
-.mx_VideoFeed_secondary {
+.mx_VideoFeed_nonPrimary {
     max-width: 25%;
     max-height: 25%;
     position: absolute;
-    right: 10px;
-    top: 10px;
     z-index: 100;
     border-radius: 4px;
 
@@ -47,32 +44,19 @@ limitations under the License.
     }
 }
 
+.mx_VideoFeed_secondary {
+    right: 10px;
+    top: 10px;
+}
+
 .mx_VideoFeed_tertiary {
-    max-width: 25%;
-    max-height: 25%;
-    position: absolute;
     right: 10px;
     bottom: 10px;
-    z-index: 100;
-    border-radius: 4px;
-
-    &.mx_VideoFeed_video {
-        background-color: transparent;
-    }
 }
 
 .mx_VideoFeed_quaternary {
-    max-width: 25%;
-    max-height: 25%;
-    position: absolute;
     left: 10px;
     top: 10px;
-    z-index: 100;
-    border-radius: 4px;
-
-    &.mx_VideoFeed_video {
-        background-color: transparent;
-    }
 }
 
 .mx_VideoFeed_mirror {

src/components/views/voip/VideoFeed.tsx

@@ -123,6 +123,7 @@ export default class VideoFeed extends React.Component<IProps, IState> {
     render() {
         const videoClasses = {
             mx_VideoFeed: true,
+            mx_VideoFeed_nonPrimary: this.props.className !== "mx_VideoFeed_primary",
             [this.props.className]: true,
             mx_VideoFeed_voice: this.state.videoMuted,
             mx_VideoFeed_video: !this.state.videoMuted,