::ng-deep .mat-tab-label, ::ng-deep .mat-tab-label-active { min-width: 0 !important; } ::ng-deep .mat-tab-body-wrapper, ::ng-deep .mat-tab-body { height: 100%; width: 100%; } ::ng-deep .mat-tab-header { border-bottom: none !important; } .left-side-tabs-body { position: relative; height: 100%; width: calc(100% - 70px); div[id^='tabs'] { height: 100%; width: 100%; position: relative; } } .container { display: flex; height: 100%; } .mat-tab-group { display: flex; width: 70px; flex-direction: row; } .myprofile { position: absolute; display: flex; flex-flow: column; justify-content: center; height: 80px; width: 68px; bottom: 10px; color: #ffffff; font-size: 11px; text-align: center; z-index: 1; cursor: pointer; } ::ng-deep .organization-side { flex-direction: column; height: 100%; } ::ng-deep .global-menu { .mat-tab-label-container { .mat-tab-list { .mat-tab-labels { flex-flow: column; height: 360px; padding-top: 10px; border-bottom: none; .mat-tab-label { width: 100%; height: 80px; padding: 0 16px; } } .mat-ink-bar { background-color: none; height: 0; } } } } .left-group-side { position: relative; height: 100%; } ::ng-deep .mat-tab-label { .mat-tab-label-content { .icon-item { background: var(--white); border-radius: 4px; display: inline-flex; width: 36px; height: 36px; border-radius: 50%; justify-content: center; align-items: center; transform: scale(0.9); transition: transform 0.3s cubic-bezier(0.4, 0, 0, 1); svg { width: 24px; height: 24px; stroke: #ffffff; stroke-width: 1.5; stroke-linecap: square; stroke-linejoin: miter; fill: none; } } } &[aria-selected='true'] { opacity: 1; .mat-tab-label-content { .icon-item { transform: scale(1); } } } } ::ng-deep .ps { .ps-content { position: relative; width: 100%; height: 100%; } }