7 files changed, 28 insertions, 20 deletions

diff --git a/client/src/app/+videos/+video-watch/comment/video-comment-add.component.scss b/client/src/app/+videos/+video-watch/comment/video-comment-add.component.scss
index 54e61eac4..7743bd41d 100644
--- a/client/src/app/+videos/+video-watch/comment/video-comment-add.component.scss
+++ b/client/src/app/+videos/+video-watch/comment/video-comment-add.component.scss
@@ -31,7 +31,7 @@ form {
     padding-right: $markdown-icon-width + 15px !important;
 
     @media screen and (max-width: 600px) {
-      padding-right: $markdown-icon-width + 19px  !important;
+      padding-right: $markdown-icon-width + 19px !important;
     }
 
     &:focus::placeholder {
@@ -57,7 +57,9 @@ form {
       }
     }
 
-    &:focus, &:active, &:hover {
+    &:focus,
+    &:active,
+    &:hover {
       my-global-icon svg {
         background-color: #C6C6C6;
         color: pvar(--mainBackgroundColor);
diff --git a/client/src/app/+videos/+video-watch/comment/video-comment.component.scss b/client/src/app/+videos/+video-watch/comment/video-comment.component.scss
index f0dcc08b8..a4d2e237c 100644
--- a/client/src/app/+videos/+video-watch/comment/video-comment.component.scss
+++ b/client/src/app/+videos/+video-watch/comment/video-comment.component.scss
@@ -62,7 +62,7 @@ my-actor-avatar {
   display: inline-flex;
   padding-right: 6px;
   padding-left: 6px;
-  color: white !important;
+  color: #fff !important;
 }
 
 .comment-account {
@@ -133,7 +133,10 @@ my-actor-avatar {
     cursor: pointer;
     margin-right: 10px;
 
-    &:hover, &:active, &:focus, &:focus-visible {
+    &:hover,
+    &:active,
+    &:focus,
+    &:focus-visible {
       color: pvar(--mainForegroundColor);
     }
   }
diff --git a/client/src/app/+videos/+video-watch/comment/video-comments.component.scss b/client/src/app/+videos/+video-watch/comment/video-comments.component.scss
index e6778e1a9..a7e858069 100644
--- a/client/src/app/+videos/+video-watch/comment/video-comments.component.scss
+++ b/client/src/app/+videos/+video-watch/comment/video-comments.component.scss
@@ -11,7 +11,8 @@
   cursor: pointer;
 }
 
-.glyphicon, .comment-thread-loading {
+.glyphicon,
+.comment-thread-loading {
   margin-right: 5px;
   display: inline-block;
   font-size: 13px;
@@ -40,7 +41,7 @@
 #dropdown-sort-comments {
   font-weight: 600;
   text-transform: uppercase;
-  border: none;
+  border: 0;
   transform: translateY(-7%);
 }
 
diff --git a/client/src/app/+videos/+video-watch/recommendations/recommended-videos.component.scss b/client/src/app/+videos/+video-watch/recommendations/recommended-videos.component.scss
index c9fae6f27..5e0373afc 100644
--- a/client/src/app/+videos/+video-watch/recommendations/recommended-videos.component.scss
+++ b/client/src/app/+videos/+video-watch/recommendations/recommended-videos.component.scss
@@ -8,7 +8,8 @@
   margin-bottom: 25px;
   flex-wrap: wrap-reverse;
 
-  .title-page.active, .title-page.title-page-single {
+  .title-page.active,
+  .title-page.title-page-single {
     margin-bottom: unset;
     margin-right: .5rem !important;
   }
diff --git a/client/src/app/+videos/+video-watch/video-watch-playlist.component.scss b/client/src/app/+videos/+video-watch/video-watch-playlist.component.scss
index 0b0a2a899..b3f93b83c 100644
--- a/client/src/app/+videos/+video-watch/video-watch-playlist.component.scss
+++ b/client/src/app/+videos/+video-watch/video-watch-playlist.component.scss
@@ -45,7 +45,7 @@
 
       my-global-icon {
         &:not(.active) {
-          opacity: .5
+          opacity: .5;
         }
 
         ::ng-deep {
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 eadb2148a..4779602d2 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.html
+++ b/client/src/app/+videos/+video-watch/video-watch.component.html
@@ -79,7 +79,7 @@
                   <span [innerHTML]="getRatePopoverText()"></span>
                 </ng-template>
 
-                <div class="video-actions fullWidth justify-content-end">
+                <div class="video-actions full-width justify-content-end">
                   <button
                     [ngbPopover]="getRatePopoverText() && ratePopoverText" [ngClass]="{ 'activated': userRating === 'like' }" (click)="setLike()" (keyup.enter)="setLike()"
                     class="action-button action-button-like" [attr.aria-pressed]="userRating === 'like'" [attr.aria-label]="tooltipLike"
diff --git a/client/src/app/+videos/+video-watch/video-watch.component.scss b/client/src/app/+videos/+video-watch/video-watch.component.scss
index e8ad10a11..301762695 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.scss
+++ b/client/src/app/+videos/+video-watch/video-watch.component.scss
@@ -6,12 +6,12 @@
 $player-factor: 16/9;
 $video-info-margin-left: 44px;
 
-@function getPlayerHeight($width){
-  @return calc(#{$width} / #{$player-factor})
+@function getPlayerHeight ($width) {
+  @return calc(#{$width} / #{$player-factor});
 }
 
-@function getPlayerWidth($height){
-  @return calc(#{$height} * #{$player-factor})
+@function getPlayerWidth ($height) {
+  @return calc(#{$height} * #{$player-factor});
 }
 
 @mixin playlist-below-player {
@@ -24,11 +24,11 @@ $video-info-margin-left: 44px;
 
 .root {
   &.theater-enabled #video-wrapper {
+    $height: calc(100vh - #{$header-height} - #{$theater-bottom-space});
+
     flex-direction: column;
     justify-content: center;
 
-    $height: calc(100vh - #{$header-height} - #{$theater-bottom-space});
-
     #videojs-wrapper {
       width: 100%;
       height: $height;
@@ -141,7 +141,7 @@ $video-info-margin-left: 44px;
     .video-info-first-row {
       display: flex;
 
-      & > div:first-child {
+      > div:first-child {
         flex-grow: 1;
       }
 
@@ -207,7 +207,7 @@ $video-info-margin-left: 44px;
       }
 
       .video-actions-rates {
-        margin: 0 0 10px 0;
+        margin: 0 0 10px;
         align-items: start;
         width: max-content;
         margin-left: auto;
@@ -231,7 +231,7 @@ $video-info-margin-left: 44px;
             font-size: 100%;
             font-weight: $font-semibold;
             display: inline-block;
-            padding: 0 10px 0 10px;
+            padding: 0 10px;
             white-space: nowrap;
             background-color: transparent !important;
             color: pvar(--actionButtonColor);
@@ -346,7 +346,8 @@ $video-info-margin-left: 44px;
         }
       }
 
-      .glyphicon, .description-loading {
+      .glyphicon,
+      .description-loading {
         margin-left: 3px;
       }
 
@@ -396,7 +397,7 @@ $video-info-margin-left: 44px;
       &.video-attribute-tags {
         .video-attribute-value:not(:nth-child(2)) {
           &::before {
-            content: ', '
+            content: ', ';
           }
         }
       }