как изменить размер фишки мата в Angular - PullRequest
0 голосов
/ 16 июня 2020

Мне интересно, есть ли способ уменьшить размер mat-chip до меньшего, а затем сделать мое поле mat-form-field также меньше. прямо сейчас мое поле матовой формы для чипов действительно большое и почти такого же размера, как и другие поля, такие как поле описания, поэтому я хочу, чтобы поля формы для чипов и самого чипа были меньше, чтобы они выглядели лучше.

Мы будем очень благодарны за любую помощь или предложение.

        <mat-chip-list #chipList>
            <div>
                <mat-chip *ngFor="let superTag of superTags" [selectable]="selectable" [removable]="removable"
                    (removed)="remove(superTag)">
                    <img class="super-icon" src="/assets/images/icons/super-tag-icon.svg">
                    {{superTag.tag}}
                    <mat-icon matChipRemove *ngIf="removable" matTooltip="Remove a super tag">cancel</mat-icon>
                </mat-chip>
            </div>
            <div>
                <input matInput  #input [(ngModel)]="tagIn" [formControl]="tagCtrl" [matAutocomplete]="auto" [matChipInputFor]="chipList"
                    [matChipInputSeparatorKeyCodes]="separatorKeysCodes" (matChipInputTokenEnd)="addTag()">
                <!-- <img class="icon" src="/assets/images/icons/chevron-down-icon.svg" alt="down"> -->
            </div>
        </mat-chip-list>
.form{
    // display: flex;
    width: calc(100% - 80px);
    height: 10px;
}

.icon{
    margin-top: -12px;
}

.super-icon{
    width: 15px;
    margin-right: 8px;
}
.is-loading ::ng-deep .mat-option-text {
    display: flex;
    justify-content: center;
  }

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...