Browse Source

fix(admin-ui): Fix CustomerGroupList layout in Firefox

Closes #531
Michael Bromley 5 years ago
parent
commit
c432a14007

+ 1 - 1
packages/admin-ui/src/lib/customer/src/components/customer-group-list/customer-group-list.component.html

@@ -9,7 +9,7 @@
     </vdr-ab-right>
     </vdr-ab-right>
 </vdr-action-bar>
 </vdr-action-bar>
 <div class="group-wrapper">
 <div class="group-wrapper">
-    <table class="table group-list" *ngIf="!(listIsEmpty$ | async); else emptyPlaceholder">
+    <table class="table group-list" [class.expanded]="activeGroup$ | async" *ngIf="!(listIsEmpty$ | async); else emptyPlaceholder">
         <tbody>
         <tbody>
             <tr *ngFor="let group of groups$ | async" [class.active]="group.id === (activeGroup$ | async)?.id">
             <tr *ngFor="let group of groups$ | async" [class.active]="group.id === (activeGroup$ | async)?.id">
                 <td class="left align-middle"><vdr-entity-info [entity]="group"></vdr-entity-info></td>
                 <td class="left align-middle"><vdr-entity-info [entity]="group"></vdr-entity-info></td>

+ 4 - 0
packages/admin-ui/src/lib/customer/src/components/customer-group-list/customer-group-list.component.scss

@@ -12,6 +12,10 @@
         tr.active {
         tr.active {
             background-color: $color-grey-200;
             background-color: $color-grey-200;
         }
         }
+        &.expanded {
+            // Fix for Firefox layout https://github.com/vendure-ecommerce/vendure/issues/531
+            width: calc(100% - 40vw);
+        }
     }
     }
 }
 }
 .group-members {
 .group-members {