Implement remote interaction

[github/Chocobozzz/PeerTube.git] / client / src / app / +videos / +video-watch / comment / video-comment-add.component.html

diff --git a/client/src/app/+videos/+video-watch/comment/video-comment-add.component.html b/client/src/app/+videos/+video-watch/comment/video-comment-add.component.html
index 6b3d39730572c837b8b2f66580a13b3fb6fe0f60..fdefed09a57fad931a588543e4f61d7b3de1613b 100644 (file)
--- a/client/src/app/+videos/+video-watch/comment/video-comment-add.component.html
+++ b/client/src/app/+videos/+video-watch/comment/video-comment-add.component.html
@@ -10,7 +10,7 @@
                 (keyup.control.enter)="onValidKey()" (keyup.meta.enter)="onValidKey()" #textarea>
 
       </textarea>
-      <my-help class="markdown-guide" helpType="custom" iconName="markdown" tooltipPlacement="left auto" i18n-title title="Markdown compatible">
+      <my-help class="markdown-guide" helpType="custom" iconName="markdown" tooltipPlacement="left auto" autoClose="true" i18n-title title="Markdown compatible">
         <ng-template ptTemplate="customHtml">
           <span i18n>Markdown compatible that supports:</span>
 
@@ -57,13 +57,9 @@
   </div>
   <div class="modal-body">
     <span i18n>
-      You can comment using an account on any ActivityPub-compatible instance.
-      On most platforms, you can find the video by typing its URL in the search bar and then comment it
-      from within the software's interface.
-    </span>
-    <span i18n>
-      If you have an account on Mastodon or Pleroma, you can open it directly in their interface:
+      You can comment using an account on any ActivityPub-compatible instance (PeerTube/Mastodon/Pleroma account for example).
     </span>
+
     <my-remote-subscribe [interact]="true" [uri]="getUri()"></my-remote-subscribe>
   </div>
   <div class="modal-footer inputs">
@@ -85,15 +81,10 @@
     <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hideModals()"></my-global-icon>
   </div>
   <div class="modal-body">
-    <table class="table-emoji" *ngFor="let emojiMarkup of emojiMarkupList | keyvalue">
-      <tr>
-        <td>
-          <span>{{ emojiMarkup.value }}</span>
-        </td>
-        <td>
-          <code>:{{ emojiMarkup.key }}:</code>
-        </td>
-      </tr>
-    </table>
+    <div class="emoji-flex">
+      <div class="emoji-flex-item" *ngFor="let emojiMarkup of emojiMarkupList">
+        {{ emojiMarkup[0] }} <code>:{{ emojiMarkup[1] }}:</code>
+      </div>
+    </div>
   </div>
 </ng-template>