showBankCard.vue 1.61 KB
<template>
	<v-layout id="lendTotle" column justify-center align-center>
		<v-container fluid class="pa-0">
			<v-layout row wrap align-center>
				<v-flex xs12 sm6>
					<div class="text-xs-center">
						<div>
							<v-btn color="error" class="text" large>
								
								<h3>招商银行 </h3>
								<h3>**** **** **** 1190</h3>
							</v-btn>
						</div>
					</div>
				</v-flex>
			</v-layout>
			<v-card id="BorrowList" flat>
				<v-list class="list">
					<v-list-tile>
						<v-list-tile-content class="BorrowListTitle">&nbsp;&nbsp;&nbsp;+&nbsp;添加银行卡 </v-list-tile-content>
						<v-list-tile-action>
							<v-icon class="BorrowListArrow">keyboard_arrow_right</v-icon>
						</v-list-tile-action>
					</v-list-tile>
				</v-list>
			</v-card>
		</v-container>

			
	</v-layout>

</template>

<script>
</script>

<style lang="scss">
	.text {
		background-image: linear-gradient(-113deg, #DAB269 11%, #F1CE8F 43%, #ECB653 100%);
		border-radius: 10px;
		float: left;
		width: 21.4rem;
		height: 5.45rem;
		margin: 1.05rem;
		font-weight: 300;
		p{
			font-weight: 800;
		}
	}
	
	#BorrowList {
		width: 100vw;
		margin-top: 1.1rem;
		border-top: 1px solid #979797;
		.list {
			padding: 0;
			background-color: $toolbar-grey;
			li {
				height: 2.1rem;
				div.list__tile {
					height: 2.1rem;
					color: $light-gold;
					padding: 0 0.8rem;
					border-bottom: 1px solid #979797;
				}
			}
			.BorrowListTitle {
				font-size: 15px;
				font-weight: 500;
			}
			.BorrowListArrow {
				font-size: 1rem;
				color: $light-gold;
			}
		}
	}
</style>