Fix custom markup

[github/Chocobozzz/PeerTube.git] / client / src / app / shared / shared-custom-markup / peertube-custom-tags / channel-miniature-markup.component.html

diff --git a/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.html b/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.html
index da81006b9e80ca9253495f87cdd4d0c0fb269243..395cc85620bcf339deda447269736d951fb3455c 100644 (file)
--- a/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.html
+++ b/client/src/app/shared/shared-custom-markup/peertube-custom-tags/channel-miniature-markup.component.html
@@ -1,8 +1,28 @@
 <div *ngIf="channel" class="channel">
-  <my-actor-avatar [channel]="channel" size="34"></my-actor-avatar>
 
-  <div class="display-name">{{ channel.displayName }}</div>
-  <div class="username">{{ channel.name }}</div>
+  <div class="channel-avatar-row">
+    <my-actor-avatar [actor]="channel" actorType="channel" [internalHref]="getVideoChannelLink()" i18n-title title="See this video channel" size="75"></my-actor-avatar>
 
-  <div class="description">{{ channel.description }}</div>
+    <h6>
+      <a [routerLink]="getVideoChannelLink()" i18n-title title="See this video channel">
+        {{ channel.displayName }}
+      </a>
+    </h6>
+
+    <div class="actor-counters">
+      <div class="followers" i18n>{channel.followersCount, plural, =1 {1 subscriber} other {{{ channel.followersCount }} subscribers}}</div>
+
+      <span class="videos-count" *ngIf="totalVideos !== undefined" i18n>
+        {totalVideos, plural, =1 {1 videos} other {{{ totalVideos }} videos}}
+      </span>
+    </div>
+
+    <div *ngIf="displayDescription" class="description-html" [innerHTML]="descriptionHTML"></div>
+  </div>
+
+  <div class="video" *ngIf="video && displayLatestVideo">
+    <div i18n class="video-label">Latest published video</div>
+
+    <my-video-miniature-markup [video]="video" [onlyDisplayTitle]="true"></my-video-miniature-markup>
+  </div>
 </div>