init

pages_tool/member/public/css/balance.scss

@@ -0,0 +1,212 @@
+.custom-navbar {
+	width: 100vw;
+	padding-bottom: 20rpx;
+	position: fixed;
+	left: 0;
+	top: 0;
+	z-index: 100;
+	background: unset;
+	
+	// #ifdef MP-WEIXIN
+	background-size: 100% 380rpx;
+	// #endif
+	
+	.navbar-wrap {
+		position: relative;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 100%;
+		height: 100%;
+	}
+	
+	.navbar-title {
+		color: #fff;
+		font-size: 32rpx;
+		font-weight: 600;
+	}
+	
+	.back {
+		position: absolute;
+		color: #fff;
+		left: 30rpx;
+		font-size: 40rpx;
+	}
+}
+
+.custom-navbar-block {
+	padding-bottom: 20rpx;
+}
+
+.head-wrap {
+	// width: 100vw;
+	background-size: 100%;
+	padding: 32rpx 28rpx; 
+	box-sizing: border-box;
+	// border-radius: 0 0 100% 100%/0 0 70rpx 70rpx;
+	overflow: hidden;
+	margin: 24rpx 28rpx;
+	border-radius: 24rpx;
+	// #ifdef MP-WEIXIN
+	padding-top: 160rpx;
+	// #endif
+	height: 352rpx;
+	.title {
+		text-align: left;
+		line-height: 1;
+		color: #F6F6F6;
+		margin-bottom: 24rpx;
+	}
+	
+	.balance {
+		color: var(--btn-text-color);
+		text-align: left;
+		line-height: 1;
+		margin-bottom: 20rpx;
+		// font-size: 64rpx;
+		font-size: 80rpx;
+		line-height: 112rpx;
+		font-weight: 500 !important;
+
+		font-family: PingFang SC;
+	}
+	
+	.flex-box {
+		display: flex;
+		margin-top: 56rpx;
+		
+		.flex-item {
+			flex: 1;
+			
+			.num {
+				font-size: 34rpx;
+				margin-bottom: 20rpx;
+				color: #fff;
+				white-space: nowrap;
+				text-overflow: ellipsis;
+				overflow: hidden;
+			}
+			
+			view {
+				text-align: left;
+				color: #F6F6F6;
+				line-height: 1;
+			}
+		}
+	}
+	.btns{
+	    display: -webkit-box;
+	    display: -webkit-flex;
+	    display: flex;
+	    -webkit-flex-wrap: nowrap;
+	    flex-wrap: nowrap;
+	    position: relative;
+	    gap: 22rpx;
+	    margin-top: 32rpx;
+		.btn{
+		    -webkit-box-flex: 1;
+		    -webkit-flex: 1;
+		    flex: 1;
+		    display: -webkit-box;
+		    display: -webkit-flex;
+		    display: flex;
+		    -webkit-box-pack: center;
+		    -webkit-justify-content: center;
+		    justify-content: center;
+		    -webkit-box-align: center;
+		    -webkit-align-items: center;
+		    align-items: center;
+		    height: 80rpx;
+		    box-sizing: border-box;
+		    font-size: 32rpx;
+		    -webkit-flex-shrink: 0;
+		    flex-shrink: 0;
+		    text-align: center;
+		    font-family: PingFang SC;
+		    border-radius: 180rpx;
+		    background: transparent;
+		    color: #fff;
+		    font-style: normal;
+		    font-weight: 500;
+		    line-height: normal;
+		    border: 2rpx solid #fff;
+			:nth-child(2) {
+			    background: #fff;
+			    color: #4285f8;
+			}
+		}
+		.recharge{
+		    background: #fff;
+		    color: #4285f8;
+		}
+	}
+}
+
+.menu-wrap {
+	border-radius: 20rpx;
+	margin: 0 24rpx;
+	padding: 0 24rpx;
+	background: #fff;
+	// transform: translateY(-90rpx);
+	
+	.menu-item {
+		display: flex;
+		align-items: center;
+		padding: 4rpx 0;
+		
+		.icon {
+			height: 80rpx;
+			border-radius: 20rpx;
+			display: flex;
+			align-items: center;
+			color: #fff;
+			margin-right: 20rpx;
+			
+			.iconfont {
+				font-size: 46rpx;
+				-webkit-background-clip: text !important;
+				-webkit-text-fill-color: transparent;
+				background: linear-gradient(135deg, #FE7849 0%, #FF1959 100%);
+			}
+		}
+		
+		.title {
+			font-size: 28rpx;
+			color: #333333;
+			flex: 1;
+		}
+		
+		.iconright {
+			font-size: 28rpx;
+		}
+	}
+}
+
+.action {
+	position: fixed;
+	width: 100vw;
+	left: 0;
+	bottom: 0;
+	padding-bottom: 100rpx;
+	
+	view {
+		width: calc(100vw - 64rpx);
+		height: 80rpx;
+		line-height: 80rpx;
+		border-radius: 80rpx;
+		margin: 0 auto 30rpx auto;
+		text-align: center;
+		color: #fff;
+		font-size: 32rpx;
+	}
+	.recharge-withdraw {
+		background: #FF4646;
+	}
+	
+	.withdraw {
+		border: 4rpx solid #FF4646;
+		box-sizing: border-box;
+		line-height: 72rpx;
+		color: #FF4646;
+	}
+}