@ -0,0 +1,198 @@ |
|||||
|
<template> |
||||
|
<view class="phone_code"> |
||||
|
<text class="phone_code_label">验证码已发送至</text> |
||||
|
<view class="phone_code_count"> |
||||
|
<text class="phone_code_count_new">{{ newPhone }}</text> |
||||
|
<view v-if="isReget" class="phone_code_count_reget"> |
||||
|
<button plain="true" type="warn" size="mini" @click="getCode">重新获取</button> |
||||
|
</view> |
||||
|
<text v-else class="phone_code_count_down">获取验证码<text>{{count}}</text>s</text> |
||||
|
</view> |
||||
|
<view class="phone_code_single"> |
||||
|
<input class="phone_code_single_cinput" adjust-position="false" auto-blur="true" @blur="codeNumBlurFun" |
||||
|
@input="codeNumInputFun" :focus="focus" v-model="code" type="number" maxlength="6" /> |
||||
|
<view class="phone_code_single_codeinput"> |
||||
|
<view v-for="(item,index) in 6" :key="index" @click="codefocusFun(index)" |
||||
|
:style="(index == code.length? 'background-color:#FEF2F2;':'color: #313131;background-color:#eee')"> |
||||
|
{{code[index]}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<button :disabled="isCode" class="btn" type="warn" @click="submitFun()">确定</button> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
newPhone: "167****8898", // 当前显示电话 |
||||
|
isReget: false, // 判断是否显示 ‘重新获取’按钮 |
||||
|
timer: null, // 定时器 |
||||
|
count: 60, // 时间 |
||||
|
code:"", // 验证码 |
||||
|
focus:true, // 焦点 |
||||
|
isCode:true // ‘确定’按钮是否禁用 |
||||
|
} |
||||
|
}, |
||||
|
onLoad(options) { |
||||
|
this.getTimer() // 开启定时器 |
||||
|
this.getCode() // 获取验证码 |
||||
|
}, |
||||
|
watch: { |
||||
|
count(val) { |
||||
|
if (val == 0) { |
||||
|
this.isReget = true |
||||
|
clearInterval(this.timer) |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
methods: { |
||||
|
/** |
||||
|
* AUTHOR: 单乘风 |
||||
|
* DESC: 定时器 |
||||
|
* */ |
||||
|
getTimer() { |
||||
|
this.timer = setInterval(() => { |
||||
|
if (this.count == 0) { |
||||
|
clearInterval(this.timer) |
||||
|
uni.navigateBack({ |
||||
|
delta: 1 |
||||
|
}) |
||||
|
return |
||||
|
} |
||||
|
this.count-- |
||||
|
}, 1000) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* AUTHOR: 单乘风 |
||||
|
* DESC: 获取验证码 |
||||
|
* */ |
||||
|
getCode() { |
||||
|
console.log("获取验证码", this.newPhone) |
||||
|
if (this.count == 0) { |
||||
|
this.count = 60 |
||||
|
this.isReget = false |
||||
|
this.getTimer() |
||||
|
} |
||||
|
}, |
||||
|
/** |
||||
|
* AUTHOR: 单乘风 |
||||
|
* DESC: 输入框输入事件 |
||||
|
* */ |
||||
|
codeNumInputFun(e) { |
||||
|
let val = e.detail.value |
||||
|
this.code = val |
||||
|
if (val.length == 6) this.isCode = false |
||||
|
else this.isCode = true |
||||
|
}, |
||||
|
/** |
||||
|
* AUTHOR: 单乘风 |
||||
|
* DESC: 输入框失去焦点事件 |
||||
|
* */ |
||||
|
codeNumBlurFun(e) { |
||||
|
let val = e.detail.value |
||||
|
this.focus = false |
||||
|
if (val.length == 6) this.isCode = false |
||||
|
else this.isCode = true |
||||
|
}, |
||||
|
/** |
||||
|
* AUTHOR: 单乘风 |
||||
|
* DESC: 输入框点击事件 |
||||
|
* @param {Number} index 当前点击框索引 |
||||
|
* */ |
||||
|
codefocusFun(index) { |
||||
|
this.focus = true |
||||
|
}, |
||||
|
/** |
||||
|
* AUTHOR: 单乘风 |
||||
|
* DESC: 按钮点击事件 |
||||
|
* */ |
||||
|
submitFun() { |
||||
|
console.log("确认更换手机号") |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.phone { |
||||
|
background-color: #FFF; |
||||
|
width: 100vw; |
||||
|
height: 100vh; |
||||
|
|
||||
|
&_code { |
||||
|
padding: 30rpx; |
||||
|
|
||||
|
&_label { |
||||
|
font-size: 30rpx; |
||||
|
color: #999; |
||||
|
} |
||||
|
|
||||
|
&_count { |
||||
|
margin-top: 30rpx; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
height: 100rpx; |
||||
|
|
||||
|
&_new { |
||||
|
color: #e64340; |
||||
|
font-size: 38rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
&_down { |
||||
|
border: 1rpx solid #eee; |
||||
|
border-radius: 10rpx; |
||||
|
color: #999; |
||||
|
height: 60rpx; |
||||
|
line-height: 60rpx; |
||||
|
padding: 0 20rpx; |
||||
|
|
||||
|
text { |
||||
|
margin-left: 10rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&_single { |
||||
|
margin-top: 30rpx; |
||||
|
|
||||
|
&_cinput { |
||||
|
position: fixed; |
||||
|
left: -100rpx; |
||||
|
width: 50rpx; |
||||
|
height: 50rpx; |
||||
|
} |
||||
|
|
||||
|
&_codeinput { |
||||
|
margin: auto; |
||||
|
width: 650rpx; |
||||
|
height: 100rpx; |
||||
|
display: flex; |
||||
|
} |
||||
|
|
||||
|
&_codeinput>view { |
||||
|
margin-top: 5rpx; |
||||
|
margin-left: 15rpx; |
||||
|
width: 86rpx; |
||||
|
height: 86rpx; |
||||
|
line-height: 86rpx; |
||||
|
font-size: 60rpx; |
||||
|
font-weight: bold; |
||||
|
color: #313131; |
||||
|
text-align: center; |
||||
|
border-radius: 10rpx; |
||||
|
} |
||||
|
|
||||
|
&_codeinput>view:nth-child(1) { |
||||
|
margin-left: 0rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,508 @@ |
|||||
|
<template> |
||||
|
<view class="container"> |
||||
|
<!-- 头部 --> |
||||
|
<view class="headzone"> |
||||
|
<!-- 头像 --> |
||||
|
<view class="avtarzone"> |
||||
|
<view class="avatar-bg"> |
||||
|
<image class="avatar" mode="aspectFit" src="../static/tx.svg"></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 用户信息 --> |
||||
|
<view class="ubinfo"> |
||||
|
<view class="ubi-uname">用户名</view> |
||||
|
<view class="ubi-verify"> |
||||
|
<view class="mbtxt">手机号:13812345678</view> |
||||
|
<view class="mbstatus verify" v-if="hasverify">认证</view> |
||||
|
<view class="mbstatus unverfiy" v-else>未认证</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 服务状态 --> |
||||
|
<view class="devinfo"> |
||||
|
<view class="dev-txt" :class="hasverify?'verify':'unverfiy'">有效期: 0个月</view> |
||||
|
<view class="dev-txt" :class="hasverify?'verify':'unverfiy'">设备数: 0台</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 交易中心的快速连接 --> |
||||
|
<view class="gtcenter"> |
||||
|
<view class="gttxt">全国文化大数据交易中心</view> |
||||
|
<view class="gtlinks">快速跳转</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 服务内容 --> |
||||
|
<view class="fwnr"> |
||||
|
<!-- // first --> |
||||
|
<view class="fw-one"> |
||||
|
<view class="fwo-item"> |
||||
|
<view class="fwulb"> |
||||
|
<text class="fwname">订购服务</text> |
||||
|
<text class="fwnote">服务开通/续费</text> |
||||
|
</view> |
||||
|
<image class="fwubg" src="../static/dgfw.svg"></image> |
||||
|
</view> |
||||
|
<view class="fwo-item"> |
||||
|
<view class="fwulb"> |
||||
|
<text class="fwname">入网信息</text> |
||||
|
<text class="fwnote">信息登记/修改</text> |
||||
|
</view> |
||||
|
<image class="fwubg" src="../static/rwxx.svg"></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 我的订单 --> |
||||
|
<view class="my-service"> |
||||
|
<view class="service-title">我的订单</view> |
||||
|
<view class="service-content clearfix"> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/m_dzf.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">待支付</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/m_dsh.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">待审核</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/m_ywc.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">已完成</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/m_qbdd.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">全部订单</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 其他工具 --> |
||||
|
<view class="othtools"> |
||||
|
<view class="service-title">其他工具</view> |
||||
|
<view class="service-content clearfix"> |
||||
|
<!-- 生效记录 --> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/t_sxjl.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">生效记录</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<!-- 我的发票 --> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/t_wdfp.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">我的发票</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<!-- 我的设备 --> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/t_wdsb.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">我的设备</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<!-- 检查开关 --> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/t_jckg.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">检查开关</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<!-- 设置密码 --> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/t_szmm.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">设置密码</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<!-- 系统帮助 --> |
||||
|
<block> |
||||
|
<view class="service-item"> |
||||
|
<view class="item-icon"> |
||||
|
<image class="icon-img" src="../static/t_xtbz.svg"></image> |
||||
|
</view> |
||||
|
<view class="item-name">系统帮助</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
<!-- LOGOUT --> |
||||
|
<!-- 退出登录 --> |
||||
|
<view v-if="isLogin" class="my-logout"> |
||||
|
<view class="logout-btn" @click="handleLogout()"> |
||||
|
<text>退出登录</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
//认证标识 |
||||
|
hasverify: false, |
||||
|
// |
||||
|
isLogin: true, |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
// 退出登录 |
||||
|
handleLogout() { |
||||
|
const app = this |
||||
|
uni.showModal({ |
||||
|
title: '友情提示', |
||||
|
content: '您确定要退出登录吗?', |
||||
|
success(res) { |
||||
|
if (res.confirm) { |
||||
|
store.dispatch('Logout', {}) |
||||
|
.then(result => app.onRefreshPage()) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.container { |
||||
|
position: relative; |
||||
|
background-color: #F4F4F4; |
||||
|
} |
||||
|
|
||||
|
.headzone { |
||||
|
background-color: #0F476E; |
||||
|
// height: 460rpx; |
||||
|
height: 28vh; |
||||
|
width: 100%; |
||||
|
padding: 10%; |
||||
|
// margin-bottom: 22rpx; |
||||
|
display: flex; |
||||
|
flex-wrap: wrap; |
||||
|
|
||||
|
// 黄色的圆 |
||||
|
.avtarzone { |
||||
|
background-color: #FEBD45; |
||||
|
width: 200rpx; |
||||
|
height: 200rpx; |
||||
|
border-radius: 50%; |
||||
|
text-align: center; |
||||
|
float: left; |
||||
|
margin: 0 auto; |
||||
|
|
||||
|
|
||||
|
//白色的圆 |
||||
|
.avatar-bg { |
||||
|
float: left; |
||||
|
background-color: #fff; |
||||
|
width: 160rpx; |
||||
|
height: 160rpx; |
||||
|
border-radius: 50%; |
||||
|
margin: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.avatar { |
||||
|
display: inline-block; |
||||
|
margin: 13rpx; |
||||
|
width: 140rpx; |
||||
|
height: 140rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.ubinfo { |
||||
|
color: #fff; |
||||
|
width: 64% !important; |
||||
|
float: left; |
||||
|
margin-left: 16rpx; |
||||
|
|
||||
|
.ubi-uname { |
||||
|
font-size: 36rpx; |
||||
|
font-weight: 600; |
||||
|
} |
||||
|
|
||||
|
//用户认证状态 |
||||
|
.ubi-verify { |
||||
|
margin-top: 20rpx; |
||||
|
height: 36rpx; |
||||
|
line-height: 36rpx; |
||||
|
|
||||
|
.mbtxt { |
||||
|
display: block; |
||||
|
float: left; |
||||
|
width: 74%; |
||||
|
} |
||||
|
|
||||
|
.mbstatus { |
||||
|
display: block; |
||||
|
float: left; |
||||
|
width: 26%; |
||||
|
text-align: center; |
||||
|
padding: 0 5rpx 0; |
||||
|
height: 100%; |
||||
|
line-height: 100%; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.devinfo { |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
width: 100%; |
||||
|
margin-top: 26rpx; |
||||
|
height: 48rpx; |
||||
|
line-height: 42rpx; |
||||
|
text-align: center; |
||||
|
color: #efefef; |
||||
|
|
||||
|
.dev-txt { |
||||
|
margin-left: 22rpx; |
||||
|
width: 42%; |
||||
|
float: left; |
||||
|
padding-left: 10rpx; |
||||
|
padding-right: 10rpx; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
// 状态类 |
||||
|
.unverfiy { |
||||
|
background-color: #CECECE; |
||||
|
border: 1rpx solid #CECECE; |
||||
|
} |
||||
|
|
||||
|
.verify { |
||||
|
background-color: #C6A94D; |
||||
|
border: 1rpx solid #C6A94D; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// 快速连接 |
||||
|
.gtcenter { |
||||
|
position: absolute; |
||||
|
top: 400rpx; |
||||
|
left: 5%; |
||||
|
width: 90%; |
||||
|
height: 88rpx; |
||||
|
background-color: #FEBD45; |
||||
|
// margin: 0 auto; |
||||
|
border-radius: 44rpx; |
||||
|
padding: 0 10rpx 0; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
border: #034373; |
||||
|
box-shadow: 1rpx soild #0F476E; |
||||
|
|
||||
|
.gttxt { |
||||
|
color: #034373; |
||||
|
font-size: 40rpx; |
||||
|
font-weight: 800; |
||||
|
line-height: 88rpx; |
||||
|
padding-left: 26rpx; |
||||
|
} |
||||
|
|
||||
|
.gtlinks { |
||||
|
background-color: #F9DE8F; |
||||
|
height: 48rpx; |
||||
|
line-height: 46rpx; |
||||
|
margin-top: 14rpx; |
||||
|
margin-left: 16rpx; |
||||
|
padding: 0 20rpx 0 20rpx; |
||||
|
border-radius: 38%; |
||||
|
border: #F9DE8F; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// 服务内容 |
||||
|
.fwnr { |
||||
|
margin-top: 60rpx; |
||||
|
background-color: #f4f4f4; |
||||
|
min-height: 82vh; |
||||
|
|
||||
|
// |
||||
|
.fw-one { |
||||
|
// height: 96rpx; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
margin: 10rpx auto; |
||||
|
|
||||
|
.fwo-item { |
||||
|
width: 42%; |
||||
|
height: 206rpx; |
||||
|
border-radius: 12%; |
||||
|
margin-left: 5%; |
||||
|
background-color: #fff; |
||||
|
|
||||
|
.fwulb { |
||||
|
margin-top: 60rpx; |
||||
|
margin-left: 20rpx; |
||||
|
height: 60rpx; |
||||
|
display: block; |
||||
|
float: left; |
||||
|
width: 60%; |
||||
|
|
||||
|
.fwname { |
||||
|
display: flex; |
||||
|
font-size: 32rpx; |
||||
|
color: #034373; |
||||
|
font-weight: 800; |
||||
|
} |
||||
|
|
||||
|
.fwnote { |
||||
|
font-size: 22rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// background image |
||||
|
.fwubg { |
||||
|
margin-top: 60rpx; |
||||
|
width: 102rpx; |
||||
|
height: 102rpx; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
// 我的服务 |
||||
|
.my-service { |
||||
|
margin: 22rpx auto 22rpx auto; |
||||
|
padding: 22rpx 0; |
||||
|
width: 94%; |
||||
|
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05); |
||||
|
border-radius: 20rpx; |
||||
|
background: #fff; |
||||
|
|
||||
|
.service-title { |
||||
|
padding-left: 24rpx; |
||||
|
margin-bottom: 20rpx; |
||||
|
font-size: 30rpx; |
||||
|
} |
||||
|
|
||||
|
.service-content { |
||||
|
margin-bottom: -20rpx; |
||||
|
|
||||
|
.service-item { |
||||
|
position: relative; |
||||
|
width: 25%; |
||||
|
float: left; |
||||
|
margin-bottom: 30rpx; |
||||
|
|
||||
|
.item-icon { |
||||
|
text-align: center; |
||||
|
margin: 0 auto; |
||||
|
padding: 14rpx 0; |
||||
|
color: #ff3800; |
||||
|
font-size: 44rpx; |
||||
|
} |
||||
|
|
||||
|
.icon-img { |
||||
|
width: 62rpx; |
||||
|
height: 62rpx; |
||||
|
} |
||||
|
|
||||
|
.item-name { |
||||
|
font-size: 28rpx; |
||||
|
color: #545454; |
||||
|
text-align: center; |
||||
|
margin-right: 10rpx; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// |
||||
|
.othtools { |
||||
|
margin: 22rpx auto 22rpx auto; |
||||
|
padding: 22rpx 0; |
||||
|
width: 94%; |
||||
|
box-shadow: 0 1rpx 5rpx 0px rgba(0, 0, 0, 0.05); |
||||
|
border-radius: 20rpx; |
||||
|
background: #fff; |
||||
|
|
||||
|
.service-title { |
||||
|
padding-left: 24rpx; |
||||
|
margin-bottom: 20rpx; |
||||
|
font-size: 30rpx; |
||||
|
} |
||||
|
|
||||
|
.service-content { |
||||
|
margin-bottom: -20rpx; |
||||
|
|
||||
|
.service-item { |
||||
|
position: relative; |
||||
|
width: 25%; |
||||
|
float: left; |
||||
|
margin-bottom: 30rpx; |
||||
|
|
||||
|
.item-icon { |
||||
|
text-align: center; |
||||
|
margin: 0 auto; |
||||
|
padding: 14rpx 0; |
||||
|
color: #ff3800; |
||||
|
font-size: 44rpx; |
||||
|
} |
||||
|
|
||||
|
.icon-img { |
||||
|
width: 62rpx; |
||||
|
height: 62rpx; |
||||
|
} |
||||
|
|
||||
|
.item-name { |
||||
|
font-size: 28rpx; |
||||
|
color: #545454; |
||||
|
text-align: center; |
||||
|
margin-right: 10rpx; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
// 退出登录 |
||||
|
.my-logout { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
margin-top: 50rpx; |
||||
|
|
||||
|
.logout-btn { |
||||
|
width: 60%; |
||||
|
margin: 0 auto; |
||||
|
font-size: 28rpx; |
||||
|
color: #fff; |
||||
|
background-color: #0F476E; |
||||
|
border-radius: 20rpx; |
||||
|
border: 1px solid #dcdcdc; |
||||
|
padding: 16rpx 0; |
||||
|
text-align: center; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
|
After Width: | Height: | Size: 764 B |
|
After Width: | Height: | Size: 435 B |
|
After Width: | Height: | Size: 546 B |
|
After Width: | Height: | Size: 912 B |
|
After Width: | Height: | Size: 495 B |
|
After Width: | Height: | Size: 601 B |
|
After Width: | Height: | Size: 550 B |
|
After Width: | Height: | Size: 757 B |
|
After Width: | Height: | Size: 630 B |
|
After Width: | Height: | Size: 890 B |
|
After Width: | Height: | Size: 435 B |
|
After Width: | Height: | Size: 542 B |
|
After Width: | Height: | Size: 597 B |
|
After Width: | Height: | Size: 659 B |