/* pages/tabber/my/index.wxss */ .page { width: 750rpx; height: 100vh; } /* button {} */ .page1 { background: linear-gradient(180deg, #F4F3F8 0%, #F6F6F6 100%); } .title { position: absolute; left: 50%; transform: translate(-50%, 0); color: #000; z-index: 100; } .topBoxs { width: 750rpx; height: 350rpx; background: linear-gradient(180deg, #F4F3F8 0%, #F4F3F8 100%); padding: 40rpx 32rpx; align-items: flex-end; position: relative; } .topBoxs .userPicture { width: 120rpx; height: 120rpx; border-radius: 50%; } .dd{display: flex; flex-direction: column;} .topBoxs .phone { margin-left: 30rpx; font-size: 24rpx; border: solid 0; background-color: transparent; padding: 0; } .phone::after{ border: none; outline: none; } .topBoxs .bg { width: 246rpx; height: 276rpx; right: 0; bottom: -20%; position: absolute; } .menuBoxs { width: 750rpx; background: #FFFFFF; border-radius: 24rpx; position: relative; left: 0; top: -15rpx; z-index: 1; padding: 65rpx 70rpx; overflow: hidden; flex-wrap: wrap; /* border: 1px solid red; */ } .menuItem { width: 100rpx; height: 100rpx; margin-right: auto; position: relative; } .menuItem .icon { width: 50rpx; height: 50rpx; margin: auto; display: block; } .menuItem .tit { font-size: 24rpx; color: #666666; text-align: center; margin-top: 20rpx; } .menuItem .dot { width: 68rpx; height: 34rpx; background: #FF663D; border-radius: 19rpx 19rpx 19rpx 0px; position: absolute; right: -20rpx; top: -20rpx; font-size: 22rpx; color: #FFFFFF; text-align: center; line-height: 34rpx; } .active .message { width: 702rpx; height: 134rpx; background: #FFFFFF; border-radius: 12rpx; margin: auto; position: relative; top: -20rpx; padding: 0 25rpx; } .active .message .num { font-size: 40rpx; font-family: HelveticaNeue-Medium, HelveticaNeue; font-weight: 500; color: #191C27; text-align: center; } .active .message .line { width: 1rpx; height: 86rpx; background: #EDEDED; } .active .message .tips { text-align: center; font-size: 26rpx; color: #666666; } .active .contioner { width: 702rpx; background: #FFFFFF; border-radius: 12rpx; margin: 0 auto 25rpx; padding: 25rpx; } .contioner .titText { font-size: 32rpx; font-weight: 500; color: #191C27; } .kf button{ position: absolute; width: 132rpx; height: 132rpx; opacity: 0; } .section10 { height: 386rpx; border-radius: 16rpx; background-color: rgba(255,255,255,1); width: 690rpx; display: flex; flex-direction: column; } .layer1 { width: 405rpx; height: 60rpx; flex-direction: row; display: flex; justify-content: space-between; margin: 20rpx 0 0 265rpx; } .txt5 { width: 160rpx; height: 32rpx; display: block; overflow-wrap: break-word; color: rgba(51,51,51,1); font-size: 32rpx; font-family: PingFangSC-Medium; white-space: nowrap; line-height: 32rpx; text-align: left; margin-top: 28rpx; } .icon2 { width: 32rpx; height: 32rpx; } .layer2 { width: 390rpx; height: 26rpx; display: flex; flex-direction: row; margin: 32rpx 0 0 150rpx; } .txt6 { width: 390rpx; height: 26rpx; display: block; overflow-wrap: break-word; color: rgba(153,153,153,1); font-size: 26rpx; font-family: PingFangSC-Regular; white-space: nowrap; line-height: 26rpx; text-align: left; } .layer3 { width: 580rpx; height: 120rpx; display: flex; flex-direction: row; margin: 64rpx 0 64rpx 55rpx; } .pic2 { width: 580rpx; height: 120rpx; display: flex; flex-flow: row nowrap; justify-content: space-between; position: relative; } .cover{ position: fixed; left: 0; top: 0; width: 100%; height: 100%; /* z-index: 99999; */ background: rgba(0,0,0,.3); display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; } .pic2 .input{ background: #f2f2f2; color: #222; width: 14%; height: 100rpx; line-height: 100rpx; text-align: center; } .pic2 input{ position: absolute; height: 100rpx; line-height: 100rpx; opacity: 0; width: 200%; color: #fff0; caret-color: #FFF; left: -100%; top: 0; }