14 files changed, 24 insertions, 36 deletions

diff --git a/client/src/app/shared/shared-moderation/account-blocklist.component.html b/client/src/app/shared/shared-moderation/account-blocklist.component.html
index 7eca6411e..3f2f55559 100644
--- a/client/src/app/shared/shared-moderation/account-blocklist.component.html
+++ b/client/src/app/shared/shared-moderation/account-blocklist.component.html
@@ -24,7 +24,7 @@
 
   <ng-template pTemplate="header">
     <tr>
-      <th style="width: 150px;">Action</th> <!-- column for action buttons -->
+      <th style="width: 150px;" i18n>Action</th> <!-- column for action buttons -->
       <th style="width: calc(100% - 300px);" i18n>Account</th>
       <th style="width: 150px;" i18n pSortableColumn="createdAt">Muted at <p-sortIcon field="createdAt"></p-sortIcon></th>
     </tr>
@@ -38,12 +38,7 @@
       <td>
         <a [href]="accountBlock.blockedAccount.url" i18n-title title="Open account in a new tab" target="_blank" rel="noopener noreferrer">
           <div class="chip two-lines">
-            <img
-              class="avatar"
-              [src]="accountBlock.blockedAccount.avatar?.path"
-              (error)="switchToDefaultAvatar($event)"
-              alt="Avatar"
-            >
+            <my-account-avatar [account]="accountBlock.blockedAccount"></my-account-avatar>
             <div>
               {{ accountBlock.blockedAccount.displayName }}
               <span class="text-muted">{{ accountBlock.blockedAccount.nameWithHost }}</span>
diff --git a/client/src/app/shared/shared-moderation/account-blocklist.component.ts b/client/src/app/shared/shared-moderation/account-blocklist.component.ts
index 3de9587b8..1bce65bf0 100644
--- a/client/src/app/shared/shared-moderation/account-blocklist.component.ts
+++ b/client/src/app/shared/shared-moderation/account-blocklist.component.ts
@@ -30,10 +30,6 @@ export class GenericAccountBlocklistComponent extends RestTable implements OnIni
     this.initialize()
   }
 
-  switchToDefaultAvatar ($event: Event) {
-    ($event.target as HTMLImageElement).src = Account.GET_DEFAULT_AVATAR_URL()
-  }
-
   unblockAccount (accountBlock: AccountBlock) {
     const blockedAccount = accountBlock.blockedAccount
     const operation = this.mode === BlocklistComponentType.Account
diff --git a/client/src/app/shared/shared-moderation/batch-domains-modal.component.html b/client/src/app/shared/shared-moderation/batch-domains-modal.component.html
index 1b85c8f48..6a3c65721 100644
--- a/client/src/app/shared/shared-moderation/batch-domains-modal.component.html
+++ b/client/src/app/shared/shared-moderation/batch-domains-modal.component.html
@@ -28,14 +28,11 @@
 
       <div class="form-group inputs">
         <input
-          type="button" role="button" i18n-value value="Cancel" class="action-button action-button-cancel"
+          type="button" role="button" i18n-value value="Cancel" class="peertube-button grey-button"
           (click)="hide()" (key.enter)="hide()"
         >
 
-        <input
-          type="submit" [value]="action" class="action-button-submit"
-          [disabled]="!form.valid"
-        >
+        <input type="submit" [value]="action" class="peertube-button orange-button" [disabled]="!form.valid" />
       </div>
     </form>
   </div>
diff --git a/client/src/app/shared/shared-moderation/moderation.scss b/client/src/app/shared/shared-moderation/moderation.scss
index 4a4e05535..cdcc12fe0 100644
--- a/client/src/app/shared/shared-moderation/moderation.scss
+++ b/client/src/app/shared/shared-moderation/moderation.scss
@@ -32,7 +32,7 @@
     color: pvar(--inputPlaceholderColor);
   }
 
-  @include large-screen-ratio($selector: 'div, ::ng-deep iframe') {
+  @include block-ratio($selector: 'div, ::ng-deep iframe') {
     width: 100% !important;
     height: 100% !important;
     left: 0;
diff --git a/client/src/app/shared/shared-moderation/report-modals/report.component.html b/client/src/app/shared/shared-moderation/report-modals/report.component.html
index bda62312f..6c99180ef 100644
--- a/client/src/app/shared/shared-moderation/report-modals/report.component.html
+++ b/client/src/app/shared/shared-moderation/report-modals/report.component.html
@@ -51,10 +51,11 @@
 
     <div class="form-group inputs">
       <input
-        type="button" role="button" i18n-value value="Cancel" class="action-button action-button-cancel"
+        type="button" role="button" i18n-value value="Cancel" class="peertube-button grey-button"
         (click)="hide()" (key.enter)="hide()"
       >
-      <input type="submit" i18n-value value="Submit" class="action-button-submit" [disabled]="!form.valid">
+
+      <input type="submit" i18n-value value="Submit" class="peertube-button orange-button" [disabled]="!form.valid">
     </div>
 
     </form>
diff --git a/client/src/app/shared/shared-moderation/report-modals/report.component.scss b/client/src/app/shared/shared-moderation/report-modals/report.component.scss
index b2606cbd8..0567330f5 100644
--- a/client/src/app/shared/shared-moderation/report-modals/report.component.scss
+++ b/client/src/app/shared/shared-moderation/report-modals/report.component.scss
@@ -21,7 +21,7 @@ textarea {
 }
 
 .screenratio {
-  @include large-screen-ratio($selector: 'div, ::ng-deep iframe') {
+  @include block-ratio($selector: 'div, ::ng-deep iframe') {
     left: 0;
   };
 }
diff --git a/client/src/app/shared/shared-moderation/report-modals/video-report.component.html b/client/src/app/shared/shared-moderation/report-modals/video-report.component.html
index 4947088d1..1aae64bff 100644
--- a/client/src/app/shared/shared-moderation/report-modals/video-report.component.html
+++ b/client/src/app/shared/shared-moderation/report-modals/video-report.component.html
@@ -89,10 +89,11 @@
 
     <div class="form-group inputs">
       <input
-        type="button" role="button" i18n-value value="Cancel" class="action-button action-button-cancel"
+        type="button" role="button" i18n-value value="Cancel" class="peertube-button grey-button"
         (click)="hide()" (key.enter)="hide()"
       >
-      <input type="submit" i18n-value value="Submit" class="action-button-submit" [disabled]="!form.valid">
+
+      <input type="submit" i18n-value value="Submit" class="peertube-button orange-button" [disabled]="!form.valid">
     </div>
 
     </form>
diff --git a/client/src/app/shared/shared-moderation/report-modals/video-report.component.ts b/client/src/app/shared/shared-moderation/report-modals/video-report.component.ts
index 5b06c0bc7..4ca6f52ad 100644
--- a/client/src/app/shared/shared-moderation/report-modals/video-report.component.ts
+++ b/client/src/app/shared/shared-moderation/report-modals/video-report.component.ts
@@ -61,7 +61,8 @@ export class VideoReportComponent extends FormReactive implements OnInit {
           baseUrl: this.video.embedUrl,
           title: false,
           warningTitle: false
-        })
+        }),
+        this.video.name
       )
     )
   }
diff --git a/client/src/app/shared/shared-moderation/server-blocklist.component.html b/client/src/app/shared/shared-moderation/server-blocklist.component.html
index a6e974b36..537186f05 100644
--- a/client/src/app/shared/shared-moderation/server-blocklist.component.html
+++ b/client/src/app/shared/shared-moderation/server-blocklist.component.html
@@ -31,7 +31,7 @@
 
   <ng-template pTemplate="header">
     <tr>
-      <th style="width: 150px;">Action</th> <!-- column for action buttons -->
+      <th style="width: 150px;" i18n>Action</th> <!-- column for action buttons -->
       <th style="width: calc(100% - 300px);" i18n>Instance</th>
       <th style="width: 150px;" i18n pSortableColumn="createdAt">Muted at <p-sortIcon field="createdAt"></p-sortIcon></th>
     </tr>
diff --git a/client/src/app/shared/shared-moderation/shared-moderation.module.ts b/client/src/app/shared/shared-moderation/shared-moderation.module.ts
index b1b98f8d0..c7e201792 100644
--- a/client/src/app/shared/shared-moderation/shared-moderation.module.ts
+++ b/client/src/app/shared/shared-moderation/shared-moderation.module.ts
@@ -13,13 +13,15 @@ import { UserBanModalComponent } from './user-ban-modal.component'
 import { UserModerationDropdownComponent } from './user-moderation-dropdown.component'
 import { VideoBlockComponent } from './video-block.component'
 import { VideoBlockService } from './video-block.service'
+import { SharedAccountAvatarModule } from '../shared-account-avatar/shared-account-avatar.module'
 
 @NgModule({
   imports: [
     SharedMainModule,
     SharedFormModule,
     SharedGlobalIconModule,
-    SharedVideoCommentModule
+    SharedVideoCommentModule,
+    SharedAccountAvatarModule
   ],
 
   declarations: [
diff --git a/client/src/app/shared/shared-moderation/user-ban-modal.component.html b/client/src/app/shared/shared-moderation/user-ban-modal.component.html
index 365eb1938..7129b00ca 100644
--- a/client/src/app/shared/shared-moderation/user-ban-modal.component.html
+++ b/client/src/app/shared/shared-moderation/user-ban-modal.component.html
@@ -23,14 +23,11 @@
 
       <div class="form-group inputs">
         <input
-          type="button" role="button" i18n-value value="Cancel" class="action-button action-button-cancel"
+          type="button" role="button" i18n-value value="Cancel" class="peertube-button grey-button"
           (click)="hide()" (key.enter)="hide()"
         >
 
-        <input
-          type="submit" i18n-value value="Ban this user" class="action-button-submit"
-          [disabled]="!form.valid"
-        >
+        <input type="submit" i18n-value value="Ban this user" class="peertube-button orange-button" [disabled]="!form.valid" />
       </div>
     </form>
   </div>
diff --git a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.html b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.html
index 4d562387a..f1680e385 100644
--- a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.html
+++ b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.html
@@ -4,6 +4,6 @@
   <my-action-dropdown
     [actions]="userActions" [entry]="{ user: user, account: account }"
     [buttonSize]="buttonSize" [placement]="placement" [label]="label"
-    [container]="container"
+    [container]="container" [buttonStyled]="buttonStyled"
   ></my-action-dropdown>
 </ng-container>
diff --git a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
index f59910d1c..f510a82f9 100644
--- a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
+++ b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
@@ -18,6 +18,7 @@ export class UserModerationDropdownComponent implements OnInit, OnChanges {
   @Input() prependActions: DropdownAction<{ user: User, account: Account }>[]
 
   @Input() buttonSize: 'normal' | 'small' = 'normal'
+  @Input() buttonStyled = true
   @Input() placement = 'right-top right-bottom auto'
   @Input() label: string
   @Input() container: 'body' | undefined = undefined
diff --git a/client/src/app/shared/shared-moderation/video-block.component.html b/client/src/app/shared/shared-moderation/video-block.component.html
index e982c4d77..5e9e8493c 100644
--- a/client/src/app/shared/shared-moderation/video-block.component.html
+++ b/client/src/app/shared/shared-moderation/video-block.component.html
@@ -35,14 +35,11 @@
 
       <div class="form-group inputs">
         <input
-          type="button" role="button" i18n-value value="Cancel" class="action-button action-button-cancel"
+          type="button" role="button" i18n-value value="Cancel" class="peertube-button grey-button"
           (click)="hide()" (key.enter)="hide()"
         >
 
-        <input
-          type="submit" i18n-value value="Submit" class="action-button-submit"
-          [disabled]="!form.valid"
-        >
+        <input type="submit" i18n-value value="Submit" class="peertube-button orange-button" [disabled]="!form.valid" />
       </div>
     </form>