_brand.scss 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. //
  2. // Core: Brand
  3. //
  4. .brand-container {
  5. grid-area: brand;
  6. display: grid;
  7. grid-template-areas: "brand-link sidebar-mini-icon";
  8. grid-auto-flow: column;
  9. justify-content: space-between;
  10. font-size: $navbar-brand-font-size;
  11. padding: $brand-link-padding-y $sidebar-padding-x;
  12. white-space: nowrap;
  13. border-bottom: $brand-link-border-buttom solid tint-color($dark, 10%);
  14. .brand-link {
  15. grid-area: brand-link;
  16. }
  17. .brand-image {
  18. grid-area: brand-img;
  19. float: left;
  20. line-height: .8;
  21. margin-left: .8rem;
  22. margin-right: .5rem;
  23. margin-top: -3px;
  24. max-height: 33px;
  25. width: auto;
  26. }
  27. .brand-text {
  28. grid-area: brand-text;
  29. color: $sidebar-dark-color;
  30. &:hover {
  31. color: $white;
  32. text-decoration: none;
  33. }
  34. }
  35. .sidebar-mini-icon {
  36. grid-area: sidebar-mini-icon;
  37. color: $gray-400;
  38. }
  39. }
  40. .sidebar-collapse:not(.sidebar-hover) {
  41. .brand-container {
  42. grid-template-areas: "sidebar-mini-icon brand-link";
  43. justify-content: center;
  44. .brand-link {
  45. display: none;
  46. }
  47. }
  48. }