index.less 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. @import (reference) '../style/themes/index.less';
  2. .ant-indexbar-side {
  3. z-index: 9;
  4. &-mask {
  5. position: fixed;
  6. width: 100vw;
  7. height: 100vh;
  8. left: 0;
  9. top: 0;
  10. z-index: 9;
  11. }
  12. &-content {
  13. width: 100%;
  14. height: 100%;
  15. justify-content: center;
  16. align-items: center;
  17. text-align: center;
  18. }
  19. &-item {
  20. position: relative;
  21. padding-left: 20 * @rpx;
  22. &-default {
  23. font-size: 22 * @rpx;
  24. font-weight: bold;
  25. color: @COLOR_TEXT_ASSIST;
  26. display: flex;
  27. align-items: center;
  28. justify-content: center;
  29. }
  30. &-tip {
  31. position: absolute;
  32. left: -210 * @rpx;
  33. bottom: -36 * @rpx;
  34. width: 100 * @rpx;
  35. height: 100 * @rpx;
  36. border-radius: 100 * @rpx;
  37. line-height: 100 * @rpx;
  38. text-align: center;
  39. background: @COLOR_TEXT_WEAK;
  40. color: @COLOR_WHITE;
  41. font-size: 56 * @rpx;
  42. &::after {
  43. content: '';
  44. position: absolute;
  45. top: -30 * @rpx;
  46. right: -60 * @rpx;
  47. display: block;
  48. margin: 40 * @rpx auto;
  49. width: 0;
  50. height: 0;
  51. border: 40 * @rpx solid transparent;
  52. border-left-color: @COLOR_TEXT_WEAK;
  53. }
  54. }
  55. }
  56. &-active {
  57. border-radius: 16 * @rpx;
  58. background-color: @COLOR_BRAND1;
  59. color: @COLOR_WHITE;
  60. }
  61. &-scroll {
  62. width: 100%;
  63. height: 100%;
  64. overflow: scroll;
  65. scrollbar-width: none;
  66. }
  67. &-notSee {
  68. position: fixed;
  69. left: -200%;
  70. top: 0;
  71. z-index: -1;
  72. }
  73. }