|
|
@@ -94,151 +94,31 @@
|
|
|
<template v-else>
|
|
|
<div class="mobile-wrapper wrapper">
|
|
|
<div class="header">
|
|
|
- <div class="header-title">
|
|
|
- <span>优选</span>开发服务商
|
|
|
+ <div class="header-title">优选技术服务商</div>
|
|
|
+ <div class="header-subtitle">为企业方提供优质可靠的行业解决方案</div>
|
|
|
+ <div class="btn-list">
|
|
|
+ <a class="publish-btn" @click="freeSubmitHandler()">免费发布需求</a>
|
|
|
+ <div class="apply-btn" @click="handleApplyBtnClick()">申请入驻</div>
|
|
|
</div>
|
|
|
- <div class="header-subtitle">入驻客栈为企业方提供优质的开发服务</div>
|
|
|
- <div class="apply-btn" @click="handleApplyBtnClick()">申请入驻</div>
|
|
|
</div>
|
|
|
<div class="module">
|
|
|
- <div class="module-title">共享定制化项目开发商机</div>
|
|
|
- <div class="module-line"></div>
|
|
|
- <div class="business-list">
|
|
|
- <div class="business-item">
|
|
|
- <img class="business-img" src="~@/assets/img/partners/business_fitst.png" alt/>
|
|
|
- <div class="business-title">优先派单</div>
|
|
|
- <div class="business-subtitle">高质量的项目订单/线索</div>
|
|
|
- </div>
|
|
|
- <div class="business-item">
|
|
|
- <img class="business-img" src="~@/assets/img/partners/business_second.png" alt/>
|
|
|
- <div class="business-title">减免服务费</div>
|
|
|
- <div class="business-subtitle">大幅减免,甚至全免</div>
|
|
|
- </div>
|
|
|
- <div class="business-item">
|
|
|
- <img class="business-img" src="~@/assets/img/partners/business_third.png" alt/>
|
|
|
- <div class="business-title">高性价比API服务</div>
|
|
|
- <div class="business-subtitle">品类丰富、省心便捷</div>
|
|
|
- </div>
|
|
|
- <div class="business-item">
|
|
|
- <img class="business-img" src="~@/assets/img/partners/business_fourth.png" alt/>
|
|
|
- <div class="business-title">专属客服</div>
|
|
|
- <div class="business-subtitle">专人跟进、协助转化</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="module">
|
|
|
- <div class="module-title">入驻合作形式</div>
|
|
|
- <div class="module-line"></div>
|
|
|
- <div class="project-wrapper">
|
|
|
- <div class="project-title">项目开发</div>
|
|
|
- <div class="project-list">
|
|
|
- <ul class="project-item">
|
|
|
- <li style="padding-top: .7rem;">
|
|
|
- <div class="developer">
|
|
|
- <img class="developer-img" src="~@/assets/img/partners/team.png" alt/>
|
|
|
- <div class="developer-text">开发团队</div>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li style="padding-top: .7rem;">
|
|
|
- <div class="developer">
|
|
|
- <img class="developer-img" src="~@/assets/img/partners/company.png" alt/>
|
|
|
- <div class="developer-text">开发企业</div>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <ul class="project-item">
|
|
|
- <li>
|
|
|
- <span>小型开发外包团队</span>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <span>有一定规模的软件开发公司</span>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <ul class="project-item">
|
|
|
- <li>
|
|
|
- <span>具备某个行业的开发经验</span>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <span>具备多行业开发经验和案例</span>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <ul class="project-item">
|
|
|
- <li>
|
|
|
- <span>平台优先派单</span>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <span>平台稳定提供项目线索</span>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <ul class="project-item">
|
|
|
- <li>
|
|
|
- <span>需在平台上托管交易</span>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <span style="color: #308EFF;">不限</span>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <ul class="project-item">
|
|
|
- <li>
|
|
|
- <span>按项目模式正常收取</span>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <span style="color: #308EFF;">全免</span>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <ul class="project-item">
|
|
|
- <li style="padding-bottom: .34rem;">
|
|
|
- <span>API使用越多,派单越多</span>
|
|
|
- </li>
|
|
|
- <li style="padding-bottom: .34rem;">
|
|
|
- <span>API使用越多,派单越多</span>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
+ <div class="screenTop">
|
|
|
+ <div class="title">全行业解决方案</div>
|
|
|
+ <div class="line"/>
|
|
|
</div>
|
|
|
- <div class="station-wrapper">
|
|
|
- <div class="station-title">驻场开发</div>
|
|
|
- <div class="station-content">
|
|
|
- <img class="station-img" src="~@/assets/img/partners/station.png" alt/>
|
|
|
- <div class="station-bottom">
|
|
|
- <div class="station-bottom-title">驻场外包服务商</div>
|
|
|
- <div class="station-bottom-content">
|
|
|
- <p>1、通过客栈的企业认证</p>
|
|
|
- <p>2、有成熟的IT人力外派方案和成功案例</p>
|
|
|
- <p>3、提供的驻场开发人员需在平台注册、签约</p>
|
|
|
- <p>4、平台提供项目线索,直接对接雇主</p>
|
|
|
- <p>5、不收取交易服务费</p>
|
|
|
- </div>
|
|
|
+
|
|
|
+ <div class="list">
|
|
|
+ <div class="cell" v-for="(item, index) in list" :key="'ll'+index">
|
|
|
+ <img class="img" :src="item.img"/>
|
|
|
+ <div class="wordBody">
|
|
|
+ <div class="wordTitle">{{item.title}}</div>
|
|
|
+ <div class="wordTips">{{item.subTitle}}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
</div>
|
|
|
- <div class="module">
|
|
|
- <div class="module-title">入驻合作流程</div>
|
|
|
- <div class="module-line"></div>
|
|
|
- <div class="process-list">
|
|
|
- <div class="process-item">
|
|
|
- <img class="process-img" src="~@/assets/img/partners/business_fitst.png" alt/>
|
|
|
- <div class="process-title">1.申请</div>
|
|
|
- <div class="process-subtitle">联系客户经理提交入驻申请</div>
|
|
|
- </div>
|
|
|
- <div class="process-item">
|
|
|
- <img class="process-img" src="~@/assets/img/partners/business_second.png" alt/>
|
|
|
- <div class="process-title">2.审核</div>
|
|
|
- <div class="process-subtitle">平台审核资料、验证资质</div>
|
|
|
- </div>
|
|
|
- <div class="process-item">
|
|
|
- <img class="process-img" src="~@/assets/img/partners/business_third.png" alt/>
|
|
|
- <div class="process-title">3.缴费</div>
|
|
|
- <div class="process-subtitle">审核通过后,缴纳相应的费用</div>
|
|
|
- </div>
|
|
|
- <div class="process-item">
|
|
|
- <img class="process-img" src="~@/assets/img/partners/business_fourth.png" alt/>
|
|
|
- <div class="process-title">4.完成</div>
|
|
|
- <div class="process-subtitle">完成入驻,开始接单</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+
|
|
|
<div class="module module-footer">
|
|
|
<div class="module-title">服务咨询</div>
|
|
|
<div class="module-line"></div>
|
|
|
@@ -252,6 +132,24 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="toastBox" v-if="isShowToast">
|
|
|
+ <div class="toastArea">
|
|
|
+ <div class="title">行业解决方案专属客服</div>
|
|
|
+ <div class="tips">填写联系方式 立即与专属客服进行沟通</div>
|
|
|
+ <div class="nameCell">
|
|
|
+ <p class="label">联系人</p>
|
|
|
+ <input type="text" v-model="name" maxlength="10">
|
|
|
+ </div>
|
|
|
+ <div class="phoneCell">
|
|
|
+ <p class="label">电话</p>
|
|
|
+ <input type="number" v-model="phone" oninput="if(value.length>5)value=value.slice(0,11)">
|
|
|
+ </div>
|
|
|
+ <div class="submitBtn" @click="handleSubmit">
|
|
|
+ <p>提 交</p>
|
|
|
+ </div>
|
|
|
+ <div class="closeIcon" @click="isShowToast=false"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -266,7 +164,36 @@
|
|
|
screenWidth: 1920,
|
|
|
isShowToast: false,
|
|
|
name: '',
|
|
|
- phone: ''
|
|
|
+ phone: '',
|
|
|
+
|
|
|
+ list: [
|
|
|
+ {
|
|
|
+ img: require('@/assets/img/partners/solution_fitst.png'),
|
|
|
+ title: '教育行业解决方案',
|
|
|
+ subTitle: '以现今教育产品的差异化需求,从智慧教学、大数据协作管理、云资源共享、教育安全等多层面入手,打造覆盖教育行业全环节的智能技术解决方案。程序员客栈将携手教育行业,重塑教育+互利网的“智能化、信息化”定义,赋予教育行业智慧转型更高价值',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: require('@/assets/img/partners/solution_second.png'),
|
|
|
+ title: '区块链解决方案',
|
|
|
+ subTitle: '通过稳定而丰富的技术储备和产品设计能力,程序员客栈为全球区块链合作伙伴探索应用实现和商业模式,提供高效低成本、数据追踪、持续稳定性、智能合约等智能解决方案。携手合作伙伴直面风险和商业挑战,全面提升综合竞争力。',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: require('@/assets/img/partners/solution_third.png'),
|
|
|
+ title: '在线电商解决方案',
|
|
|
+ subTitle: '程序员客栈结合丰富的行业平台服务,提供端到端的电商解决方案,构建企业自有电商生态;企业可快速搭建电商平台,快速完成所有资源的创建和配置。',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: require('@/assets/img/partners/solution_fourth.png'),
|
|
|
+ title: '企业服务解决方案',
|
|
|
+ subTitle: '程序员客栈结合进制数据,将人脸识别、文字识别、语音交互等多项AI能力应用于电销、客服、语音质检、协同办公、员工考勤、单据识别等业务场景,提高企业内部管理效率,通过智能化企业服务降低成本,增加竞争力。',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: require('@/assets/img/partners/solution_fifth.png'),
|
|
|
+ title: '小程序解决方案',
|
|
|
+ subTitle: '小程序是运行在手机微信上的轻量App,小程序已经成为企业移动互联网战略上不可忽视的组成部分。程序员客栈结合企业业务需求和小程序自身特点,为您提供最合适的小程序产品开发方案。',
|
|
|
+ },
|
|
|
+ ]
|
|
|
+
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
@@ -278,6 +205,7 @@
|
|
|
},
|
|
|
|
|
|
freeSubmitHandler() {
|
|
|
+ console.log('toasdf!!!')
|
|
|
this.isShowToast = true
|
|
|
},
|
|
|
|
|
|
@@ -310,9 +238,11 @@
|
|
|
input::-webkit-inner-spin-button {
|
|
|
-webkit-appearance: none;
|
|
|
}
|
|
|
- input[type="number"]{
|
|
|
+
|
|
|
+ input[type="number"] {
|
|
|
-moz-appearance: textfield;
|
|
|
}
|
|
|
+
|
|
|
.main {
|
|
|
margin: 0 !important;
|
|
|
width: 100%;
|
|
|
@@ -815,240 +745,264 @@
|
|
|
}
|
|
|
|
|
|
.mobile-wrapper {
|
|
|
- .header {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: 6.28rem;
|
|
|
- background: url("~@/assets/img/partners/head_background.png");
|
|
|
- background-size: 100% 6.28rem;
|
|
|
- background-repeat: no-repeat;
|
|
|
- }
|
|
|
-
|
|
|
- .header-title {
|
|
|
- margin-top: 1.48rem;
|
|
|
- text-align: center;
|
|
|
- line-height: 1.01rem;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.6rem;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
-
|
|
|
- .header-title span {
|
|
|
- color: #308eff;
|
|
|
- }
|
|
|
-
|
|
|
- .header-subtitle {
|
|
|
- margin: 0.06rem auto 0;
|
|
|
- width: 7.04rem;
|
|
|
- line-height: 0.66rem;
|
|
|
- text-align: center;
|
|
|
- font-size: 0.52rem;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
-
|
|
|
- .apply-btn {
|
|
|
- margin: 0.64rem auto 0;
|
|
|
- width: 3.46rem;
|
|
|
- height: 0.76rem;
|
|
|
- border-radius: 0.04rem;
|
|
|
- border: 0.01rem solid #ffffff;
|
|
|
- line-height: 0.76rem;
|
|
|
- text-align: center;
|
|
|
- font-size: 0.25rem;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
+ position: relative;
|
|
|
|
|
|
- .module {
|
|
|
- overflow: hidden;
|
|
|
- background-color: #ffffff;
|
|
|
- color: #323232;
|
|
|
- }
|
|
|
+ .toastBox {
|
|
|
+ position: absolute;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background-color: rgba(0, 0, 0, 0.8);
|
|
|
+ z-index: 888;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
|
|
|
- .module-title {
|
|
|
- margin-top: 0.7rem;
|
|
|
- line-height: 53px;
|
|
|
- text-align: center;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.44rem;
|
|
|
- }
|
|
|
+ .toastArea {
|
|
|
+ position: relative;
|
|
|
+ width: 6.58rem;
|
|
|
+ height: 8.46rem;
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
+ border-radius: 0.07rem;
|
|
|
+ padding: 0.94rem 0.53rem;
|
|
|
|
|
|
- .module-line {
|
|
|
- margin: 0.36rem auto 0;
|
|
|
- width: 0.78rem;
|
|
|
- height: 0.04rem;
|
|
|
- background-color: #308eff;
|
|
|
- }
|
|
|
+ .title {
|
|
|
+ font-size: 0.36rem;
|
|
|
+ font-weight: 500;
|
|
|
+ color: rgba(34, 34, 34, 1);
|
|
|
+ line-height: 0.5rem;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
|
|
|
- .business-list {
|
|
|
- padding-bottom: 0.5rem;
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- }
|
|
|
+ .tips {
|
|
|
+ margin-top: 0.14rem;
|
|
|
+ font-size: 0.22rem;
|
|
|
+ font-weight: 400;
|
|
|
+ color: rgba(153, 153, 153, 1);
|
|
|
+ line-height: 0.32rem;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
|
|
|
- .business-item {
|
|
|
- margin-top: 0.8rem;
|
|
|
- width: 3.62rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
+ .nameCell, .phoneCell {
|
|
|
+ margin-top: 0.42rem;
|
|
|
|
|
|
- .business-img {
|
|
|
- width: 1.8rem;
|
|
|
- height: 1.8rem;
|
|
|
- }
|
|
|
+ .label {
|
|
|
+ font-size:0.28rem;
|
|
|
+ font-weight: 500;
|
|
|
+ color: rgba(25, 34, 46, 1);
|
|
|
+ line-height: 0.4rem;
|
|
|
+ }
|
|
|
+ input {
|
|
|
+ margin-top: 0.06rem;
|
|
|
+ padding: 0.2rem;
|
|
|
+
|
|
|
+ width:5.52rem;
|
|
|
+ height:0.96rem;
|
|
|
+ background:rgba(255,255,255,1);
|
|
|
+ border-radius:0.06rem;
|
|
|
+ border:0.02rem solid rgba(221,225,230,1);
|
|
|
+ font-size:0.28rem;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(153,153,153,1);
|
|
|
+ line-height:0.28rem;
|
|
|
|
|
|
- .business-title {
|
|
|
- margin-top: 0.32rem;
|
|
|
- line-height: 0.42rem;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.3rem;
|
|
|
- color: #19222e;
|
|
|
- }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .nameCell {
|
|
|
+ margin-top: 0.84rem;
|
|
|
+ }
|
|
|
|
|
|
- .business-subtitle {
|
|
|
- margin-top: 0.14rem;
|
|
|
- line-height: 0.36rem;
|
|
|
- font-size: 0.26rem;
|
|
|
- color: #919aa7;
|
|
|
- }
|
|
|
+ .submitBtn {
|
|
|
+ margin-top: 0.4rem;
|
|
|
+ width:5.52rem;
|
|
|
+ height:0.96rem;
|
|
|
+ background:rgba(48,142,255,1);
|
|
|
+ box-shadow:0 0.04rem 0.12rem 0 rgba(48,142,255,0.3);
|
|
|
+ border-radius:0.04rem;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ cursor: pointer;
|
|
|
+ p {
|
|
|
+ font-size:0.28rem;
|
|
|
+ font-weight:500;
|
|
|
+ color:rgba(255,255,255,1);
|
|
|
+ line-height:0.4rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .project-wrapper {
|
|
|
- margin-top: 0.42rem;
|
|
|
- }
|
|
|
+ .closeIcon {
|
|
|
+ position: absolute;
|
|
|
+ right: 0.4rem;
|
|
|
+ top: 0.4rem;
|
|
|
+ width: 0.32rem;
|
|
|
+ height: 0.32rem;
|
|
|
+ background: url('~@/assets/img/credit/closeIcon.png') no-repeat;
|
|
|
+ background-size: cover;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .project-title {
|
|
|
- line-height: 0.4rem;
|
|
|
- text-align: center;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.28rem;
|
|
|
- color: #323232;
|
|
|
}
|
|
|
|
|
|
- .project-list {
|
|
|
- margin: 0.38rem auto 0;
|
|
|
+ .header {
|
|
|
+ overflow: hidden;
|
|
|
width: 100%;
|
|
|
- border: 1px solid #ebeff5;
|
|
|
- }
|
|
|
+ height: 9.08rem;
|
|
|
+ background: url("~@/assets/img/partners/head_background_mobile.png");
|
|
|
+ background-size: cover;
|
|
|
+ background-repeat: no-repeat;
|
|
|
|
|
|
- .project-item {
|
|
|
display: flex;
|
|
|
- }
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ .header-title {
|
|
|
+ margin-top: 1.9rem;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 0.6rem;
|
|
|
+ font-weight: 600;
|
|
|
+ color: rgba(48, 142, 255, 1);
|
|
|
+ line-height: 0.72rem;
|
|
|
+ letter-spacing: 2px;
|
|
|
+ }
|
|
|
|
|
|
- .project-item li:nth-child(1) {
|
|
|
- flex: 1;
|
|
|
- border-right: 1px solid #ebeff5;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
+ .header-subtitle {
|
|
|
+ margin: 0.5rem auto 0;
|
|
|
+ width: 7.04rem;
|
|
|
+ line-height: 0.66rem;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 0.52rem;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
|
|
|
- .project-item li:nth-child(2) {
|
|
|
- flex: 1;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
+ .btn-list {
|
|
|
+ margin-top: 1.82rem;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ flex-direction: column;
|
|
|
|
|
|
- .developer {
|
|
|
- margin-bottom: 0.48rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
+ .publish-btn {
|
|
|
+ cursor: pointer;
|
|
|
+ width: 4.62rem;
|
|
|
+ height: 0.84rem;
|
|
|
+ line-height: 0.84rem;
|
|
|
+ border-radius: 0.04rem;
|
|
|
+ background-color: #ffffff;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 0.28rem;
|
|
|
+ color: #111111;
|
|
|
+ }
|
|
|
|
|
|
- .developer-img {
|
|
|
- width: 0.88rem;
|
|
|
- height: 0.88rem;
|
|
|
- }
|
|
|
+ .apply-btn {
|
|
|
+ margin: 0.13rem auto 0;
|
|
|
+ width: 4.62rem;
|
|
|
+ height: 0.84rem;
|
|
|
+ line-height: 0.84rem;
|
|
|
+ border-radius: 0.04rem;
|
|
|
+ border: 0.01rem solid #ffffff;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 0.28rem;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .developer-text {
|
|
|
- display: block;
|
|
|
- margin-top: 0.04rem;
|
|
|
- line-height: 0.4rem;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.28rem;
|
|
|
- color: #308eff;
|
|
|
- }
|
|
|
|
|
|
- .project-item li span {
|
|
|
- height: 0.9rem;
|
|
|
- line-height: 0.9rem;
|
|
|
- font-size: 0.26rem;
|
|
|
- color: #333333;
|
|
|
}
|
|
|
|
|
|
- .station-wrapper {
|
|
|
- margin-top: 0.4rem;
|
|
|
- }
|
|
|
|
|
|
- .station-title {
|
|
|
- line-height: 0.4rem;
|
|
|
- text-align: center;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.28rem;
|
|
|
+
|
|
|
+ .module {
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: #ffffff;
|
|
|
color: #323232;
|
|
|
- }
|
|
|
|
|
|
- .station-content {
|
|
|
- padding-top: 0.38rem;
|
|
|
- padding-bottom: 0.1rem;
|
|
|
- }
|
|
|
+ .screenTop {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
|
|
|
- .station-img {
|
|
|
- margin-left: 0.15rem;
|
|
|
- width: 7.2rem;
|
|
|
- height: 3.8rem;
|
|
|
- }
|
|
|
+ .title {
|
|
|
+ margin-top: 0.67rem;
|
|
|
+ font-size:0.44rem;
|
|
|
+ font-weight:600;
|
|
|
+ color:rgba(50,50,50,1);
|
|
|
+ line-height:0.6rem;
|
|
|
+ }
|
|
|
+ .line {
|
|
|
+ margin-top: 0.32rem;
|
|
|
+ width:0.79rem;
|
|
|
+ height:0.05rem;
|
|
|
+ background:rgba(48,142,255,1);
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .station-bottom {
|
|
|
- margin-top: 0.32rem;
|
|
|
- }
|
|
|
+ .list {
|
|
|
+ margin: 0.06rem auto 1.08rem auto;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
|
|
|
- .station-bottom-title {
|
|
|
- margin-left: 0.2rem;
|
|
|
- line-height: 0.56rem;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.4rem;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ .cell {
|
|
|
+ margin-top: 0.4rem;
|
|
|
+ width:6.7rem;
|
|
|
+ min-height:8rem;
|
|
|
+ box-shadow:0 0.12rem 0.46rem 0 rgba(13,24,36,0.07);
|
|
|
+ border-radius:0.16rem;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: #fff;
|
|
|
+ font-size: 0;
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 6.7rem;
|
|
|
+ height: 4.4rem;
|
|
|
+ }
|
|
|
+ .wordBody {
|
|
|
+ width: 100%;
|
|
|
+ min-height: 3.6rem;
|
|
|
+ padding: 0.4rem 0.28rem;
|
|
|
+
|
|
|
+ .wordTitle {
|
|
|
+ font-size:0.4rem;
|
|
|
+ font-weight:500;
|
|
|
+ color:rgba(17,28,45,1);
|
|
|
+ line-height:0.56rem;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .wordTips {
|
|
|
+ margin-top: 0.2rem;
|
|
|
+ font-size:0.28rem;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(126,134,147,1);
|
|
|
+ line-height:0.4rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .station-bottom-content {
|
|
|
- margin-top: 0.08rem;
|
|
|
- margin-left: 0.2rem;
|
|
|
- line-height: 0.4rem;
|
|
|
- font-size: 0.24rem;
|
|
|
- color: #888888;
|
|
|
- }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .process-list {
|
|
|
- padding-bottom: 1.04rem;
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- }
|
|
|
+ .module-title {
|
|
|
+ margin-top: 0.7rem;
|
|
|
+ line-height: 53px;
|
|
|
+ text-align: center;
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 0.44rem;
|
|
|
+ }
|
|
|
|
|
|
- .process-item {
|
|
|
- margin-top: 0.64rem;
|
|
|
- width: 3.66rem;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
+ .module-line {
|
|
|
+ margin: 0.36rem auto 0;
|
|
|
+ width: 0.78rem;
|
|
|
+ height: 0.04rem;
|
|
|
+ background-color: #308eff;
|
|
|
+ }
|
|
|
|
|
|
- .process-img {
|
|
|
- width: 2.2rem;
|
|
|
- height: 2.2rem;
|
|
|
}
|
|
|
|
|
|
- .process-title {
|
|
|
- margin-top: 0.24rem;
|
|
|
- line-height: 0.44rem;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 0.32rem;
|
|
|
- color: #181a20;
|
|
|
- }
|
|
|
|
|
|
- .process-subtitle {
|
|
|
- margin-top: 0.08rem;
|
|
|
- line-height: 0.4rem;
|
|
|
- white-space: nowrap;
|
|
|
- font-size: 0.25rem;
|
|
|
- color: #666666;
|
|
|
- }
|
|
|
|
|
|
.module-footer {
|
|
|
width: 100%;
|