diff --git a/client/src/app/+video-channels/video-channels.component.html b/client/src/app/+video-channels/video-channels.component.html index 87e1b294b..1312a1b3c 100644 --- a/client/src/app/+video-channels/video-channels.component.html +++ b/client/src/app/+video-channels/video-channels.component.html @@ -1,4 +1,8 @@
+ +
diff --git a/client/src/app/+video-channels/video-channels.component.scss b/client/src/app/+video-channels/video-channels.component.scss index 12f5b9f3e..b19b4c81b 100644 --- a/client/src/app/+video-channels/video-channels.component.scss +++ b/client/src/app/+video-channels/video-channels.component.scss @@ -11,6 +11,10 @@ --myGreyOwnerFontSize: 14px; } +.banner { + @include block-ratio('img', $banner-inverted-ratio); +} + .section-label { @include section-label-responsive; } diff --git a/client/src/app/menu/notification.component.scss b/client/src/app/menu/notification.component.scss index d85cc8e66..c65787779 100644 --- a/client/src/app/menu/notification.component.scss +++ b/client/src/app/menu/notification.component.scss @@ -2,7 +2,7 @@ @import '_mixins'; .content { - scrollbar-color: unset; + scrollbar-color: auto; } .notification-inbox-popover { diff --git a/client/src/app/shared/shared-actor-image/actor-banner-edit.component.ts b/client/src/app/shared/shared-actor-image/actor-banner-edit.component.ts index b92ecef4b..48451744c 100644 --- a/client/src/app/shared/shared-actor-image/actor-banner-edit.component.ts +++ b/client/src/app/shared/shared-actor-image/actor-banner-edit.component.ts @@ -36,7 +36,8 @@ export class ActorBannerEditComponent implements OnInit { this.maxBannerSize = config.banner.file.size.max this.bannerExtensions = config.banner.file.extensions.join(', ') - this.bannerFormat = $localize`maxsize: ${getBytes(this.maxBannerSize)}, extensions: ${this.bannerExtensions}` + // tslint:disable:max-line-length + this.bannerFormat = $localize`ratio 6/1, recommended size: 1600x266, max size: ${getBytes(this.maxBannerSize)}, extensions: ${this.bannerExtensions}` }) } diff --git a/client/src/sass/include/_variables.scss b/client/src/sass/include/_variables.scss index 3501b305f..d2a5d2bd9 100644 --- a/client/src/sass/include/_variables.scss +++ b/client/src/sass/include/_variables.scss @@ -53,7 +53,7 @@ $sub-menu-height: 81px; $channel-background-color: #f6ede8; -$banner-inverted-ratio: 1/5; +$banner-inverted-ratio: 1/6; $max-channels-width: 1200px; diff --git a/server/initializers/constants.ts b/server/initializers/constants.ts index 1deabec87..2637213a4 100644 --- a/server/initializers/constants.ts +++ b/server/initializers/constants.ts @@ -614,7 +614,7 @@ const ACTOR_IMAGES_SIZE = { }, BANNERS: { width: 1920, - height: 384 + height: 317 // 6/1 ratio } }