Fix UI overflows

client/src/app/+accounts/account-video-channels/account-video-channels.component.scss

@@ -36,6 +36,8 @@
   }
 
   a {
+    @include peertube-word-wrap;
+
     color: pvar(--mainForegroundColor);
   }
 

client/src/app/+videos/+video-watch/video-watch.component.scss

@@ -146,6 +146,8 @@ $video-info-margin-left: 44px;
       }
 
       .video-info-name {
+        @include peertube-word-wrap;
+
         margin-right: 30px;
         min-height: 40px; // Align with the action buttons
         font-size: 27px;
@@ -173,6 +175,7 @@ $video-info-margin-left: 44px;
 
         a {
           @include disable-default-a-behaviour;
+          @include peertube-word-wrap;
 
           color: pvar(--mainForegroundColor);
 

client/src/app/shared/shared-user-subscription/subscribe-button.component.html

@@ -40,7 +40,7 @@
   </ng-container>
 
   <div
-    class="btn-group" ngbDropdown autoClose="outside" placement="bottom-right"
+    class="btn-group" ngbDropdown autoClose="outside" placement="bottom-right bottom-left"
     role="group" aria-label="Multiple ways to subscribe to the current channel" i18n-aria-label
   >
     <button class="btn btn-sm dropdown-toggle-split" ngbDropdownToggle aria-label="Open subscription dropdown" i18n-aria-label>

client/src/sass/include/_actor.scss

@@ -44,6 +44,8 @@
   }
 
   .actor-display-name {
+    @include peertube-word-wrap;
+
     display: flex;
     flex-wrap: wrap;
   }