_layout.scss 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. /*
  2. * Core: General Layout Style
  3. * -------------------------
  4. */
  5. html,
  6. body {
  7. height: 100%;
  8. }
  9. html,
  10. body,
  11. .wrapper {
  12. height: 100%;
  13. overflow-x: hidden;
  14. }
  15. .layout-boxed {
  16. background: url('#{$boxed-layout-bg-image-path}') #ccc repeat;
  17. }
  18. .wrapper {
  19. //min-height: 100%;
  20. .layout-boxed & {
  21. box-shadow: 0 0 10px rgba(0,0,0,.3);
  22. &,
  23. &:before {
  24. margin: 0 auto;
  25. max-width: $boxed-layout-max-width;
  26. }
  27. }
  28. }
  29. .wrapper:before,
  30. .main-sidebar:before {
  31. content: "";
  32. position: absolute;
  33. top: 0;
  34. bottom: 0;
  35. z-index: -1;
  36. }
  37. .wrapper:before {
  38. background: $main-bg;
  39. width: 100%;
  40. }
  41. .main-sidebar:before {
  42. left: 0;
  43. width: $sidebar-width;
  44. }
  45. .content-wrapper,
  46. .main-footer {
  47. margin-left: $sidebar-width;
  48. z-index: 3000;
  49. .sidebar-collapse & {
  50. margin-left: 0;
  51. }
  52. }
  53. .content-wrapper,
  54. .main-sidebar {
  55. @include calc("min-height", "100% - #{$main-header-height + $main-footer-height}");
  56. }
  57. .content-wrapper {
  58. background: $main-bg;
  59. > .content-header,
  60. > .content {
  61. display: table;
  62. width: 100%;
  63. }
  64. > .content {
  65. padding: 15px;
  66. }
  67. }
  68. .main-sidebar {
  69. width: $sidebar-width;
  70. float: left;
  71. .sidebar-collapse & {
  72. &,
  73. &:before {
  74. margin-left: -$sidebar-width;
  75. }
  76. }
  77. }
  78. .main-footer {
  79. padding: $main-footer-padding;
  80. color: #555;
  81. border-top: $main-footer-border-top;
  82. background: #fff;
  83. margin-left: $sidebar-width;
  84. }
  85. .content-header {
  86. padding: 15px;
  87. background: #fff;
  88. box-shadow: 3px 0 6px rgba(0, 0, 0, 0.2);
  89. h1 {
  90. font-size: 1.8rem;
  91. margin: 0;
  92. }
  93. .breadcrumb {
  94. margin-bottom: 0;
  95. padding: 0;
  96. background: transparent;
  97. line-height: 1.8rem;
  98. @include media-breakpoint-down(sm) {
  99. float: none !important;
  100. margin-top: 15px;
  101. line-height: 1;
  102. }
  103. }
  104. }