skin-blue.less 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. /*
  2. * Skin: Blue
  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. @blue: #4e73df;
  10. @sidebar-dark-bg: #4e73df;
  11. @sidebar-dark-color: #ccd9ff;
  12. @sidebar-dark-submenu-color: #ccd9ff;
  13. @sidebar-dark-submenu-bg: darken(@sidebar-dark-bg, 3%);
  14. .skin-blue {
  15. .main-header {
  16. .navbar-toggle {
  17. color: #333;
  18. }
  19. .navbar-brand {
  20. color: #333;
  21. border-right: 1px solid #eee;
  22. }
  23. .navbar {
  24. .navbar-variant(#fff; #444; @blue; rgba(0, 0, 0, .02));
  25. > .sidebar-toggle {
  26. color: #333;
  27. border-right: 1px solid #eee;
  28. }
  29. .navbar-nav {
  30. > li > a {
  31. border-right: 1px solid #eee;
  32. }
  33. }
  34. .navbar-custom-menu .navbar-nav,
  35. .navbar-right {
  36. > li {
  37. > a {
  38. border-left: 1px solid #eee;
  39. border-left: none;
  40. border-right-width: 0;
  41. }
  42. }
  43. }
  44. }
  45. > .logo {
  46. .logo-variant(@blue; #fff);
  47. border-right: 1px solid @blue;
  48. box-shadow: none;
  49. @media (max-width: @screen-header-collapse) {
  50. .logo-variant(#fff; #222);
  51. border-right: none;
  52. }
  53. }
  54. li.user-header {
  55. background-color: @blue;
  56. }
  57. .nav-addtabs > li > a, .nav-addtabs > li.active > a {
  58. border-right-color: transparent;
  59. }
  60. }
  61. .content-header {
  62. background: transparent;
  63. box-shadow: none;
  64. }
  65. .skin-dark-sidebar(#fff);
  66. .sidebar-menu > li {
  67. > a {
  68. border-left: 3px solid transparent;
  69. padding-left: 12px;
  70. }
  71. }
  72. @media (min-width: @screen-sm) {
  73. &.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right) {
  74. margin-left: -3px;
  75. }
  76. }
  77. .sidebar-form input[type="text"] {
  78. .placeholder(#fff);
  79. }
  80. .sidebar-form input[type="text"], .sidebar-form .btn {
  81. color: #fff;
  82. }
  83. &.multiplenav {
  84. @media (max-width: @screen-header-collapse) {
  85. .main-header {
  86. .navbar {
  87. .navbar-variant(@sidebar-dark-bg; #fff);
  88. }
  89. > .logo {
  90. .logo-variant(@sidebar-dark-bg; #fff);
  91. }
  92. }
  93. .sidebar .mobilenav a.btn-app {
  94. background: lighten(@sidebar-dark-bg, 10%);
  95. color: #fff;
  96. &.active {
  97. background: #fff;
  98. color: lighten(@sidebar-dark-bg, 10%);
  99. }
  100. }
  101. }
  102. }
  103. }