调整注册页面在手机端的布局
This commit is contained in:
@@ -3,21 +3,24 @@
|
|||||||
<div class="selectSignUp" v-show="!isSelectSignUp">
|
<div class="selectSignUp" v-show="!isSelectSignUp">
|
||||||
<div class="title">{{ productList[0].Advantages }}</div>
|
<div class="title">{{ productList[0].Advantages }}</div>
|
||||||
<!-- <div class="introduce"><span @click="()=>isSelectSignUp=true">LEARN MORE ALL OUR PRODUCT FEATURES</span></div> -->
|
<!-- <div class="introduce"><span @click="()=>isSelectSignUp=true">LEARN MORE ALL OUR PRODUCT FEATURES</span></div> -->
|
||||||
<div class="gallery_list product_list">
|
<div class="gallery_list_box">
|
||||||
<div class="gallery_item" v-for="item in productList" :key="item">
|
<div class="gallery_list product_list">
|
||||||
<div class="product_signUp_box">
|
<div class="gallery_item" v-for="item in productList" :key="item">
|
||||||
<div class="title">{{ item?.title }}</div>
|
<div class="product_signUp_box">
|
||||||
<div class="info">{{ item?.info }}</div>
|
<div class="title">{{ item?.title }}</div>
|
||||||
<div class="detail">{{ item?.detail }}</div>
|
<div class="info">{{ item?.info }}</div>
|
||||||
<div class="highlight" v-if="item?.highlight">{{ item?.highlight }}</div>
|
<div class="detail">{{ item?.detail }}</div>
|
||||||
<div class="gallery_btn gallery_btn_radius" v-if="item?.info != '/'" @click="createAccount">{{ item?.btn }}</div>
|
<div class="highlight" v-if="item?.highlight">{{ item?.highlight }}</div>
|
||||||
<a class="gallery_btn gallery_btn_radius" v-else href="mailto:info@code-create.com.hk">Contact us</a>
|
<div class="gallery_btn gallery_btn_radius" v-if="item?.info != '/'" @click="createAccount">{{ item?.btn }}</div>
|
||||||
|
<a class="gallery_btn gallery_btn_radius" v-else href="mailto:info@code-create.com.hk">Contact us</a>
|
||||||
|
</div>
|
||||||
|
<ul class="product_detail">
|
||||||
|
<li v-for="detailItem in item?.detailList">{{ detailItem }}</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<ul class="product_detail">
|
|
||||||
<li v-for="detailItem in item?.detailList">{{ detailItem }}</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="introductDetail" v-show="isSelectSignUp">
|
<div class="introductDetail" v-show="isSelectSignUp">
|
||||||
<div class="title">Product Features</div>
|
<div class="title">Product Features</div>
|
||||||
@@ -176,6 +179,10 @@
|
|||||||
.signUp{
|
.signUp{
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding: 0rem 4rem;
|
padding: 0rem 4rem;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
.back{
|
.back{
|
||||||
font-size: 1.6rem;
|
font-size: 1.6rem;
|
||||||
margin-bottom: 3rem;
|
margin-bottom: 3rem;
|
||||||
@@ -193,6 +200,19 @@
|
|||||||
.introduce{
|
.introduce{
|
||||||
font-size: 2.4rem;
|
font-size: 2.4rem;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
.selectSignUp{
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.gallery_list_box{
|
||||||
|
|
||||||
}
|
}
|
||||||
.gallery_list{
|
.gallery_list{
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -200,7 +220,10 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
.gallery_item{
|
.gallery_item{
|
||||||
width: calc(33.333% - 3rem);
|
width: 100%;
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
width: calc(33.333% - 3rem);
|
||||||
|
}
|
||||||
.title,.info,.highlight{
|
.title,.info,.highlight{
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -700,6 +700,8 @@ export default defineComponent({
|
|||||||
padding-right: 20rem;
|
padding-right: 20rem;
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
padding-right: 0;
|
||||||
|
padding: 0 10rem;
|
||||||
}
|
}
|
||||||
.login_form_email {
|
.login_form_email {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
Reference in New Issue
Block a user