mobile.less 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. @import "./base.less";
  2. @media only screen and (max-width: 768px) {
  3. .rr-header-action {
  4. display: flex !important;
  5. }
  6. .show-xs-only {
  7. display: block !important;
  8. }
  9. }
  10. @media only screen and (min-width: 768px) {
  11. }
  12. @media only screen and (min-width: 768px) and (max-width: 992px) {
  13. }
  14. @media only screen and (max-width: 992px) {
  15. }
  16. @media only screen and (min-width: 992px) {
  17. }
  18. @media only screen and (min-width: 992px) and (max-width: 1200px) {
  19. }
  20. @media only screen and (max-width: 1200px) {
  21. }
  22. @media only screen and (min-width: 1200px) {
  23. }
  24. @media only screen and (min-width: 1200px) and (max-width: 1920px) {
  25. }
  26. @media only screen and (max-width: 1920px) {
  27. }
  28. @media only screen and (min-width: 1920px) {
  29. }
  30. //
  31. .ui-mobile {
  32. .rr-view-tab-wrap {
  33. left: 0 !important;
  34. transition: left 0s !important;
  35. }
  36. .rr-header-ctx-logo-img-wrap {
  37. display: none !important;
  38. }
  39. }
  40. .rr-sidebar-mobile {
  41. z-index: 9999 !important;
  42. &-inner {
  43. margin: 0;
  44. padding: 0;
  45. scrollbar-width: none;
  46. &::-webkit-scrollbar {
  47. display: none;
  48. }
  49. }
  50. }
  51. .ui-sidebar-light .rr-sidebar-mobile {
  52. .el-drawer__body,
  53. .rr-header-ctx-logo-mobile {
  54. background: @light-bg !important;
  55. }
  56. .rr-header-ctx-logo-mobile {
  57. color: @light-text !important;
  58. }
  59. }
  60. .ui-sidebar-dark .rr-sidebar-mobile {
  61. .el-drawer__body,
  62. .rr-header-ctx-logo-mobile {
  63. background: @dark-bg !important;
  64. }
  65. .rr-header-ctx-logo-mobile {
  66. color: @dark-text !important;
  67. }
  68. }
  69. .ui-sidebarCollapse-true,
  70. .ui-sidebarCollapse-false {
  71. .rr-sidebar-mobile {
  72. width: initial !important;
  73. .el-menu.rr-sidebar-menu {
  74. width: 230px !important;
  75. .el-menu-item,
  76. .el-sub-menu__title {
  77. a {
  78. display: inline-block !important;
  79. }
  80. }
  81. }
  82. .rr-header-ctx-logo.rr-header-ctx-logo-mobile {
  83. width: auto !important;
  84. .rr-header-ctx-logo-text {
  85. display: inline-block !important;
  86. }
  87. }
  88. .el-drawer,
  89. .el-drawer__body {
  90. box-shadow: none !important;
  91. }
  92. }
  93. }