会员模块

pages/member/index.wxss

@@ -0,0 +1,241 @@
+/* 头部 */
+.Usetop {
+    width: 100%;
+    position: relative;
+    padding-top: 42%;
+}
+
+.Usetop-back,
+.Usetop-range {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+}
+
+.Usetop-back {
+    z-index: 1;
+}
+
+.Usetop-range {
+    z-index: 2;
+}
+
+.Usetop-cont {
+    padding: 20rpx 0 0 50rpx;
+    box-sizing: border-box;
+    display: flex;
+}
+
+.Usetop-head {
+    width: 100rpx;
+    height: 100rpx;
+    border-radius: 50%;
+    border: 6rpx solid #ffffff;
+    position: relative;
+}
+
+.Usetop-head-avatar {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+}
+
+.Usetop-text {
+    width: calc(100% - 110rpx);
+    padding: 0 30rpx;
+    box-sizing: border-box;
+}
+
+.Usetop-text-name {
+    font-size: 36rpx;
+    display: flex;
+    margin-top: 6rpx;
+}
+
+.Usetop-text image {
+    width: 130rpx;
+    margin-left:20rpx;
+    vertical-align: middle;
+}
+
+.Usetop-text-time {
+    font-size: 28rpx;
+    margin-top: 10rpx;
+}
+
+/* 公告 */
+.notice {
+    padding: 0 30rpx;
+    box-sizing: border-box;
+}
+
+.notice-cont {
+    background-color: #ffffff;
+    border-radius: 80rpx;
+    padding: 20rpx 30rpx;
+    box-sizing: border-box;
+    box-shadow: 0rpx 3rpx 20rpx 4rpx rgba(13, 81, 177, .05);
+    height: 100rpx;
+}
+
+.notice-cont-swiper {
+    height: 100%;
+}
+
+.notice-cont-avatar {
+    width: 60rpx;
+    height: 60rpx;
+    border-radius: 50%;
+}
+
+.swiper-item {
+    display: flex;
+    font-size: 28rpx;
+    line-height: 64rpx;
+}
+
+.notice-cont-name {
+    width: calc(100% - 60rpx);
+    padding-left: 20rpx;
+    box-sizing: border-box;
+}
+
+.notice-cont-name text {
+    color: #3b7cff;
+}
+
+/* 权益 */
+.interest {
+    padding: 0 15rpx 30rpx;
+    box-sizing: border-box;
+}
+
+.interest-title {
+    text-align: center;
+    color: #4683ff;
+    font-size: 34rpx;
+}
+
+.interest-cont {
+    padding: 40rpx 0;
+}
+
+.monsterPart-list {
+    width: 100%;
+    white-space: nowrap;
+    padding-bottom: 30rpx;
+}
+
+.interest-label {
+    display: inline-block;
+    font-size: 26rpx;
+    text-align: center;
+    margin: 0 20rpx;
+}
+
+.interest-label-icon {
+    width: 120rpx;
+}
+
+.interest-tab {
+    position: relative;
+    padding: 40rpx 0 30rpx;
+    box-sizing: border-box;
+}
+
+.interest-tab::after {
+    position: absolute;
+    content: '';
+    left: 15rpx;
+    top: 0;
+    width: calc(100% - 30rpx);
+    height: 2rpx;
+    background-color: #f1f4f9;
+}
+
+.interest-tab-title {
+    font-weight: 600;
+    font-size: 34rpx;
+    padding: 0 15rpx;
+}
+
+.interest-tab-item {
+    margin-top: 30rpx;
+    display: flex;
+}
+
+.interest-tab-label {
+    flex: 3;
+    text-align: center;
+    box-shadow: 0rpx 0rpx 20rpx 4rpx rgba(13, 81, 177, .05);
+    margin: 0 15rpx;
+    padding: 30rpx 0;
+    box-sizing: border-box;
+    border-radius: 20rpx;
+    font-size: 30rpx;
+    border: 4rpx solid #ffffff;
+}
+
+.interest-tab-label.active {
+    border-color: #3b7cff;
+}
+
+.interest-tab-name {
+    color: #666666;
+    font-size: 24rpx;
+}
+
+.interest-tab-number {
+    color: #3b7cff;
+    margin: 20rpx 0;
+    font-size: 40rpx;
+    font-weight: 600;
+}
+
+.interest-tab-number text {
+    font-size: 26rpx;
+    font-weight: normal;
+}
+
+.interest-tab-text {
+    font-size: 26rpx;
+    color: #999999;
+}
+
+/* 按钮 */
+.open {
+    padding: 0 30rpx 30rpx;
+    box-sizing: border-box;
+}
+
+.open-btn {
+    width: 100%;
+    line-height: 100rpx;
+    background-color: #3b7cff;
+    color: #ffffff;
+    border-radius: 60rpx;
+    overflow: hidden;
+    text-align: center;
+    font-size: 34rpx;
+}
+
+.open-btn.active {
+    background-color: rgb(156, 156, 156);
+}
+
+.seeCause {
+    text-align: center;
+    line-height: 90rpx;
+    font-size: 28rpx;
+    color: #8a5400;
+    text-decoration: underline;
+}
+
+.open-btn text {
+    padding-right: 20rpx;
+    font-weight: 600;
+}