diff --git a/client/src/app/+search/search.component.html b/client/src/app/+search/search.component.html
index 44a862273..a6a28b35e 100644
--- a/client/src/app/+search/search.component.html
+++ b/client/src/app/+search/search.component.html
@@ -37,7 +37,7 @@
diff --git a/client/src/app/+search/search.component.scss b/client/src/app/+search/search.component.scss
index 65f1a1668..5b733ea9e 100644
--- a/client/src/app/+search/search.component.scss
+++ b/client/src/app/+search/search.component.scss
@@ -3,10 +3,13 @@
@use '_mixins' as *;
@mixin build-channel-img-size ($video-img-width) {
- $image-size: min(130px, $video-img-width);
+ $image-size: min(120px, $video-img-width);
$margin-size: math.div(($video-img-width - $image-size), 2); // So we have the same width as the video miniature
- @include actor-avatar-size($image-size);
+ width: $image-size;
+ height: $image-size;
+ min-height: $image-size;
+ min-width: $image-size;
margin: 0 calc($margin-size + 1rem) 0 $margin-size;
}
@@ -59,7 +62,7 @@
.video-channel {
my-actor-avatar {
- @include margin-right(1rem);
+ @include build-channel-img-size($video-thumbnail-width);
}
}
@@ -88,7 +91,7 @@
color: pvar(--greyForegroundColor);
}
-// Use the same breakpoints than in video-miniature
+// Use the same breakpoints as in video-miniature
@include on-small-main-col {
.video-channel {
display: grid;
diff --git a/client/src/app/shared/shared-actor-image/actor-avatar.component.ts b/client/src/app/shared/shared-actor-image/actor-avatar.component.ts
index 4fd196ad6..448414d27 100644
--- a/client/src/app/shared/shared-actor-image/actor-avatar.component.ts
+++ b/client/src/app/shared/shared-actor-image/actor-avatar.component.ts
@@ -1,4 +1,4 @@
-import { Component, ElementRef, Input, OnChanges, OnInit, ViewChild, numberAttribute } from '@angular/core'
+import { Component, ElementRef, Input, OnChanges, OnInit, ViewChild, booleanAttribute, numberAttribute } from '@angular/core'
import { VideoChannel } from '../shared-main'
import { Account } from '../shared-main/account/account.model'
import { objectKeysTyped } from '@peertube/peertube-core-utils'
@@ -22,6 +22,7 @@ export class ActorAvatarComponent implements OnInit, OnChanges {
@Input() previewImage: string
@Input({ transform: numberAttribute }) size = 120
+ @Input({ transform: booleanAttribute }) responseSize = false
// Use an external link
@Input() href: string
@@ -68,7 +69,7 @@ export class ActorAvatarComponent implements OnInit, OnChanges {
this.classes = [ 'avatar' ]
- if (this.size) {
+ if (this.size && !this.responseSize) {
avatarSize = `${this.size}px`
if (this.size <= 18) {