Skip to content

肖康 / H5_2.0

Go to a project
Commit 8595c7fc by LJM
Options

css

parent 6f3d060a
Inline Side-by-side
Showing with 174 additions and 34 deletions
assets/css/mine/forget.scss
.page-forget { .page-forget {
padding: 16rpx 0 0 0;
box-sizing: border-box;
.tip { .tip {
margin: 0 24rpx;
padding: 14rpx 0 0 24rpx;
height: 90rpx;
background: #fff8f2;
border-radius: 0rpx 30rpx 30rpx 30rpx;
.iconfont {
font-size: 32rpx;
color: #f98119;
margin-right: 16rpx;
}
.tt {
width: 702rpx;
font-size: 22rpx;
color: #f98119;
}
}
.step {
margin: 40rpx 24rpx 40rpx 24rpx;
.box {
position: relative;
margin-right: 16rpx;
width: 33.3%;
&:last-child {
margin-right: 0;
}
.line {
width: 100%;
height: 4rpx;
background: #f0f0f2;
border-radius: 2rpx;
}
.tt {
margin-top: 10rpx;
font-size: 22rpx;
color: #919399;
}
&.curr {
.line {
background-color: #1969f9;
}
.tt {
color: #484b59;
font-weight: bold;
}
}
}
}
.input-box {
height: 88rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin: 0 60rpx;
&.mobile {
.picker-box {
padding-left: 24rpx;
padding-right: 16rpx;
width: 159rpx;
height: 40rpx;
border-right: 1px solid #c2c4cc;
.uni-input {
font-size: 26rpx;
color: #484b59;
}
.iconfont {
font-size: 32rpx;
}
}
.text {
padding-right: 24rpx;
font-size: 26rpx;
color: #1969f9;
white-space: nowrap;
}
.uni-input {
font-size: 26rpx;
text-indent: 23rpx;
}
}
&.code {
padding-right: 24rpx;
.uni-input {
text-indent: 23rpx;
font-size: 26rpx;
}
.code {
font-size: 26rpx;
color: #1969f9;
}
}
&.pwd {
padding-right: 24rpx;
.uni-input {
text-indent: 23rpx;
font-size: 26rpx;
}
.iconfont {
font-size: 44rpx;
color: #979797;
}
}
} }
} }
assets/css/mine/login.scss
...@@ -129,10 +129,3 @@ ...@@ -129,10 +129,3 @@
} }
} }
} }
.mb24 {
margin-bottom: 24rpx;
}
.mb40 {
margin-bottom: 40rpx;
}
components/nav.vue
...@@ -24,7 +24,6 @@ export default { ...@@ -24,7 +24,6 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
.h5-nav { .h5-nav {
padding-left: 32rpx;
height: 88rpx; height: 88rpx;
.iconfont { .iconfont {
width: 33.3%; width: 33.3%;
......
pages/mine/forget.vue
<template> <template>
<view class="page-forget"> <view class="page-forget">
<navElement title="重置密码" v-back></navElement> <navElement title="重置密码" v-back></navElement>
<view class="tip"><text class="iconfont"></text></view> <view class="tip row">
<text class="iconfont icon-ts"></text>
<text class="tt">猎芯网移动端目前仅支持手机号找回方式，如果您要通过邮箱账号找回密码，请使用电脑打开猎芯网www.ichunt.com</text>
</view>
<view class="step row verCenter">
<view class="box column verCenter curr">
<text class="line"></text>
<text class="tt">身份验证</text>
</view>
<view class="box column verCenter">
<text class="line"></text>
<text class="tt">重置密码</text>
</view>
<view class="box column verCenter">
<text class="line"></text>
<text class="tt">完成</text>
</view>
</view>
<view class="input-box mobile row verCenter mb24">
<view class="picker-box">
<picker @change="bindPickerChange" :value="index" :range="array">
<view class="row verCenter bothSide">
<view class="uni-input">{{ array[index] }}</view>
<view class="iconfont icon-arrbot"></view>
</view>
</picker>
</view>
<input type="number" placeholder="请输入手机号码" placeholder-style="color:#919399;" class="uni-input" />
</view>
<view class="input-box code row bothSide verCenter mb40">
<input type="number" placeholder="请输入验证码" placeholder-style="color:#919399;" class="uni-input" />
<text class="code">获取验证码</text>
</view>
</view> </view>
</template> </template>
...@@ -12,7 +44,10 @@ export default { ...@@ -12,7 +44,10 @@ export default {
navElement navElement
}, },
data() { data() {
return {}; return {
index: 0,
array: ['0086', '00886', '00853', '00852']
};
}, },
onLoad() {}, onLoad() {},
methods: {} methods: {}
......
uni.scss
/* 文字基本颜色 */ /* 文字基本颜色 */
$uni-color333: #292B33; //基本色 $uni-color333: #292b33; //基本色
$uni-colorfff: #fff; //反色 $uni-colorfff: #fff; //反色
$uni-color999: #919399; //辅助灰色，如加载更多的提示信息 $uni-color999: #919399; //辅助灰色，如加载更多的提示信息
$uni-color666: #484B59; $uni-color666: #484b59;
/**状态颜色**/ /**状态颜色**/
$uni-coloract: #1969F9; //选中 蓝色 $uni-coloract: #1969f9; //选中 蓝色
$uni-colorwarning: #F98119;//警告提示 黄色 $uni-colorwarning: #f98119; //警告提示 黄色
/* 文字尺寸 */ /* 文字尺寸 */
$uni-sz12: 12rpx; $uni-sz12: 12rpx;
$uni-sz14: 14rpx; $uni-sz14: 14rpx;
$uni-fz16: 16rpx; $uni-fz16: 16rpx;
html,
body {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
view, view,
text, text,
input,navigator { input,
navigator {
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
} }
.navigator-hover{ .navigator-hover {
background:none; background: none;
opacity: 1; opacity: 1;
} }
image { image {
vertical-align: middle; vertical-align: middle;
} }
/**单行省略**/ /**单行省略**/
.elep{ .elep {
overflow : hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space : nowrap; white-space: nowrap;
} }
/**2行省略**/ /**2行省略**/
.elep2{ .elep2 {
word-break: break-all; word-break: break-all;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
display: -webkit-box; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-line-clamp: 2; /* 这里是超出几行省略 */ -webkit-line-clamp: 2; /* 这里是超出几行省略 */
} }
.column { .column {
display: flex; display: flex;
...@@ -77,4 +81,12 @@ image { ...@@ -77,4 +81,12 @@ image {
/* 垂直居中 */ /* 垂直居中 */
.verCenter { .verCenter {
align-items: center; align-items: center;
} }
\ No newline at end of file
.mb24 {
margin-bottom: 24rpx;
}
.mb40 {
margin-bottom: 40rpx;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment