skin-purple.less 2.7 KB

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