X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;ds=sidebyside;f=client%2Fsrc%2Fsass%2Fapplication.scss;h=fa9c0d9924d2ff7edc6580da515d7729f13bec65;hb=4024c44f9027a32809931de0692d40d001df721c;hp=c35574568a64cf95a0b8ee2678edbd2f5231e99b;hpb=d794137057fc5fcea10ddd29f82e79ee2412fea4;p=github%2FChocobozzz%2FPeerTube.git

diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss
index c35574568..fa9c0d992 100644
--- a/client/src/sass/application.scss
+++ b/client/src/sass/application.scss
@@ -6,11 +6,6 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/';
 
 @import '_fonts';
 
-@import '~video.js/dist/video-js.css';
-
-$assets-path: '../../assets/';
-@import './player/index';
-
 @import './bootstrap';
 @import './primeng-custom';
 @import './ng-select.scss';
@@ -58,6 +53,7 @@ body {
   --activatedActionButtonColor: #{$activated-action-button-color};
 
   --horizontalMarginContent: #{$not-expanded-horizontal-margins};
+  --videosHorizontalMarginContent: 6vw;
   --mainColWidth: calc(100vw - #{$menu-width});
 
   font-family: $main-fonts;
@@ -332,16 +328,28 @@ ngx-loading-bar {
 }
 
 @media screen and (max-width: #{breakpoint(xxl)}) {
-  .main-col.expanded {
-    --horizontalMarginContent: #{$expanded-horizontal-margins/2};
+  .main-col {
+    & {
+      --horizontalMarginContent: #{$not-expanded-horizontal-margins / 2};
+    }
+
+    &.expanded {
+      --horizontalMarginContent: #{$expanded-horizontal-margins / 2};
+    }
+
+    --videosHorizontalMarginContent: 30px;
   }
 }
 
 @media screen and (max-width: #{breakpoint(lg)}) {
+  .main-col {
+    --videosHorizontalMarginContent: #{pvar(--horizontalMarginContent)};
+  }
+
   /* the following applies from 500px to 900px and is partially overriden from 500px to 800px by changes below to $small-view */
   .main-col,
   .main-col.expanded {
-    --horizontalMarginContent: #{$expanded-horizontal-margins/3};
+    --horizontalMarginContent: #{$expanded-horizontal-margins / 3};
 
     .sub-menu {
       padding-left: 50px;