.message-box { position: relative; height: 100%; } .current-head { h3 { display: inline-flex; padding-left: 10px; align-items: center; color: #ffffff; } .btn-box { height: 100%; margin-left: auto; display: inline-flex; align-items: center; } } .list-search { display: flex; flex-direction: row; align-items: center; padding: 0; font-size: 14px; background-color: #f9f9f9; border-bottom: 1px solid #dddddd; .searchbox { width: 100%; height: 100%; } } ::ng-deep .searchbox { .mat-form-field { display: block; .mat-form-field-wrapper { padding: 0; padding-bottom: 0 !important; height: 100%; .mat-form-field-flex { height: 59px; padding: 0 10px 0 20px; align-items: center; .mat-form-field-infix { width: 90%; font-size: 14px; border: none; } .mat-form-field-suffix { .mat-icon { line-height: 24px; } } } } } .mat-form-field-appearance-legacy { .mat-form-field-wrapper { padding: 0; } .mat-form-field-underline { bottom: 0; background-color: unset !important; } } } .mat-tab-label-active { opacity: 1; } .message-item { cursor: pointer; } ::ng-deep .message-box { .message-section { position: relative; height: calc(100% - 120px); .message-tab { position: relative; height: 100%; } } }