clue.scss 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. .suspension_button {
  2. position: fixed;
  3. bottom: 200rpx;
  4. left: 50rpx;
  5. border-radius: 50%;
  6. width: 100rpx;
  7. line-height: 100rpx;
  8. color: #ffffff;
  9. font-size: 26rpx;
  10. text-align: center;
  11. background-color: #4c8afe;
  12. }
  13. .trend {
  14. bottom: 320rpx;
  15. background-color: #fe9c4c;
  16. }
  17. .clueDetail_tabber {
  18. ::v-deep .u-tabbar__content {
  19. background: #108cff;
  20. border-top-right-radius: 10px;
  21. border-top-left-radius: 10px;
  22. }
  23. }
  24. .clue_state_wrap {
  25. width: 690rpx;
  26. padding: 0 30rpx;
  27. margin-top: 20rpx;
  28. display: flex;
  29. .clue_state_list {
  30. display: flex;
  31. .clue_state_item {
  32. font-size: 30rpx;
  33. display: inline-flex;
  34. /* 关键改动:改为行内弹性盒子 */
  35. align-items: center;
  36. /* 垂直居中 */
  37. background: #fff;
  38. margin-right: 30rpx;
  39. padding: 8rpx 16rpx;
  40. /* 增加内边距 */
  41. white-space: nowrap;
  42. /* 关键:禁止文本换行 */
  43. border-radius: 6rpx;
  44. &.active {
  45. color: #fff;
  46. background: #4c8afe;
  47. }
  48. }
  49. }
  50. }
  51. .clueTagsSelect {
  52. height: 0;
  53. overflow: hidden;
  54. }
  55. .queryParams_wrap {
  56. display: flex;
  57. background: #fff;
  58. padding: 14px 0;
  59. .query,
  60. .sort {
  61. display: flex;
  62. align-items: center;
  63. justify-content: center;
  64. flex: 1;
  65. font-size: 16px;
  66. font-weight: 700;
  67. color: #202020;
  68. }
  69. }
  70. #navbar_center_wrap {
  71. width: 320rpx;
  72. margin: auto;
  73. padding: 15px;
  74. background-color: #fff;
  75. }
  76. .post_wrap {
  77. margin: 10px 0;
  78. }
  79. .case_top_wrap {
  80. background-color: #fff;
  81. padding: 0px 30rpx 15rpx 30rpx;
  82. display: flex;
  83. align-items: center;
  84. justify-content: space-between;
  85. .conditionSelect {
  86. width: 200rpx;
  87. }
  88. }
  89. .case_wrap {
  90. padding-bottom: 30px;
  91. .case_main_wrap {
  92. padding: 15px;
  93. }
  94. }
  95. .trend_modal{
  96. width:100%;
  97. display: flex;
  98. flex-direction: column;
  99. gap: 20rpx;
  100. }