myhome.wxss 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. /* pages/myhome/myhome.wxss */
  2. .myhome-wrp{
  3. position: relative;
  4. }
  5. .topbg{
  6. position: absolute;
  7. top: 0;
  8. left: 0;
  9. width: 100%;
  10. height: 80rpx;
  11. background-color: #fe7124;
  12. z-index: 1;
  13. }
  14. .header{
  15. position: relative;
  16. z-index: 2;
  17. display: flex;
  18. width: 690rpx;
  19. margin: 0 auto;
  20. padding: 40rpx;
  21. border-radius: 15rpx;
  22. background-color: #fff;
  23. box-sizing: border-box;
  24. }
  25. .header .avtor{
  26. width: 120rpx;
  27. height: 120rpx;
  28. border-radius: 50%;
  29. margin-right: 30rpx;
  30. }
  31. .header .info{
  32. display: flex;
  33. flex-direction: column;
  34. flex: 1;
  35. }
  36. .header .info .nickname {
  37. font-size: 34rpx;
  38. font-weight: bold;
  39. margin-bottom: 10rpx;
  40. }
  41. .header .info .weixin {
  42. font-size: 24rpx;
  43. color: #8e8e8e;
  44. margin-bottom: 10rpx;
  45. }
  46. .header .info .other {
  47. width: 350rpx;
  48. font-size: 26rpx;
  49. color: #8e8e8e;
  50. background-color: rgb(255, 238, 211);
  51. }
  52. .header .info .other .money {
  53. color: #fe7124;
  54. }
  55. .card{
  56. margin: 20rpx;
  57. background-color: #fff;
  58. box-sizing: border-box;
  59. border-radius: 15rpx;
  60. }
  61. .card-title{
  62. display: flex;
  63. padding: 30rpx 20rpx;
  64. align-items: center;
  65. border-radius: 15rpx;
  66. }
  67. .card-title:active{
  68. background-color: #eee;
  69. }
  70. .card-title .icon{
  71. margin-right: 15rpx;
  72. }
  73. .icon-postage{
  74. width: 50rpx;
  75. height: 40rpx;
  76. }
  77. .icon-phone{
  78. width: 32rpx;
  79. height: 44rpx;
  80. }
  81. .card-title .text{
  82. flex: 1
  83. }
  84. .card-title .more{
  85. font-size: 24rpx;
  86. color: #8e8e8e;
  87. width: 50rpx;
  88. height: 50rpx;
  89. }
  90. .card-body{
  91. padding: 20rpx 20rpx 40rpx;
  92. }
  93. .card-item{
  94. padding: 30rpx;
  95. border-radius: 15rpx;
  96. color: #fff;
  97. }
  98. .card-item:active{
  99. /* opacity: .8; */
  100. }
  101. .bg-orange{
  102. background: linear-gradient(to right, #ff7a21 0%,#feb25a 100%);
  103. }
  104. .bg-blue{
  105. background: linear-gradient(to right, #006ec9 0%,#2599d8 100%);
  106. }