Don't show breadcrumb button without any label #9432

With MDC this would take up empty space, breaking layout, while not showing anything to end-user, so being useless.
Ecodev · Mar 20, 2023 · f655ca5 · f655ca5
1 parent bdd6a21
commit f655ca5
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/projects/natural/src/lib/modules/detail-header/detail-header.component.html b/projects/natural/src/lib/modules/detail-header/detail-header.component.html
@@ -1,7 +1,12 @@
 <div class="breadcrumb">
-    <a [routerLink]="isPanel ? [] : getRootLink()" [fragment]="listFragment" color="primary" mat-button>{{
-        rootLabel || label
-    }}</a>
+    <a
+        *ngIf="rootLabel || label"
+        [routerLink]="isPanel ? [] : getRootLink()"
+        [fragment]="listFragment"
+        color="primary"
+        mat-button
+        >{{ rootLabel || label }}</a
+    >
     <ng-container *ngFor="let parent of breadcrumbs">
         /
         <a [routerLink]="isPanel ? [] : getLink(parent.id)" color="primary" mat-button>

diff --git a/src/app/detail-header/detail-header.component.html b/src/app/detail-header/detail-header.component.html
@@ -51,4 +51,9 @@ <h2 class="mat-h2">All</h2>
             </div>
         </natural-detail-header>
     </div>
+    <div>
+        <h2 class="mat-h2">Minimal</h2>
+
+        <natural-detail-header [model]="model"> </natural-detail-header>
+    </div>
 </div>