feat(videodetail): fix responsiveness

jwplayer · Jun 3, 2021 · bded9bf · bded9bf
1 parent a3c109d
commit bded9bf
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 4 deletions.
diff --git a/src/components/Shelf/Shelf.module.scss b/src/components/Shelf/Shelf.module.scss
@@ -13,7 +13,7 @@
   @include responsive.tablet-only() {
     margin: 0 variables.$base-spacing * 2;
   }
-  margin: 12px 56px;
+  margin: 12px 0px;
   color: var(--primary-color);
   font-family: var(--body-alt-font-family);
 

diff --git a/src/components/Video/Video.module.scss b/src/components/Video/Video.module.scss
@@ -22,6 +22,7 @@
 }
 .info {
   max-width: 450px;
+  min-height: 380px;
   @include responsive.tablet-only() {
     max-width: 350px;
   }
@@ -117,7 +118,7 @@
   border-radius: 100%;
 }
 .other {
-  margin: 50px 0px;
+  margin-top: 50px;
 }
 .playerContainer {
   position: absolute;

diff --git a/src/containers/Cinema/Cinema.tsx b/src/containers/Cinema/Cinema.tsx
@@ -25,7 +25,7 @@ const Cinema: React.FC<Props> = ({ item, onPlay, onPause }: Props) => {
       if (init) {
         const player = getPlayer();
         player.setup({ file });
-        player.on('ready', () => console.info('Player ready'));
+        player.on('ready', () => player.play());
         player.on('play', () => onPlay());
         player.on('pause', () => onPause());
         setInit(false);

diff --git a/src/screens/Home/Home.module.scss b/src/screens/Home/Home.module.scss
@@ -7,3 +7,6 @@
     overflow: visible !important;
   }
 }
+.shelfContainer {
+  padding: 0px 56px;
+}
diff --git a/src/screens/Home/Home.tsx b/src/screens/Home/Home.tsx
@@ -52,7 +52,7 @@ const Home = (): JSX.Element => {
     const onCardHover = (playlistItem: PlaylistItem) => updateBlurImage(playlistItem.image);
 
     return (
-      <div key={key} style={style}>
+      <div key={key} style={style} className={styles.shelfContainer}>
         <Shelf
           key={contentItem.playlistId}
           playlistId={contentItem.playlistId}