126 lines
2.6 KiB
Vue
126 lines
2.6 KiB
Vue
<template>
|
||
<view>
|
||
<form>
|
||
<!-- 副标题 -->
|
||
<view class="sub-title">输入您的钱包助记词导入</view>
|
||
<!-- 助记词 -->
|
||
<view class="word">
|
||
<textarea placeholder="输入助记词"></textarea>
|
||
</view>
|
||
<!-- 设置钱包密码 -->
|
||
<view class="password">
|
||
<view class="group">
|
||
<view class="inputs">
|
||
<label>钱包名称</label>
|
||
<input type="text" placeholder="输入钱包名称" />
|
||
</view>
|
||
</view>
|
||
<view class="title">不少于8个字符。建议包含大小写，符号，特殊字符。</view>
|
||
<view class="group">
|
||
<view class="inputs">
|
||
<label>密码</label>
|
||
<input type="password" placeholder="请设置密码" />
|
||
</view>
|
||
<view class="inputs">
|
||
<label>确认密码</label>
|
||
<input type="password" placeholder="请确认密码" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 按钮 -->
|
||
<view class="buttons">
|
||
<view class="text">什么是助记词？</view>
|
||
<button type="default" form-type="submit">开始导入</button>
|
||
</view>
|
||
</form>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
|
||
}
|
||
},
|
||
methods: {
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
// 副标题
|
||
.sub-title{
|
||
line-height: 90rpx;
|
||
color: $text-gray;
|
||
text-align: center;
|
||
margin: $margin;
|
||
font-size: $title-size-m;
|
||
}
|
||
// 助记词
|
||
.word{
|
||
background-color: white;
|
||
margin: $margin * 2;
|
||
padding: $padding + 10;
|
||
border-radius: $radius-m;
|
||
box-shadow: 0 0 4rpx 4rpx rgba($color: $text-color, $alpha: .02);
|
||
& textarea{
|
||
height: 200rpx;
|
||
}
|
||
}
|
||
// 设置密码
|
||
.password{
|
||
padding: 0 $padding * 2;
|
||
.title{
|
||
margin-top: $margin * 2;
|
||
font-size: $title-size-m;
|
||
color: $mian-color;
|
||
}
|
||
.group{
|
||
margin-top: $margin;
|
||
border-radius: $radius-m;
|
||
box-shadow: 0 0 4rpx 4rpx rgba($color: $text-color, $alpha: .02);
|
||
background-color: white;
|
||
.inputs{
|
||
padding: $padding $padding + 10;
|
||
border-bottom: solid 1rpx $border-color;
|
||
&:last-child{
|
||
border-bottom: none;
|
||
}
|
||
label{
|
||
color: $text-gray;
|
||
font-size: $title-size-m;
|
||
}
|
||
input{
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
font-size: $title-size;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// 按钮
|
||
.buttons{
|
||
padding: $padding * 2;
|
||
.text{
|
||
text-align: center;
|
||
line-height: 90rpx;
|
||
height: 90rpx;
|
||
margin-bottom: $margin * 2;
|
||
font-size: $title-size-lg;
|
||
color: $mian-color;
|
||
font-weight: bold;
|
||
}
|
||
button{
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
background-color: $mian-color;
|
||
border-radius: $radius-lg;
|
||
color: white;
|
||
font-weight: bold;
|
||
font-size: $title-size;
|
||
}
|
||
}
|
||
</style>
|