skin-purple-light.less 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  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. .skin-purple-light {
  10. //Navbar
  11. .main-header {
  12. background-color: @purple;
  13. .navbar {
  14. .navbar-variant(@purple; #fff; #f6f6f6; rgba(0, 0, 0, 0.05));
  15. .sidebar-toggle {
  16. color: #fff;
  17. &:hover {
  18. background-color: darken(@purple, 5%);
  19. }
  20. }
  21. @media (max-width: @screen-header-collapse) {
  22. .dropdown-menu {
  23. li {
  24. &.divider {
  25. background-color: rgba(255, 255, 255, 0.1);
  26. }
  27. a {
  28. color: #fff;
  29. &:hover {
  30. background: darken(@purple, 5%);
  31. }
  32. }
  33. }
  34. }
  35. }
  36. }
  37. //Logo
  38. .logo {
  39. .logo-variant(@purple);
  40. }
  41. li.user-header {
  42. background-color: @purple;
  43. }
  44. }
  45. //Content Header
  46. .content-header {
  47. background: transparent;
  48. }
  49. //Create the sidebar skin
  50. .skin-light-sidebar(@purple);
  51. .sidebar-menu > li {
  52. > a {
  53. border-left: 3px solid transparent;
  54. padding-left: 12px;
  55. }
  56. }
  57. @media (min-width: @screen-sm) {
  58. &.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right) {
  59. margin-left: -3px;
  60. }
  61. }
  62. .main-sidebar {
  63. .box-shadow(7px 0 14px rgba(0, 0, 0, .03));
  64. }
  65. .content-wrapper, .main-footer {
  66. border-left: none;
  67. }
  68. &.multiplenav {
  69. @media (max-width: @screen-header-collapse) {
  70. .sidebar .mobilenav a.btn-app {
  71. background: #eceff3;
  72. color: #757575;
  73. &.active {
  74. background: @purple;
  75. color: #fff;
  76. }
  77. }
  78. }
  79. }
  80. }