Использование mat-диалога, но не отображается правильно - PullRequest
0 голосов
/ 11 июня 2019

Это моя страница.my page

И когда я нажимаю кнопку «сердце», я получаю этот диалог, но у него есть некоторые проблемы с отображением.

Display issue

Это мой код значка.

<ng-container matColumnDef="Action">
              <th mat-header-cell *matHeaderCellDef></th>
              <td mat-cell *matCellDef="let element">
                 ...
                <span>
                  <mat-icon (click)="openDialog()" svgIcon="favorite_plus"></mat-icon>
                </span>
              </td>
            </ng-container>

Это моя функция для открытия диалогового окна.

constructor(public dialog: MatDialog) { }

    openDialog(): void {
        const dialogRef = this.dialog.open(PopupAddOrdersWishListComponent, {
            height: '600px',
            width: '800px'
        });
    }

Это файл scss для всплывающего компонента

.example-card-full-width {
    width: 95%;
}

.mat-radio-button~.mat-radio-button {
    margin-left: 16px;
}

.pt-5,
.py-5 {
    padding-top: 1rem !important;
}

.card-title,
.cart-table__column,
.btn {
    font-size: 14px;
}

.highlight {
    font-size: 16px;
}

.address-card__row,
.content {
    font-size: 12px;
}

.cart__checkout-button {
    width: 30%;
    margin-left: 20px;
}

@media only screen and (max-width: 980px) {
    .cart__checkout-button {
        width: 100%;
        margin-left: 0px;
    }
}

.responsive-size {
    width: 100%;
}

Я пытаюсь комментировать любые CSS один за другим, но это не работает для меня.

...