add new
This commit is contained in:
parent
e09ce20561
commit
3e6384f6d9
47
src/App.vue
47
src/App.vue
|
@ -10,11 +10,11 @@ import sl1 from './assets/s5.png'
|
||||||
import sl2 from './assets/s6.png'
|
import sl2 from './assets/s6.png'
|
||||||
import sl3 from './assets/s7.png'
|
import sl3 from './assets/s7.png'
|
||||||
import sl4 from './assets/s8.png'
|
import sl4 from './assets/s8.png'
|
||||||
let bt_data=reactive([{btname:'优惠服务',imgurl:s1,simgurl:sl1},{btname:'生活助手',imgurl:s2,simgurl:sl2},{btname:'智能优推',imgurl:s3,simgurl:sl3},{btname:'大众点评',imgurl:s4,simgurl:sl4}])
|
let bt_data = reactive([{ btname: '优惠服务', imgurl: s1, simgurl: sl1 }, { btname: '生活助手', imgurl: s2, simgurl: sl2 }, { btname: '智能优推', imgurl: s3, simgurl: sl3 }, { btname: '大众点评', imgurl: s4, simgurl: sl4 }])
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<!-- <header>
|
<!-- <header>
|
||||||
<img alt="Vue logo" class="logo" src="@/assets/logo.svg" width="125" height="125" />
|
<img alt="Vue logo" class="logo" src="@/assets/logo.svg" width="125" height="125" />
|
||||||
|
|
||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
|
@ -27,25 +27,47 @@ let bt_data=reactive([{btname:'优惠服务',imgurl:s1,simgurl:sl1},{btname:'生
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
</header> -->
|
</header> -->
|
||||||
<!-- <RouterLink to="/chat">Chat</RouterLink> -->
|
<!-- <RouterLink to="/chat">Chat</RouterLink> -->
|
||||||
<RouterView />
|
<RouterView />
|
||||||
<div class="bottom">
|
<div class="bottom">
|
||||||
<div class="bt_itm" v-for="(v,i) in bt_data" :key="i">
|
<div class="bt_itm" v-for="(v, i) in bt_data" :key="i">
|
||||||
<img :src="v.imgurl" alt="">
|
<img :src="v.imgurl" alt="">
|
||||||
<img :src="v.simgurl" alt="">
|
<!-- <img :src="v.simgurl" alt=""> -->
|
||||||
|
|
||||||
<span>{{ v.btname }}</span>
|
<span>{{ v.btname }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style >
|
<style lang="scss">
|
||||||
*{padding: 0px;}
|
* {
|
||||||
.bottom{
|
padding: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom {
|
||||||
|
background-color: #fff;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: space-around;
|
||||||
|
|
||||||
|
.bt_itm {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
img {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 10px;
|
||||||
|
font-family: PingFang SC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* header {
|
/* header {
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
max-height: 100vh;
|
max-height: 100vh;
|
||||||
|
@ -106,5 +128,4 @@ nav a:first-of-type {
|
||||||
padding: 1rem 0;
|
padding: 1rem 0;
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
}
|
}
|
||||||
} */
|
} */</style>
|
||||||
</style>
|
|
||||||
|
|
Loading…
Reference in New Issue