AdminLTE/scss/layout/_main-brand.scss

87 lines
1.6 KiB
SCSS

//
// Core: Brand
//
@include brand-variant($sidebar-dark-bg, $sidebar-dark-color);
.main-brand {
grid-area: main-brand;
display: grid;
grid-template-areas: "brand-link sidebar-mini-icon";
grid-auto-flow: column;
justify-content: space-between;
font-size: $navbar-brand-font-size;
padding: $brand-link-padding-y $sidebar-padding-x;
white-space: nowrap;
border-bottom: $brand-link-border-buttom solid tint-color($dark, 10%);
min-width: $sidebar-width;
max-width: $sidebar-width;
height: min-content;
@include transition($sidebar-transition);
z-index: $zindex-main-brand;
.brand-link {
grid-area: brand-link;
}
.brand-image {
grid-area: brand-img;
float: left;
line-height: .8;
margin-left: .8rem;
margin-right: .5rem;
margin-top: -3px;
max-height: 33px;
width: auto;
}
.brand-text {
grid-area: brand-text;
color: $sidebar-dark-color;
&:hover {
color: $white;
text-decoration: none;
}
}
.brand-icons {
display: inline-flex;
> * {
color: $gray-400;
}
}
.sidebar-full-icon,
.header-full-icon {
display: none;
}
.sidebar-mini-icon {
grid-area: sidebar-mini-icon;
}
}
.sidebar-collapse:not(.sidebar-hover) {
.main-brand {
grid-template-areas: "sidebar-mini-icon brand-link";
justify-content: center;
min-width: $sidebar-mini-width;
max-width: $sidebar-mini-width;
.brand-link {
display: none;
}
}
}
@include media-breakpoint-down(md) {
.main-brand {
min-width: unset;
max-width: unset;
.sidebar-mini-icon {
display: none;
}
}
}