|
|
@@ -12,29 +12,33 @@
|
|
|
<view class="status-space" :style="{ height: statusBarHeight + 'px' }"></view>
|
|
|
<view class="login-hero-inner">
|
|
|
<text class="login-hero-title">花掌柜</text>
|
|
|
- <text class="login-hero-desc">登录查看我的门店,便捷买花</text>
|
|
|
+ <text class="login-hero-desc">登录查看我的门店</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="login-body">
|
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
|
<view class="login-card">
|
|
|
- <view class="login-card-icon-wrap login-card-icon-wrap--buy">
|
|
|
- <image class="login-card-icon" :src="iconSrc('bouquet')" mode="aspectFit" />
|
|
|
- </view>
|
|
|
- <view class="login-card-main">
|
|
|
- <text class="login-card-title">个人买花</text>
|
|
|
- <text class="login-card-desc">购买花材、花束和绿植</text>
|
|
|
+ <view class="login-card-top">
|
|
|
+ <view class="login-card-icon-wrap login-card-icon-wrap--buy">
|
|
|
+ <image class="login-card-icon" :src="iconSrc('bouquet')" mode="aspectFit" />
|
|
|
+ </view>
|
|
|
+ <view class="login-card-main">
|
|
|
+ <text class="login-card-title">个人买花</text>
|
|
|
+ <text class="login-card-desc">购买花材、花束和绿植</text>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <button class="login-card-btn login-card-btn--outline" @click="buyItem">去买花</button>
|
|
|
+ <button class="login-card-btn login-card-btn--outline" @click="buyItem">买花</button>
|
|
|
</view>
|
|
|
<!-- #endif -->
|
|
|
<view class="login-card">
|
|
|
- <view class="login-card-icon-wrap login-card-icon-wrap--supply">
|
|
|
- <image class="login-card-icon" :src="iconSrc('procurement')" mode="aspectFit" />
|
|
|
- </view>
|
|
|
- <view class="login-card-main">
|
|
|
- <text class="login-card-title">花店进货</text>
|
|
|
- <text class="login-card-desc">花店买花材、采购和管理</text>
|
|
|
+ <view class="login-card-top">
|
|
|
+ <view class="login-card-icon-wrap login-card-icon-wrap--supply">
|
|
|
+ <image class="login-card-icon" :src="iconSrc('procurement')" mode="aspectFit" />
|
|
|
+ </view>
|
|
|
+ <view class="login-card-main">
|
|
|
+ <text class="login-card-title">花店进货</text>
|
|
|
+ <text class="login-card-desc">花店买花材、采购和管理</text>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<button
|
|
|
class="login-card-btn login-card-btn--primary"
|
|
|
@@ -723,6 +727,8 @@ export default {
|
|
|
<style lang="scss" scoped>
|
|
|
.login-page {
|
|
|
min-height: 100vh;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
background: #f2f7f4;
|
|
|
}
|
|
|
|
|
|
@@ -791,28 +797,35 @@ export default {
|
|
|
}
|
|
|
|
|
|
.login-body {
|
|
|
- padding: 14upx 24upx 48upx;
|
|
|
+ flex: 1;
|
|
|
+ padding: 28upx 24upx 64upx;
|
|
|
}
|
|
|
|
|
|
.login-card {
|
|
|
display: flex;
|
|
|
- flex-direction: row;
|
|
|
- align-items: center;
|
|
|
- padding: 28upx 24upx;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: stretch;
|
|
|
+ padding: 36upx 32upx 32upx;
|
|
|
background: #fff;
|
|
|
- border-radius: 20upx;
|
|
|
+ border-radius: 24upx;
|
|
|
box-shadow: 0 8upx 24upx rgba(9, 197, 103, 0.08);
|
|
|
- margin-top:10upx;
|
|
|
}
|
|
|
|
|
|
.login-card + .login-card {
|
|
|
- margin-top: 24upx;
|
|
|
+ margin-top: 36upx;
|
|
|
+}
|
|
|
+
|
|
|
+.login-card-top {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ min-width: 0;
|
|
|
}
|
|
|
|
|
|
.login-card-icon-wrap {
|
|
|
- width: 88upx;
|
|
|
- height: 88upx;
|
|
|
- border-radius: 22upx;
|
|
|
+ width: 104upx;
|
|
|
+ height: 104upx;
|
|
|
+ border-radius: 26upx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
@@ -828,68 +841,64 @@ export default {
|
|
|
}
|
|
|
|
|
|
.login-card-icon {
|
|
|
- width: 48upx;
|
|
|
- height: 48upx;
|
|
|
+ width: 56upx;
|
|
|
+ height: 56upx;
|
|
|
}
|
|
|
|
|
|
.login-card-main {
|
|
|
flex: 1;
|
|
|
min-width: 0;
|
|
|
- margin-left: 20upx;
|
|
|
+ margin-left: 24upx;
|
|
|
}
|
|
|
|
|
|
.login-card-title {
|
|
|
display: block;
|
|
|
color: #161819;
|
|
|
- font-size: 36upx;
|
|
|
+ font-size: 38upx;
|
|
|
font-weight: 700;
|
|
|
- line-height: 44upx;
|
|
|
+ line-height: 48upx;
|
|
|
}
|
|
|
|
|
|
.login-card-desc {
|
|
|
display: block;
|
|
|
- margin-top: 8upx;
|
|
|
+ margin-top: 12upx;
|
|
|
color: #8a9199;
|
|
|
- font-size: 28upx;
|
|
|
- line-height: 38upx;
|
|
|
+ font-size: 30upx;
|
|
|
+ line-height: 40upx;
|
|
|
}
|
|
|
|
|
|
.login-card-btn {
|
|
|
- flex-shrink: 0;
|
|
|
- margin: 0 0 0 16upx;
|
|
|
- padding: 0 28upx;
|
|
|
- min-width: 148upx;
|
|
|
- height: 86upx;
|
|
|
- line-height: 86upx;
|
|
|
- font-size: 32upx;
|
|
|
+ width: 100%;
|
|
|
+ margin: 36upx 0 0;
|
|
|
+ padding: 0;
|
|
|
+ min-width: 0;
|
|
|
+ height: 101upx;
|
|
|
+ line-height: 101upx;
|
|
|
+ font-size: 38upx;
|
|
|
font-weight: 600;
|
|
|
- border-radius: 43upx;
|
|
|
+ border-radius: 40upx;
|
|
|
text-align: center;
|
|
|
border: none;
|
|
|
+ color: #fff;
|
|
|
+ background: #09c567;
|
|
|
}
|
|
|
|
|
|
.login-card-btn::after {
|
|
|
border: none;
|
|
|
}
|
|
|
|
|
|
-.login-card-btn--primary {
|
|
|
+.login-card-btn--primary,
|
|
|
+.login-card-btn--outline {
|
|
|
color: #fff;
|
|
|
background: #09c567;
|
|
|
}
|
|
|
|
|
|
-.login-card-btn--outline {
|
|
|
- color: #09c567;
|
|
|
- background: #fff;
|
|
|
- border: 2upx solid #09c567;
|
|
|
- line-height: 82upx;
|
|
|
-}
|
|
|
-
|
|
|
.login-register {
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- margin-top: 40upx;
|
|
|
+ margin-top: 56upx;
|
|
|
}
|
|
|
|
|
|
.login-register-tip {
|