fixing grid readjustment with expand and screens < 1150px

1 files changed, 9 insertions, 5 deletions

diff --git a/client/src/app/videos/+video-watch/video-watch.component.html b/client/src/app/videos/+video-watch/video-watch.component.html
index 3b6b5d8ed..582cf6e37 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.html
+++ b/client/src/app/videos/+video-watch/video-watch.component.html
@@ -28,7 +28,7 @@
   <!-- Video information -->
   <div *ngIf="video" class="margin-content video-bottom">
     <div class="row fullWidth">
-      <div class="col-12 col-lg-9 video-info">
+      <div class="col-12 col-lg-auto video-info">
         <div class="video-info-first-row">
           <div>
             <div class="d-block d-sm-none"> <!-- only shown on small devices, has its conterpart for larger viewports below -->
@@ -197,12 +197,16 @@
           </div>
         </div>
 
-      <my-video-comments [video]="video" [user]="user"></my-video-comments>
+        <my-video-comments [video]="video" [user]="user"></my-video-comments>
+      </div>
+
+      <div *ngIf="!isMenuExpanded()" class="w-100-until-1150px"></div>
+      
+      <my-recommended-videos class="col-12 col-lg-3"
+        [inputRecommendation]="{ uuid: video.uuid, tags: video.tags }" [user]="user"></my-recommended-videos>
     </div>
-    <my-recommended-videos class="col-12 col-lg-3"
-      [inputRecommendation]="{ uuid: video.uuid, tags: video.tags }" [user]="user"></my-recommended-videos>
   </div>
-
+  
   <div class="privacy-concerns" *ngIf="hasAlreadyAcceptedPrivacyConcern === false">
     <div class="privacy-concerns-text">
       <strong i18n>Friendly Reminder: </strong>