layout.less 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. @footer-height: 40px;
  2. @container-md-max-width: 1100px;
  3. [v-cloak] { display: none }
  4. html, body {
  5. height: 100%;
  6. margin: 0;
  7. }
  8. #page-wrap {
  9. height: 100%;
  10. height: auto!important;
  11. min-height: 100%;
  12. position: relative;
  13. padding-bottom: @footer-height;
  14. header {
  15. a {
  16. cursor: pointer;
  17. }
  18. .dropdown-menu.account-menu {
  19. left: auto;
  20. right: 0px;
  21. }
  22. }
  23. // App-wide styles for our ajax buttons
  24. .ajax-button {
  25. .ajax-button();
  26. }
  27. }
  28. #page-footer {
  29. border-top: 1px solid rgba(0, 0, 0, 0.1);
  30. height: @footer-height;
  31. width: 100%;
  32. position: absolute;
  33. left: 0px;
  34. bottom: 0px;
  35. .xs-only {
  36. display: none;
  37. }
  38. }
  39. @media (max-width: 800px) {
  40. #page-wrap {
  41. padding-bottom: 75px;
  42. #page-footer {
  43. height: 75px;
  44. .copy, .nav {
  45. width: 100%;
  46. display: block;
  47. text-align: center;
  48. .nav-item {
  49. display: inline-block;
  50. a {
  51. display: inline-block;
  52. }
  53. }
  54. }
  55. }
  56. }
  57. }
  58. @media (max-width: 450px) {
  59. #page-wrap {
  60. padding-bottom: 85px;
  61. #page-footer {
  62. height: 85px;
  63. .xs-only {
  64. display: block;
  65. }
  66. }
  67. }
  68. }