refactor: image styles

src/routes/Player/Player.js

@@ -618,8 +618,8 @@ const Player = ({ urlParams, queryParams }) => {
             }
             {
                 !video.state.loaded ?
-                    <div className={styles['layer']}>
+                    <div className={classnames(styles['layer'], styles['background-layer'])}>
-                        <img src={player?.metaItem?.content?.background} />
+                        <img className={styles['image']} src={player?.metaItem?.content?.background} />
                     </div>
                     :
                     null

src/routes/Player/styles.less

@@ -44,6 +44,14 @@ html:not(.active-slider-within) {
             z-index: 1;
         }
 
+        &.background-layer {
+            .image {
+                width: 100vw;
+                height: 100vh;
+                object-fit: cover;
+            }
+        }
+
         &.nav-bar-layer {
             bottom: initial;
             background: transparent;