sidebar.less 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. /*
  2. Component: Sidebar
  3. --------------------------
  4. */
  5. .sidebar {
  6. margin-bottom: 5px;
  7. // remove shadow from form
  8. .sidebar-form {
  9. input:focus {
  10. -webkit-box-shadow: none;
  11. -moz-box-shadow: none;
  12. box-shadow: none;
  13. border-color: transparent!important;
  14. }
  15. }
  16. // Sidebar menu
  17. .sidebar-menu {
  18. list-style: none;
  19. margin: 0;
  20. padding: 0;
  21. > li {
  22. margin: 0;
  23. padding: 0;
  24. > a {
  25. padding: 12px 5px 12px 15px;
  26. display: block;
  27. > .fa, > .glyphicon, > .ion {
  28. width: 20px;
  29. }
  30. }
  31. }
  32. // Tree view menu
  33. .treeview-menu {
  34. display: none;
  35. list-style: none;
  36. padding:0;
  37. margin:0;
  38. > li {
  39. margin: 0;
  40. > a {
  41. padding: 5px 5px 5px 15px;
  42. display: block;
  43. font-size: 14px;
  44. margin: 0px 0px;
  45. > .fa, > .glyphicon, > .ion {
  46. width: 20px;
  47. }
  48. }
  49. }
  50. }
  51. }
  52. }
  53. //Sidebar user panel
  54. .user-panel {
  55. padding: 10px;
  56. .clearfix();
  57. > .image > img {
  58. width: 45px;
  59. height: 45px;
  60. }
  61. > .info {
  62. font-weight: 600;
  63. padding: 5px 5px 5px 15px;
  64. font-size: 14px;
  65. line-height: 1;
  66. }
  67. > .info > p {
  68. margin-bottom: 9px;
  69. }
  70. > .info > a {
  71. text-decoration: none;
  72. padding-right: 5px;
  73. margin-top: 3px;
  74. font-size: 11px;
  75. font-weight: normal;
  76. > .fa, > .ion, > .glyphicon {
  77. margin-right: 3px;
  78. }
  79. }
  80. }
  81. /*
  82. * Off Canvas
  83. * --------------------------------------------------
  84. * Gives us the push menu effect
  85. */
  86. @media screen and (max-width: @screen-md) {
  87. .relative {
  88. position: relative;
  89. }
  90. .row-offcanvas-right
  91. .sidebar-offcanvas {
  92. right: -@left-side-width;
  93. }
  94. .row-offcanvas-left
  95. .sidebar-offcanvas {
  96. left: -@left-side-width;
  97. }
  98. .row-offcanvas-right.active {
  99. right: @left-side-width;
  100. }
  101. .row-offcanvas-left.active {
  102. left: @left-side-width;
  103. }
  104. .sidebar-offcanvas {
  105. left: 0;
  106. }
  107. body.fixed {
  108. .sidebar-offcanvas {
  109. margin-top: 50px;
  110. left: -@left-side-width;
  111. }
  112. .row-offcanvas-left.active {
  113. .navbar {
  114. left: @left-side-width!important;
  115. right: 0;
  116. }
  117. .sidebar-offcanvas {
  118. left: 0px;
  119. }
  120. }
  121. }
  122. }