@import '../../styles/themes'; //@import '~bootstrap/scss/mixins/breakpoints'; //@import '~@nebular/theme/styles/global/breakpoints'; // @include nb-install-component() { display: flex; justify-content: space-between; width: 100%; .left { display: flex; width: 100%; order: 0; flex-direction: row; } .right { order: 1; flex-direction: row-reverse; } .logo-container { display: flex; align-items: center; width: calc(#{nb-theme(sidebar-width)} - #{nb-theme(header-padding)}); } nb-action { height: auto; display: flex; align-content: center; } nb-user { cursor: pointer; } ::ng-deep nb-search button { padding: 0!important; } .header-container { display: flex; align-items: center; width: auto; .navigation { @include nb-ltr(padding-right, 1.25rem); @include nb-rtl(padding-left, 1.25rem); text-decoration: none; nb-icon { font-size: 2.5rem; } } .logo { padding: 0 1.25rem; font-size: 1.75rem; @include nb-ltr(border-left, 1px solid nb-theme(divider-color)); @include nb-rtl(border-right, 1px solid nb-theme(divider-color)); white-space: nowrap; text-decoration: none; } } // // @include nb-for-theme(corporate) { // $menu-action-separator-color: #3f4550; // // nb-action { // @include nb-ltr(border-left-color, $menu-action-separator-color); // @include nb-rtl(border-right-color, $menu-action-separator-color); // } // // .header-container .logo { // @include nb-ltr(border, none); // @include nb-rtl(border, none); // } // // .header-container ::ng-deep ngx-theme-switcher .dropdown-toggle { // color: nb-theme(color-white); // background: transparent; // } // } // // ngx-layout-direction-switcher { // margin: 0 1.5rem; // } // // ngx-theme-switcher { // margin: nb-theme(layout-padding); // margin-top: 0; // margin-bottom: 0; // } // // @include media-breakpoint-down(xl) { // ngx-layout-direction-switcher { // display: none; // } // } // // .toggle-settings ::ng-deep a { // display: block; // text-decoration: none; // line-height: 1; // // i { // color: nb-theme(color-fg-highlight); // font-size: 2.25rem; // border-radius: 50%; // position: relative; // animation-name: pulse-light; // // &::after { // content: ' '; // // hack to be able to set border-radius // background-image: url('data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'); // border-radius: 50%; // pointer-events: none; // // position: absolute; // top: 52.3%; // left: 50%; // transform: translate(-50%, -50%); // width: 13%; // height: 13%; // // animation: 3s linear infinite pulse; // // @include nb-for-theme(default) { // animation-name: pulse-light; // } // } // } // } // // @include keyframes(pulse) { // 0% { // //box-shadow: 0 0 1px 0 rgba(nb-theme(color-fg-highlight), 0); // } // 20% { // //box-shadow: 0 0 3px 10px rgba(nb-theme(color-fg-highlight), 0.4); // } // 100% { // //box-shadow: 0 0 5px 20px rgba(nb-theme(color-fg-highlight), 0); // } // } // // @include keyframes(pulse-light) { // 0% { // box-shadow: 0 0 1px 0 rgba(115, 255, 208, 0); // } // 20% { // box-shadow: 0 0 3px 10px rgba(115, 255, 208, 0.4); // } // 100% { // box-shadow: 0 0 5px 20px rgba(115, 255, 208, 0); // } // } // // @include media-breakpoint-down(md) { // // nb-action:not(.toggle-settings) { // border: none; // } // // .control-item { // display: none; // } // // .toggle-settings { // padding: 0; // } // // ngx-layout-direction-switcher { // display: none; // } // // ngx-theme-switcher { // margin: 0 0.5rem; // } // } // // @include media-breakpoint-down(sm) { // // nb-user ::ng-deep .user-name { // display: none; // } // } // // @include media-breakpoint-down(is) { // // .header-container { // .logo { // font-size: 1.25rem; // } // } // // .toggle-settings { // display: none; // } // // ngx-theme-switcher { // display: none; // } // // nb-action:not(.toggle-settings) { // padding: 0; // } // } // // @include media-breakpoint-down(xs) { // .right ::ng-deep { // display: none; // } // } }