index.module.less 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. .accompanyCategory {
  2. box-sizing: border-box;
  3. div {
  4. box-sizing: border-box;
  5. }
  6. .container {
  7. margin: 16px 12px;
  8. height: 140px;
  9. background-repeat: no-repeat;
  10. background-size: 100% 100%;
  11. padding: 8px 20px;
  12. display: flex;
  13. flex-direction: column;
  14. justify-content: space-evenly;
  15. align-items: flex-start;
  16. }
  17. .title {
  18. font-size: 20px;
  19. font-weight: 600;
  20. color: #ffffff;
  21. text-shadow: 0px 2px 4px #7b63ff;
  22. }
  23. .sub {
  24. font-size: 14px;
  25. font-weight: 500;
  26. color: #ffffff;
  27. text-shadow: 0px 2px 4px #8771ff;
  28. }
  29. .btn {
  30. width: 90px;
  31. height: 34px;
  32. line-height: 28px;
  33. padding-left: 20px;
  34. background-repeat: no-repeat;
  35. background-size: 100% 110%;
  36. margin-left: -10px;
  37. font-size: 18px;
  38. font-weight: 500;
  39. }
  40. }
  41. .accompany-music-list{
  42. div{
  43. box-sizing: border-box;
  44. }
  45. .heade{
  46. position: fixed;
  47. top: 0;
  48. }
  49. .filter{
  50. display: flex;
  51. align-items: center;
  52. height: 60px;
  53. background-color: #F8F8F8;
  54. :global{
  55. .van-search{
  56. flex: 1;
  57. padding: 0 12px;
  58. }
  59. .van-search__field{
  60. background-color: #fff;
  61. border-radius: 20px 0 0 20px;
  62. padding-left: 12px;
  63. height: 36px;
  64. }
  65. .van-search__action{
  66. border-radius: 0 20px 20px 0;
  67. background-color: #fff;
  68. height: 36px;
  69. display: flex;
  70. align-items: center;
  71. }
  72. }
  73. .searchBtn{
  74. width: 56px;
  75. height: 27px;
  76. line-height: 27px;
  77. border-radius: 20px;
  78. background-color: var(--van-primary);
  79. font-size: 14px;
  80. text-align: center;
  81. color: #fff;
  82. &:active{
  83. opacity: .8;
  84. }
  85. }
  86. }
  87. }