skin-black-yellow.less 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. /*
  2. * Skin: Black yellow
  3. * -----------
  4. */
  5. @import "../bootstrap-less/mixins.less";
  6. @import "../bootstrap-less/variables.less";
  7. @import "../fastadmin/variables.less";
  8. @import "../fastadmin/mixins.less";
  9. @primary: @yellow;
  10. @sidebar-dark-submenu-bg: darken(@sidebar-dark-bg, 5%);
  11. .skin-black-yellow {
  12. .main-header {
  13. background: @sidebar-dark-bg;
  14. .box-shadow(0px 1px 1px rgba(0, 0, 0, 0.05));
  15. .navbar {
  16. .navbar-variant(#fff; #666; #333; rgba(0, 0, 0, .02));
  17. .navbar-nav {
  18. > li > a {
  19. border-right: none;
  20. }
  21. }
  22. .navbar-custom-menu .navbar-nav, .navbar-right {
  23. > li {
  24. > a {
  25. border-left: none;
  26. border-right-width: 0;
  27. }
  28. }
  29. }
  30. @media (max-width: @screen-header-collapse) {
  31. .navbar-variant(@sidebar-dark-submenu-bg; #fff);
  32. }
  33. }
  34. .logo {
  35. .logo-variant(@sidebar-dark-bg; #fff);
  36. border-right: 1px solid @sidebar-dark-bg;
  37. @media (max-width: @screen-header-collapse) {
  38. .logo-variant(@sidebar-dark-submenu-bg, #fff);
  39. border-right: none;
  40. }
  41. }
  42. li.user-header {
  43. background-color: @sidebar-dark-bg;
  44. }
  45. .nav-addtabs > li > a, .nav-addtabs > li.active > a {
  46. border-right-color: transparent;
  47. }
  48. }
  49. .content-header {
  50. background: transparent;
  51. box-shadow: none;
  52. }
  53. .skin-dark-sidebar(#fff);
  54. .treeview-menu {
  55. > li {
  56. > a {
  57. padding-left: 18px;
  58. }
  59. &.active > a {
  60. background-color: @primary;
  61. }
  62. }
  63. }
  64. .sidebar-menu {
  65. > li {
  66. > a {
  67. border-left: 3px solid transparent;
  68. }
  69. &.active > a {
  70. color: @sidebar-dark-hover-color;
  71. background: @primary;
  72. border-left-color: @primary;
  73. }
  74. &:hover > a {
  75. border-left-color: transparent;
  76. }
  77. }
  78. li.treeview > a {
  79. background: transparent;
  80. border-left-color: transparent;
  81. }
  82. .treeview-menu {
  83. padding-left: 0;
  84. .treeview-menu {
  85. padding-left: 0;
  86. > li > a {
  87. padding-left: 30px;
  88. }
  89. }
  90. li.treeview > a {
  91. background: transparent;
  92. border-left-color: transparent;
  93. }
  94. }
  95. }
  96. &.sidebar-collapse {
  97. .sidebar-menu {
  98. li:hover > a, li.active > a {
  99. color: @sidebar-dark-hover-color;
  100. background: @primary;
  101. }
  102. .treeview-menu {
  103. li.active > a {
  104. color: @sidebar-dark-hover-color;
  105. background: @primary;
  106. }
  107. li.treeview > a {
  108. background: transparent;
  109. border-left-color: transparent;
  110. }
  111. }
  112. }
  113. }
  114. &.multiplenav {
  115. @media (max-width: @screen-header-collapse) {
  116. .sidebar .mobilenav a.btn-app {
  117. background: lighten(@sidebar-dark-bg, 10%);
  118. color: #fff;
  119. &.active {
  120. background: @primary;
  121. color: #fff;
  122. }
  123. }
  124. }
  125. }
  126. }