myhome.wxss 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  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. justify-content: center;
  35. flex: 1;
  36. }
  37. .header .info .nickname {
  38. font-size: 34rpx;
  39. font-weight: bold;
  40. margin-bottom: 10rpx;
  41. }
  42. .header .info .weixin {
  43. font-size: 24rpx;
  44. color: #8e8e8e;
  45. margin-bottom: 10rpx;
  46. }
  47. .header .info .other {
  48. width: 350rpx;
  49. font-size: 26rpx;
  50. color: #8e8e8e;
  51. background-color: rgb(255, 238, 211);
  52. }
  53. .header .info .other .money {
  54. color: #fe7124;
  55. }
  56. .card{
  57. margin: 20rpx;
  58. background-color: #fff;
  59. box-sizing: border-box;
  60. border-radius: 15rpx;
  61. }
  62. .card-title{
  63. display: flex;
  64. padding: 30rpx 20rpx;
  65. align-items: center;
  66. border-radius: 15rpx;
  67. }
  68. .card-title:active{
  69. background-color: #eee;
  70. }
  71. .card-title .icon{
  72. margin-right: 15rpx;
  73. }
  74. .icon-postage{
  75. width: 50rpx;
  76. height: 40rpx;
  77. }
  78. .icon-phone{
  79. width: 32rpx;
  80. height: 44rpx;
  81. }
  82. .card-title .text{
  83. flex: 1
  84. }
  85. .card-title .more{
  86. font-size: 24rpx;
  87. color: #8e8e8e;
  88. width: 50rpx;
  89. height: 50rpx;
  90. }
  91. .card-body{
  92. padding: 0 20rpx 20rpx;
  93. }
  94. .card-item{
  95. padding: 30rpx;
  96. margin: 20rpx 0;
  97. border-radius: 15rpx;
  98. color: #fff;
  99. }
  100. .card-item:active{
  101. /* opacity: .8; */
  102. }
  103. .bg-orange{
  104. background: linear-gradient(to right, #ff7a21 0%,#feb25a 100%);
  105. }
  106. .bg-blue{
  107. background: linear-gradient(to right, #006ec9 0%,#2599d8 100%);
  108. }