index.wxss 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. .mar-left-8 {
  2. margin-left: 16rpx;
  3. }
  4. .card-btn {
  5. display: flex;
  6. }
  7. .card-btn .button-hover {
  8. background: #b6b6b6;
  9. }
  10. .card-btn .btn-1 {
  11. position: relative;
  12. color: #666;
  13. text-align: center;
  14. padding: 0;
  15. width: 136rpx;
  16. height: 52rpx;
  17. line-height: 52rpx;
  18. font-size: 24rpx;
  19. border-radius: 26rpx;
  20. box-sizing: border-box;
  21. }
  22. .card-btn .btn-1::after {
  23. box-sizing: border-box;
  24. content: '';
  25. position: absolute;
  26. top: 0;
  27. left: 0;
  28. width: 200%;
  29. height: 200%;
  30. transform: scale(0.5);
  31. transform-origin: 0 0;
  32. border: 2rpx solid #b6b6b6;
  33. border-radius: 52rpx;
  34. pointer-events: none;
  35. }
  36. .card-btn .btn-2 {
  37. text-align: center;
  38. padding: 0;
  39. width: 136rpx;
  40. height: 52rpx;
  41. line-height: 52rpx;
  42. font-size: 24rpx;
  43. border-radius: 26rpx;
  44. box-sizing: border-box;
  45. color: #aaa;
  46. background-color: #f6f6f6;
  47. }
  48. .card-btn .btn-3 {
  49. color: white;
  50. background: linear-gradient(90deg, #ff5041 0%, #ff877d 100%);
  51. text-align: center;
  52. padding: 0;
  53. width: 136rpx;
  54. height: 52rpx;
  55. line-height: 52rpx;
  56. font-size: 24rpx;
  57. border-radius: 26rpx;
  58. box-sizing: border-box;
  59. }
  60. .card-btn .btn-5 {
  61. display: flex;
  62. align-items: center;
  63. color: #aaa;
  64. }
  65. .card-btn .arrow-right {
  66. width: 12rpx;
  67. height: 22rpx;
  68. margin-left: 10rpx;
  69. font-size: 24rpx;
  70. }