Don't let the title attribute carry into child elements

web/app/admin/bridges/bridges.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Bridges">
+    <my-ibox boxTitle="Bridges">
         <div class="my-ibox-content">
             <p>
                 Bridges provide a way for rooms to interact with and/or bring in events from a third party network. For

web/app/admin/bridges/gitter/gitter.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Gitter Bridge Configurations">
+    <my-ibox boxTitle="Gitter Bridge Configurations">
         <div class="my-ibox-content">
             <p>
                 <a href="https://github.com/matrix-org/matrix-appservice-gitter" target="_blank">matrix-appservice-gitter</a>

web/app/admin/bridges/irc/irc.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="IRC Bridge Configurations">
+    <my-ibox boxTitle="IRC Bridge Configurations">
         <div class="my-ibox-content">
             <p>
                 <a href="https://github.com/matrix-org/matrix-appservice-irc" target="_blank">matrix-appservice-irc</a>

web/app/admin/bridges/slack/slack.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Slack Bridge Configurations">
+    <my-ibox boxTitle="Slack Bridge Configurations">
         <div class="my-ibox-content">
             <p>
                 <a href="https://github.com/matrix-org/matrix-appservice-slack" target="_blank">matrix-appservice-slack</a>

web/app/admin/bridges/telegram/telegram.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Telegram Bridge Configurations">
+    <my-ibox boxTitle="Telegram Bridge Configurations">
         <div class="my-ibox-content">
             <p>
                 <a href="https://github.com/tulir/mautrix-telegram" target="_blank">mautrix-telegram</a>

web/app/admin/bridges/webhooks/webhooks.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Webhooks Bridge Configuration">
+    <my-ibox boxTitle="Webhooks Bridge Configuration">
         <div class="my-ibox-content">
             <p>
                 <a href="https://github.com/turt2live/matrix-appservice-webhooks" target="_blank">matrix-appservice-webhooks</a>

web/app/admin/custom-bots/custom-bots.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Custom bots">
+    <my-ibox boxTitle="Custom bots">
         <div class="my-ibox-content">
             <p>
                 Custom bots give you the ability to add your own bots to Dimension for users to add

web/app/admin/home/home.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Configuration">
+    <my-ibox boxTitle="Configuration">
         <div class="my-ibox-content">
             <p>Parts of your configuration are displayed below. To change these values, edit your configuration and restart Dimension.</p>
 

web/app/admin/neb/add-selfhosted/add-selfhosted.component.html

@@ -1,4 +1,4 @@
-<my-ibox title="New self-hosted go-neb">
+<my-ibox boxTitle="New self-hosted go-neb">
     <div class="my-ibox-content">
         <p>Self-hosted go-neb instances are powered by application services installed on your homeserver. The application service is responsible for creating the bots dynamically.</p>
 

web/app/admin/neb/edit/edit.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="go-neb configuration">
+    <my-ibox boxTitle="go-neb configuration">
         <div class="my-ibox-content">
             <p>go-neb supports many different types of bots, each of which is listed below. Here you can configure which
                 bots this go-neb instance should use.</p>

web/app/admin/neb/neb.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="go-neb configurations">
+    <my-ibox boxTitle="go-neb configurations">
         <div class="my-ibox-content">
             <p><a href="https://github.com/matrix-org/go-neb" target="_blank">go-neb</a> is a multi-purpose bot that can
                 provide various services, such as reaction GIFs and Github notifications. There are two options for

web/app/admin/sticker-packs/sticker-packs.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Sticker Packs">
+    <my-ibox boxTitle="Sticker Packs">
         <div class="my-ibox-content">
             <p>
                 Sticker packs provide a way to convey memes or feelings to others in a room. From here you're able

web/app/admin/widgets/widgets.component.html

@@ -2,7 +2,7 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Widgets">
+    <my-ibox boxTitle="Widgets">
         <div class="my-ibox-content">
             <p>Widgets are small webpages that can be embedded in a Matrix room. Here you can configure which widgets
                 Dimension will offer to users.</p>

web/app/configs/stickerpicker/stickerpicker.component.html

@@ -2,12 +2,12 @@
     <my-spinner></my-spinner>
 </div>
 <div *ngIf="!isLoading">
-    <my-ibox title="Sticker Packs" *ngIf="packs.length <= 0">
+    <my-ibox boxTitle="Sticker Packs" *ngIf="packs.length <= 0">
         <div class="my-ibox-content">
             <h5 style="text-align: center;">Sticker packs are not enabled on this Dimension instance.</h5>
         </div>
     </my-ibox>
-    <my-ibox title="Add Sticker Packs" *ngIf="packs.length > 0 && customEnabled">
+    <my-ibox boxTitle="Add Sticker Packs" *ngIf="packs.length > 0 && customEnabled">
         <div class="my-ibox-content">
             <form (submit)="importPack()" novalidate name="importForm">
                 <label class="label-block">
@@ -25,7 +25,7 @@
             </form>
         </div>
     </my-ibox>
-    <my-ibox title="Sticker Packs" *ngIf="packs.length > 0">
+    <my-ibox boxTitle="Sticker Packs" *ngIf="packs.length > 0">
         <div class="my-ibox-content">
             <div class="pack" *ngFor="let pack of packs trackById">
                 <img [src]="getThumbnailUrl(pack.avatarUrl, 120, 120)" width="120" height="120"/>

web/app/elements/ibox/ibox.component.html

@@ -1,10 +1,10 @@
 <div class="ibox">
     <div class="ibox-title" (click)="isCollapsible ? (collapsed = !collapsed) : false"
          [ngClass]="[isCollapsible ? 'ibox-title-collapsible' : '']">
-        <h5 *ngIf="title">
+        <h5 *ngIf="boxTitle">
-            {{ title }}
+            {{ boxTitle }}
         </h5>
-        <ng-content select=".my-ibox-title" *ngIf="!title"></ng-content>
+        <ng-content select=".my-ibox-title" *ngIf="!boxTitle"></ng-content>
         <ng-content select=".my-ibox-addl-title"></ng-content>
         <i class="ibox-icon fa fa-chevron-down" *ngIf="isCollapsible"></i>
     </div>

web/app/elements/ibox/ibox.component.ts

@@ -8,7 +8,7 @@ import { ANIMATION_FADE_IN_NOT_OUT } from "../../app.animations";
     animations: [ANIMATION_FADE_IN_NOT_OUT],
 })
 export class IboxComponent implements OnInit {
-    @Input() title: string;
+    @Input() boxTitle: string;
     @Input() isCollapsible: boolean;
     @Input() defaultCollapsed: boolean;
 

web/app/riot/riot-home/home.component.html

@@ -35,7 +35,7 @@
     <!-- CATEGORIES               -->
     <!-- ------------------------ -->
     <div *ngFor="let category of getCategories()">
-        <my-ibox *ngIf="getIntegrationsIn(category).length > 0" title="{{category}}" [isCollapsible]="true">
+        <my-ibox *ngIf="getIntegrationsIn(category).length > 0" boxTitle="{{category}}" [isCollapsible]="true">
             <div class="my-ibox-content">
                 <my-integration-bag [integrations]="getIntegrationsIn(category)" (integrationClicked)="modifyIntegration($event)"></my-integration-bag>
             </div>