aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/+video-channels
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/+video-channels')
-rw-r--r--client/src/app/+video-channels/video-channels.component.html14
-rw-r--r--client/src/app/+video-channels/video-channels.component.scss9
-rw-r--r--client/src/app/+video-channels/video-channels.component.ts8
3 files changed, 25 insertions, 6 deletions
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 @@
17 <ng-template #ownerTemplate> 17 <ng-template #ownerTemplate>
18 <div class="owner-block"> 18 <div class="owner-block">
19 <div class="avatar-row"> 19 <div class="avatar-row">
20 <img class="account-avatar" [src]="videoChannel.ownerAvatarUrl" alt="Owner account avatar" /> 20 <a [routerLink]="getAccountUrl()" title="View account" i18n-title>
21 <img class="account-avatar" [src]="videoChannel.ownerAvatarUrl" alt="Owner account avatar" />
22 </a>
21 23
22 <div class="actor-info"> 24 <div class="actor-info">
23 <h4>{{ videoChannel.ownerAccount.displayName }}</h4> 25 <h4>
26 <a [routerLink]="getAccountUrl()" title="View account" i18n-title>{{ videoChannel.ownerAccount.displayName }}</a>
27 </h4>
24 28
25 <div class="actor-handle">@{{ videoChannel.ownerBy }}</div> 29 <div class="actor-handle">@{{ videoChannel.ownerBy }}</div>
26 </div> 30 </div>
@@ -30,11 +34,11 @@
30 <div class="description-html" [innerHTML]="ownerDescriptionHTML"></div> 34 <div class="description-html" [innerHTML]="ownerDescriptionHTML"></div>
31 </div> 35 </div>
32 36
33 <a class="view-account short" [routerLink]="[ '/accounts', videoChannel.ownerBy ]" i18n> 37 <a class="view-account short" [routerLink]="getAccountUrl()" i18n>
34 View account 38 View account
35 </a> 39 </a>
36 40
37 <a class="view-account complete" [routerLink]="[ '/accounts', videoChannel.ownerBy ]" i18n> 41 <a class="view-account complete" [routerLink]="getAccountUrl()" i18n>
38 View owner account 42 View owner account
39 </a> 43 </a>
40 </div> 44 </div>
@@ -83,7 +87,7 @@
83 <div class="created-at" i18n>Channel created on {{ videoChannel.createdAt | date }}</div> 87 <div class="created-at" i18n>Channel created on {{ videoChannel.createdAt | date }}</div>
84 </div> 88 </div>
85 89
86 <div *ngIf="!channelDescriptionExpanded" class="show-more" role="button" 90 <div *ngIf="hasShowMoreDescription()" class="show-more" role="button"
87 (click)="channelDescriptionExpanded = !channelDescriptionExpanded" 91 (click)="channelDescriptionExpanded = !channelDescriptionExpanded"
88 title="Show the complete description" i18n-title i18n 92 title="Show the complete description" i18n-title i18n
89 > 93 >
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 @@
42 42
43.channel-description { 43.channel-description {
44 grid-column: 1; 44 grid-column: 1;
45 word-break: break-word;
45} 46}
46 47
47.show-more { 48.show-more {
@@ -108,6 +109,10 @@
108 h4 { 109 h4 {
109 font-size: 18px; 110 font-size: 18px;
110 margin: 0; 111 margin: 0;
112
113 a {
114 color: pvar(--mainForegroundColor);
115 }
111 } 116 }
112 117
113 .actor-handle { 118 .actor-handle {
@@ -118,6 +123,7 @@
118 123
119 .owner-description { 124 .owner-description {
120 height: 140px; 125 height: 140px;
126 word-break: break-word;
121 127
122 @include fade-text(120px, pvar(--mainBackgroundColor)); 128 @include fade-text(120px, pvar(--mainBackgroundColor));
123 } 129 }
@@ -217,7 +223,8 @@
217 } 223 }
218 224
219 .view-account.complete { 225 .view-account.complete {
220 display: inline-block; 226 display: block;
227 text-align: right;
221 margin-top: 10px; 228 margin-top: 10px;
222 color: pvar(--mainColor); 229 color: pvar(--mainColor);
223 } 230 }
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 {
103 this.notifier.success($localize`Username copied`) 103 this.notifier.success($localize`Username copied`)
104 } 104 }
105 105
106 hasShowMoreDescription () {
107 return !this.channelDescriptionExpanded && this.channelDescriptionHTML.length > 100
108 }
109
106 showSupportModal () { 110 showSupportModal () {
107 this.supportModal.show() 111 this.supportModal.show()
108 } 112 }
109 113
114 getAccountUrl () {
115 return [ '/accounts', this.videoChannel.ownerBy ]
116 }
117
110 private loadChannelVideosCount () { 118 private loadChannelVideosCount () {
111 this.videoService.getVideoChannelVideos({ 119 this.videoService.getVideoChannelVideos({
112 videoChannel: this.videoChannel, 120 videoChannel: this.videoChannel,