Avoid multiple <br /> tags

client/src/app/+admin/config/edit-custom-config/edit-advanced-configuration.component.html

@@ -88,7 +88,8 @@
             <my-help>
               <ng-template ptTemplate="customHtml">
                 <ng-container i18n>
-                  Write JavaScript code directly.<br />Example: <pre>console.log('my instance is amazing');</pre>
+                  <p class="mb-2">Write JavaScript code directly. Example:</p>
+                  <pre>console.log('my instance is amazing');</pre>
                 </ng-container>
               </ng-template>
             </my-help>
@@ -107,13 +108,13 @@
             <my-help>
               <ng-template ptTemplate="customHtml">
                 <ng-container i18n>
-                  Write CSS code directly. Example:<br /><br />
+                  <p class="mb-2">Write CSS code directly. Example:</p>
 <pre>
 #custom-css {{ '{' }}
   color: red;
 {{ '}' }}
 </pre>
-                  Prepend with <em>#custom-css</em> to override styles. Example:<br /><br />
+                  <p class="mb-2">Prepend with <em>#custom-css</em> to override styles. Example:</p>
 <pre>
 #custom-css .logged-in-email {{ '{' }}
   color: red;

client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html

@@ -606,16 +606,21 @@
           <div class="form-group">
             <my-peertube-checkbox inputName="servicesTwitterWhitelisted" formControlName="whitelisted">
               <ng-template ptTemplate="label">
-                <ng-container i18n>Instance allowed by Twitter</ng-container>
+                <ng-container i18n>Instance allowed by Twitter/X</ng-container>
               </ng-template>
 
               <ng-template ptTemplate="help">
                 <ng-container i18n>
-                  If your instance is explicitly allowed by Twitter, a video player will be embedded in the Twitter feed on PeerTube video share.<br />
-                  If the instance is not, we use an image link card that will redirect to your PeerTube instance.<br /><br />
+                  <p class="mb-2">
+                    If your instance is explicitly allowed by Twitter/X, a video player will be embedded in the Twitter feed on PeerTube video share.<br />
+                    If the instance is not, we use an image link card that will redirect to your PeerTube instance.
+                  </p>
+
+                  <p>
                     Check this checkbox, save the configuration and test with a video URL of your instance (https://example.com/w/blabla) on
                     <a class="link-orange" target='_blank' rel='noopener noreferrer' href='https://cards-dev.twitter.com/validator'>https://cards-dev.twitter.com/validator</a>
                     to see if you instance is allowed.
+                  </p>
                 </ng-container>
               </ng-template>
             </my-peertube-checkbox>

client/src/app/+admin/config/edit-custom-config/edit-instance-information.component.html

@@ -91,7 +91,7 @@
 
             <ng-template ptTemplate="help">
               <ng-container i18n>
-                Enabling it will allow other administrators to know that you are mainly federating sensitive content.<br /><br />
+                Enabling it will allow other administrators to know that you are mainly federating sensitive content.<br />
                 Moreover, the NSFW checkbox on video upload will be automatically checked by default.
               </ng-container>
             </ng-template>

client/src/app/+manage/video-channel-edit/video-channel-edit.component.html

@@ -61,7 +61,7 @@
         <div class="form-group">
           <label i18n for="support">Support</label>
           <my-help
-            helpType="markdownEnhanced" i18n-preHtml preHtml="Short text to tell people how they can support the channel (membership platform...).<br /><br />
+            helpType="markdownEnhanced" i18n-preHtml preHtml="Short text to tell people how they can support the channel (membership platform...).<br />
       When a video is uploaded in this channel, the video support field will be automatically filled by this text."
           ></my-help>
 

client/src/app/shared/shared-main/misc/help.component.html

@@ -3,9 +3,7 @@
     <ng-template *ngTemplateOutlet="preHtmlTemplate"></ng-template>
   </p>
 
-  <ng-container *ngIf="preHtmlTemplate && (customHtmlTemplate || mainHtml || postHtmlTemplate)">
-    <br /><br />
-  </ng-container>
+  <div *ngIf="preHtmlTemplate && (customHtmlTemplate || mainHtml || postHtmlTemplate)" class="mb-2"></div>
 
   <p *ngIf="customHtmlTemplate">
     <ng-template *ngTemplateOutlet="customHtmlTemplate"></ng-template>
@@ -13,9 +11,7 @@
 
   <p *ngIf="mainHtml" [innerHTML]="mainHtml"></p>
 
-  <ng-container *ngIf="(customHtmlTemplate || mainHtml) && postHtmlTemplate">
-    <br /><br />
-  </ng-container>
+  <div *ngIf="(customHtmlTemplate || mainHtml) && postHtmlTemplate" class="mb-2"></div>
 
   <p *ngIf="postHtmlTemplate">
     <ng-template *ngTemplateOutlet="postHtmlTemplate"></ng-template>