Refactor feed component

diff --git a/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss b/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss
index d208944fec52b692955417e7566c728bced71ef6..c9262da098f136ff9715c1deef0e7818c080e61a 100644 (file)
--- a/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss
+++ b/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss
@@ -1,17 +1,9 @@
 @import 'mixins';
 
-h1 {
-  my-feed {
-    margin-left: 5px;
-    display: inline-block;
-
-    ::ng-deep {
-      my-global-icon {
-        width: 15px !important;
-        top: 0 !important;
-      }
-    }
-  }
+my-feed {
+  margin-left: 5px;
+  display: inline-block;
+  width: 15px;
 }
 
 my-global-icon {

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 df42fae7310b284274b98b9e0a53fdfbd0ef439a..e6778e1a95e8733125cea642e75028119364e6e5 100644 (file)
--- a/client/src/app/+videos/+video-watch/comment/video-comments.component.scss
+++ b/client/src/app/+videos/+video-watch/comment/video-comments.component.scss
@@ -27,7 +27,11 @@
     margin-left: 5px;
     opacity: 0;
     transition: ease-in .2s opacity;
+    width: 12px;
+    position: relative;
+    top: -3px;
   }
+
   &:hover my-feed {
     opacity: 1;
   }

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 8f70652ee27d4852d7380f8dca8251d5e06c04b5..e8ad10a11926f3e4a7b2cb1e3fbf07e8b0252215 100644 (file)
--- a/client/src/app/+videos/+video-watch/video-watch.component.scss
+++ b/client/src/app/+videos/+video-watch/video-watch.component.scss
@@ -206,11 +206,6 @@ $video-info-margin-left: 44px;
         }
       }
 
-      my-feed {
-        margin-left: 5px;
-        margin-top: 1px;
-      }
-
       .video-actions-rates {
         margin: 0 0 10px 0;
         align-items: start;

diff --git a/client/src/app/shared/shared-main/feeds/feed.component.scss b/client/src/app/shared/shared-main/feeds/feed.component.scss
index 333d5944060d83ff810884d474f445a7ed8db8e7..b655ee7083461a4d642646a275e1cd53831b505d 100644 (file)
--- a/client/src/app/shared/shared-main/feeds/feed.component.scss
+++ b/client/src/app/shared/shared-main/feeds/feed.component.scss
@@ -2,19 +2,17 @@
 @import '_mixins';
 
 .feed {
-  width: min-content;
+  width: 100%;
 
   a {
     color: black;
     display: block;
   }
+}
 
-  my-global-icon {
-    cursor: pointer;
-    width: 12px;
-    position: relative;
-    top: -2px;
+my-global-icon {
+  cursor: pointer;
+  width: 100%;
 
-    @include apply-svg-color(pvar(--mainForegroundColor))
-  }
+  @include apply-svg-color(pvar(--mainForegroundColor))
 }

diff --git a/client/src/app/shared/shared-video-miniature/abstract-video-list.html b/client/src/app/shared/shared-video-miniature/abstract-video-list.html
index ee5df28be2138844a9765e66d9a95ba887d52bbc..9ffeac5e8872d9bad3d0fb9af4dd1f286e586b6f 100644 (file)
--- a/client/src/app/shared/shared-video-miniature/abstract-video-list.html
+++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.html
@@ -4,6 +4,7 @@
 
     <div class="action-block">
       <my-feed *ngIf="syndicationItems" [syndicationItems]="syndicationItems"></my-feed>
+
       <ng-container *ngFor="let action of actions">
         <a *ngIf="action.routerLink" class="ml-2" [routerLink]="action.routerLink" routerLinkActive="active">
           <ng-container *ngTemplateOutlet="actionContent; context:{ $implicit: action }"></ng-container>

diff --git a/client/src/app/shared/shared-video-miniature/abstract-video-list.scss b/client/src/app/shared/shared-video-miniature/abstract-video-list.scss
index 6570b63d0011fb0c7c9059894aa3b1cab2662a52..467ca1d2c7c62f869cb82c8f686c63245bf45459 100644 (file)
--- a/client/src/app/shared/shared-video-miniature/abstract-video-list.scss
+++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.scss
@@ -15,18 +15,9 @@ $iconSize: 16px;
   justify-content: space-between;
   align-items: center;
 
-  .action-block {
-    ::ng-deep my-feed {
-      my-global-icon {
-        width: calc(#{$iconSize} - 2px);
-      }
-    }
-
-    a button {
-      @include peertube-button;
-      @include grey-button;
-      @include button-with-icon($iconSize, 3px, -1px);
-    }
+  my-feed {
+    display: inline-block;
+    width: calc(#{$iconSize} - 2px);
   }
 
   .moderation-block {
@@ -34,21 +25,12 @@ $iconSize: 16px;
     my-global-icon {
       position: relative;
       width: $iconSize;
-      top: -2px;
     }
 
     margin-left: .4rem;
     display: flex;
     justify-content: flex-end;
     align-items: center;
-
-    .dropdown-item {
-      padding: 0;
-
-      ::ng-deep my-peertube-checkbox label {
-        padding: 3px 15px;
-      }
-    }
   }
 }
 

diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss
index 73606f9403b6347e06b71e09fcd71066b020b1b6..e03201ceffb658a91b81b6995406ce8e77cf015f 100644 (file)
--- a/client/src/sass/include/_mixins.scss
+++ b/client/src/sass/include/_mixins.scss
@@ -914,7 +914,7 @@
     padding-bottom: 15px;
     margin-bottom: $sub-menu-margin-bottom;
 
-    my-global-icon {
+    > my-global-icon {
       margin-right: 10px;
       vertical-align: bottom;
       width: 24px;