:host { .app-layout-native-title-bar { -webkit-user-select: none; -webkit-app-region: drag; position: fixed; right: 0; top: 0; display: flex; // align-items: center; // justify-content: center; // flex-direction: row-reverse; cursor: pointer; background: white; height: 30px; .app-layout-native-title-bar-spacer { flex: 1 1 auto; } .app-layout-native-title-bar-actions { position: relative; .button { -webkit-app-region: no-drag; outline: 0; cursor: pointer; border: none; height: 100%; min-width: 30px; max-width: 30px; padding: 5px; line-height: 10px; border-radius: 0; background: transparent; transition: background 0.2s linear, color 0.2s linear; text-align: center; font-size: 10px; .mat-icon { transform: translateY(-2px); width: 16px; height: 16px; font-size: 16px; } &.app-layout-native-title-bar-close, &.app-layout-native-title-bar-maximize, &.app-layout-native-title-bar-minimize { color: black; font-weight: lighter; } // &.app-layout-native-title-bar-minimize .mat-icon { // transform: translateY(-43%); // } &:hover { &.app-layout-native-title-bar-close { background: #e81123; color: darken(white, 20%); } &.app-layout-native-title-bar-minimize { background: darken(#673ab7, 10%); color: darken(white, 20%); } &.app-layout-native-title-bar-maximize { background: darken(#673ab7, 10%); color: darken(white, 20%); } } } } .app-layout-native-title-bar-title { font-size: 12px; } } }