diff --git a/client/src/app/+accounts/account-video-channels/account-video-channels.component.html b/client/src/app/+accounts/account-video-channels/account-video-channels.component.html
index 0b22e7526..19a4b3c9c 100644
--- a/client/src/app/+accounts/account-video-channels/account-video-channels.component.html
+++ b/client/src/app/+accounts/account-video-channels/account-video-channels.component.html
@@ -22,7 +22,7 @@
{videoChannel.followersCount, plural, =1 {1 subscriber} other {{{ videoChannel.followersCount }} subscribers}}
diff --git a/client/src/app/+accounts/accounts.component.scss b/client/src/app/+accounts/accounts.component.scss
index 6a51dd038..80f23ba6f 100644
--- a/client/src/app/+accounts/accounts.component.scss
+++ b/client/src/app/+accounts/accounts.component.scss
@@ -62,6 +62,8 @@ my-user-moderation-dropdown,
.description {
grid-column: 1 / 3;
+ max-width: 1000px;
+ word-break: break-word;
}
.created-at {
diff --git a/client/src/app/+accounts/accounts.component.ts b/client/src/app/+accounts/accounts.component.ts
index abee0b9bb..e80314130 100644
--- a/client/src/app/+accounts/accounts.component.ts
+++ b/client/src/app/+accounts/accounts.component.ts
@@ -147,6 +147,10 @@ export class AccountsComponent implements OnInit, OnDestroy {
return this.videoChannels.length !== 0
}
+ hasShowMoreDescription () {
+ return !this.accountDescriptionExpanded && this.accountDescriptionHTML.length > 100
+ }
+
private async onAccount (account: Account) {
this.accountFollowerTitle = $localize`${account.followersCount} direct account followers`
diff --git a/client/src/app/+my-library/my-videos/my-videos.component.html b/client/src/app/+my-library/my-videos/my-videos.component.html
index 5fa4c02ec..6e6bf12f4 100644
--- a/client/src/app/+my-library/my-videos/my-videos.component.html
+++ b/client/src/app/+my-library/my-videos/my-videos.component.html
@@ -34,7 +34,6 @@
[miniatureDisplayOptions]="miniatureDisplayOptions"
[titlePage]="titlePage"
[getVideosObservableFunction]="getVideosObservableFunction"
- [ownerDisplayType]="ownerDisplayType"
[user]="user"
#videosSelection
>
diff --git a/client/src/app/+my-library/my-videos/my-videos.component.ts b/client/src/app/+my-library/my-videos/my-videos.component.ts
index 6a2a62608..0bc923e73 100644
--- a/client/src/app/+my-library/my-videos/my-videos.component.ts
+++ b/client/src/app/+my-library/my-videos/my-videos.component.ts
@@ -2,12 +2,12 @@ import { concat, Observable, Subject } from 'rxjs'
import { debounceTime, tap, toArray } from 'rxjs/operators'
import { Component, OnInit, ViewChild } from '@angular/core'
import { ActivatedRoute, Router } from '@angular/router'
-import { AuthService, ComponentPagination, ConfirmService, Notifier, ScreenService, ServerService, User, UserService } from '@app/core'
+import { AuthService, ComponentPagination, ConfirmService, Notifier, ScreenService, ServerService, User } from '@app/core'
import { DisableForReuseHook } from '@app/core/routing/disable-for-reuse-hook'
import { immutableAssign } from '@app/helpers'
import { DropdownAction, Video, VideoService } from '@app/shared/shared-main'
import { LiveStreamInformationComponent } from '@app/shared/shared-video-live'
-import { MiniatureDisplayOptions, OwnerDisplayType, SelectionType, VideosSelectionComponent } from '@app/shared/shared-video-miniature'
+import { MiniatureDisplayOptions, SelectionType, VideosSelectionComponent } from '@app/shared/shared-video-miniature'
import { VideoSortField } from '@shared/models'
import { VideoChangeOwnershipComponent } from './modals/video-change-ownership.component'
@@ -36,7 +36,6 @@ export class MyVideosComponent implements OnInit, DisableForReuseHook {
state: true,
blacklistInfo: true
}
- ownerDisplayType: OwnerDisplayType = 'videoChannel'
videoActions: DropdownAction<{ video: Video }>[] = []
diff --git a/client/src/app/+video-channels/video-channels.component.html b/client/src/app/+video-channels/video-channels.component.html
index b9ac13f09..87e1b294b 100644
--- a/client/src/app/+video-channels/video-channels.component.html
+++ b/client/src/app/+video-channels/video-channels.component.html
@@ -17,10 +17,14 @@
@@ -83,7 +87,7 @@
Channel created on {{ videoChannel.createdAt | date }}
-
diff --git a/client/src/app/+video-channels/video-channels.component.scss b/client/src/app/+video-channels/video-channels.component.scss
index ec8f67a7e..3b27f3aa1 100644
--- a/client/src/app/+video-channels/video-channels.component.scss
+++ b/client/src/app/+video-channels/video-channels.component.scss
@@ -42,6 +42,7 @@
.channel-description {
grid-column: 1;
+ word-break: break-word;
}
.show-more {
@@ -108,6 +109,10 @@
h4 {
font-size: 18px;
margin: 0;
+
+ a {
+ color: pvar(--mainForegroundColor);
+ }
}
.actor-handle {
@@ -118,6 +123,7 @@
.owner-description {
height: 140px;
+ word-break: break-word;
@include fade-text(120px, pvar(--mainBackgroundColor));
}
@@ -217,7 +223,8 @@
}
.view-account.complete {
- display: inline-block;
+ display: block;
+ text-align: right;
margin-top: 10px;
color: pvar(--mainColor);
}
diff --git a/client/src/app/+video-channels/video-channels.component.ts b/client/src/app/+video-channels/video-channels.component.ts
index a8ca3d6ff..2739047ed 100644
--- a/client/src/app/+video-channels/video-channels.component.ts
+++ b/client/src/app/+video-channels/video-channels.component.ts
@@ -103,10 +103,18 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
this.notifier.success($localize`Username copied`)
}
+ hasShowMoreDescription () {
+ return !this.channelDescriptionExpanded && this.channelDescriptionHTML.length > 100
+ }
+
showSupportModal () {
this.supportModal.show()
}
+ getAccountUrl () {
+ return [ '/accounts', this.videoChannel.ownerBy ]
+ }
+
private loadChannelVideosCount () {
this.videoService.getVideoChannelVideos({
videoChannel: this.videoChannel,
diff --git a/client/src/app/+videos/video-list/video-user-subscriptions.component.ts b/client/src/app/+videos/video-list/video-user-subscriptions.component.ts
index e352a2b2c..6aabb93a5 100644
--- a/client/src/app/+videos/video-list/video-user-subscriptions.component.ts
+++ b/client/src/app/+videos/video-list/video-user-subscriptions.component.ts
@@ -7,7 +7,7 @@ import { HooksService } from '@app/core/plugins/hooks.service'
import { immutableAssign } from '@app/helpers'
import { VideoService } from '@app/shared/shared-main'
import { UserSubscriptionService } from '@app/shared/shared-user-subscription'
-import { AbstractVideoList, OwnerDisplayType } from '@app/shared/shared-video-miniature'
+import { AbstractVideoList } from '@app/shared/shared-video-miniature'
import { FeedFormat, VideoSortField } from '@shared/models'
import { environment } from '../../../environments/environment'
import { copyToClipboard } from '../../../root-helpers/utils'
@@ -20,7 +20,6 @@ import { copyToClipboard } from '../../../root-helpers/utils'
export class VideoUserSubscriptionsComponent extends AbstractVideoList implements OnInit, OnDestroy {
titlePage: string
sort = '-publishedAt' as VideoSortField
- ownerDisplayType: OwnerDisplayType = 'auto'
groupByDate = true
constructor (
diff --git a/client/src/app/shared/shared-main/account/video-avatar-channel.component.scss b/client/src/app/shared/shared-main/account/video-avatar-channel.component.scss
index ea7cb2cf7..4998e85fa 100644
--- a/client/src/app/shared/shared-main/account/video-avatar-channel.component.scss
+++ b/client/src/app/shared/shared-main/account/video-avatar-channel.component.scss
@@ -26,6 +26,7 @@
top:50%;
left:50%;
transform: translate(-50%,-50%);
+ border-radius: 5px;
&:not(.channel-avatar) {
border-radius: 50%;
diff --git a/client/src/app/shared/shared-main/misc/simple-search-input.component.scss b/client/src/app/shared/shared-main/misc/simple-search-input.component.scss
index 116ff7ea0..5ae48f81b 100644
--- a/client/src/app/shared/shared-main/misc/simple-search-input.component.scss
+++ b/client/src/app/shared/shared-main/misc/simple-search-input.component.scss
@@ -16,7 +16,7 @@ my-global-icon {
}
&[iconName=search] {
- color: pvar(--mainColor);
+ color: pvar(--mainForegroundColor);
}
&[iconName=cross] {
diff --git a/client/src/app/shared/shared-main/video-channel/video-channel.model.ts b/client/src/app/shared/shared-main/video-channel/video-channel.model.ts
index bd187a873..126e43cea 100644
--- a/client/src/app/shared/shared-main/video-channel/video-channel.model.ts
+++ b/client/src/app/shared/shared-main/video-channel/video-channel.model.ts
@@ -1,4 +1,5 @@
-import { VideoChannel as ServerVideoChannel, ViewsPerDate, Account, Avatar } from '@shared/models'
+import { Account as ServerAccount, Avatar, VideoChannel as ServerVideoChannel, ViewsPerDate } from '@shared/models'
+import { Account } from '../account/account.model'
import { Actor } from '../account/actor.model'
export class VideoChannel extends Actor implements ServerVideoChannel {
@@ -9,7 +10,7 @@ export class VideoChannel extends Actor implements ServerVideoChannel {
nameWithHost: string
nameWithHostForced: string
- ownerAccount?: Account
+ ownerAccount?: ServerAccount
ownerBy?: string
ownerAvatarUrl?: string
@@ -46,7 +47,7 @@ export class VideoChannel extends Actor implements ServerVideoChannel {
if (hash.ownerAccount) {
this.ownerAccount = hash.ownerAccount
this.ownerBy = Actor.CREATE_BY_STRING(hash.ownerAccount.name, hash.ownerAccount.host)
- this.ownerAvatarUrl = VideoChannel.GET_ACTOR_AVATAR_URL(this.ownerAccount)
+ this.ownerAvatarUrl = Account.GET_ACTOR_AVATAR_URL(this.ownerAccount)
}
}
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 07f79cd6d..41d5906cf 100644
--- a/client/src/app/shared/shared-video-miniature/abstract-video-list.html
+++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.html
@@ -52,8 +52,7 @@
diff --git a/client/src/app/shared/shared-video-miniature/abstract-video-list.ts b/client/src/app/shared/shared-video-miniature/abstract-video-list.ts
index f41648e1c..18615c37a 100644
--- a/client/src/app/shared/shared-video-miniature/abstract-video-list.ts
+++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.ts
@@ -28,8 +28,8 @@ import { isLastMonth, isLastWeek, isThisMonth, isToday, isYesterday } from '@sha
import { ServerConfig, UserRight, VideoFilter, VideoSortField } from '@shared/models'
import { NSFWPolicyType } from '@shared/models/videos/nsfw-policy.type'
import { Syndication, Video } from '../shared-main'
-import { MiniatureDisplayOptions, OwnerDisplayType } from './video-miniature.component'
import { GenericHeaderComponent, VideoListHeaderComponent } from './video-list-header.component'
+import { MiniatureDisplayOptions } from './video-miniature.component'
enum GroupDate {
UNKNOWN = 0,
@@ -65,7 +65,6 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy, AfterConte
loadOnInit = true
loadUserVideoPreferences = false
- ownerDisplayType: OwnerDisplayType = 'auto'
displayModerationBlock = false
titleTooltip: string
displayVideoActions = true
diff --git a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
index f08be9c25..987a65e40 100644
--- a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
+++ b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
@@ -16,7 +16,7 @@ import { Video } from '../shared-main'
import { VideoPlaylistService } from '../shared-video-playlist'
import { VideoActionsDisplayType } from './video-actions-dropdown.component'
-export type OwnerDisplayType = 'account' | 'videoChannel' | 'auto'
+export type OwnerDisplayType = 'account' | 'videoChannel'
export type MiniatureDisplayOptions = {
date?: boolean
views?: boolean
@@ -40,7 +40,6 @@ export class VideoMiniatureComponent implements OnInit {
@Input() user: User
@Input() video: Video
- @Input() ownerDisplayType: OwnerDisplayType = 'account'
@Input() displayOptions: MiniatureDisplayOptions = {
date: true,
views: true,
@@ -89,7 +88,7 @@ export class VideoMiniatureComponent implements OnInit {
videoHref: string
videoTarget: string
- private ownerDisplayTypeChosen: 'account' | 'videoChannel'
+ private ownerDisplayType: 'account' | 'videoChannel'
constructor (
private screenService: ScreenService,
@@ -140,11 +139,11 @@ export class VideoMiniatureComponent implements OnInit {
}
displayOwnerAccount () {
- return this.ownerDisplayTypeChosen === 'account'
+ return this.ownerDisplayType === 'account'
}
displayOwnerVideoChannel () {
- return this.ownerDisplayTypeChosen === 'videoChannel'
+ return this.ownerDisplayType === 'videoChannel'
}
isUnlistedVideo () {
@@ -245,21 +244,19 @@ export class VideoMiniatureComponent implements OnInit {
}
private setUpBy () {
- if (this.ownerDisplayType === 'account' || this.ownerDisplayType === 'videoChannel') {
- this.ownerDisplayTypeChosen = this.ownerDisplayType
- return
- }
+ const accountName = this.video.account.name
// If the video channel name is an UUID (not really displayable, we changed this behaviour in v1.0.0-beta.12)
- // Or is just a suffix of the account (default created channel)
+ // Or has not been customized (default created channel display name)
// -> Use the account name
if (
- this.video.channel.name === `${this.video.account.name}_channel` ||
+ this.video.channel.displayName === `Default ${accountName} channel` ||
+ this.video.channel.displayName === `Main ${accountName} channel` ||
this.video.channel.name.match(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/)
) {
- this.ownerDisplayTypeChosen = 'account'
+ this.ownerDisplayType = 'account'
} else {
- this.ownerDisplayTypeChosen = 'videoChannel'
+ this.ownerDisplayType = 'videoChannel'
}
}
diff --git a/client/src/app/shared/shared-video-miniature/videos-selection.component.html b/client/src/app/shared/shared-video-miniature/videos-selection.component.html
index 8caeaf092..dec9e99f3 100644
--- a/client/src/app/shared/shared-video-miniature/videos-selection.component.html
+++ b/client/src/app/shared/shared-video-miniature/videos-selection.component.html
@@ -9,8 +9,7 @@
diff --git a/client/src/app/shared/shared-video-miniature/videos-selection.component.ts b/client/src/app/shared/shared-video-miniature/videos-selection.component.ts
index ca1cf2264..f8c3800d7 100644
--- a/client/src/app/shared/shared-video-miniature/videos-selection.component.ts
+++ b/client/src/app/shared/shared-video-miniature/videos-selection.component.ts
@@ -17,7 +17,7 @@ import { AuthService, ComponentPagination, LocalStorageService, Notifier, Screen
import { ResultList, VideoSortField } from '@shared/models'
import { PeerTubeTemplateDirective, Video } from '../shared-main'
import { AbstractVideoList } from './abstract-video-list'
-import { MiniatureDisplayOptions, OwnerDisplayType } from './video-miniature.component'
+import { MiniatureDisplayOptions } from './video-miniature.component'
export type SelectionType = { [ id: number ]: boolean }
@@ -31,7 +31,6 @@ export class VideosSelectionComponent extends AbstractVideoList implements OnIni
@Input() pagination: ComponentPagination
@Input() titlePage: string
@Input() miniatureDisplayOptions: MiniatureDisplayOptions
- @Input() ownerDisplayType: OwnerDisplayType
@Input() getVideosObservableFunction: (page: number, sort?: VideoSortField) => Observable>
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss
index 7b862a156..affffc4cc 100644
--- a/client/src/sass/include/_mixins.scss
+++ b/client/src/sass/include/_mixins.scss
@@ -152,7 +152,7 @@
@include button-focus(pvar(--mainColorLightest));
border: 2px solid pvar(--mainColor);
- font-weight: $font-regular;
+ font-weight: $font-semibold;
&, &:active, &:focus {
color: pvar(--mainColor);
@@ -551,6 +551,7 @@
height: $size;
min-width: $size;
min-height: $size;
+ border-radius: 5px;
}
@mixin chevron ($size, $border-width) {