.wrapper { display: flex; flex-direction: column; height: 100%; width: 100%; .header { display: flex; justify-content: space-between; align-items: center; color: #191919; border-bottom: 1px solid #d2d2d2; padding-bottom: 0px; margin: 0; // padding: 0.4rem 1rem; } .main-content { display: flex; flex-direction: column; flex: 1; flex-grow: 1; // overflow-y: auto; padding: 24px 10px; width: 100%; // height: calc(100vh - 54px); } } .mat-fab, .mat-mini-fab, .mat-raised-button { box-shadow: none; } .button-remove { display: flex; justify-content: center; padding-top: 5px; color: #a7a7a7; &:hover { color: #009fdb; } } :host { @mixin md-icon-size($size: 24px) { // font-size: $size; height: $size; width: $size; } .material-icons.mat-icon { @include md-icon-size(24px); } /deep/ .mat-button-wrapper { padding: 0; } .mat-icon { width: 18px; height: 18px; } } .black { color: black; } .highlight { color: #009fdb; } .error-list { margin: 10px; color: white; background: red; padding: 1rem; border-radius: 5px; font-weight: bold; }