Browse Source

weitiao

master
maochaoying 2 years ago
parent
commit
42cb4c421c
  1. 10
      src/components/SubNavigation.vue
  2. 7
      src/components/Top.vue
  3. 8
      src/pages/Hardware.vue

10
src/components/SubNavigation.vue

@ -4,6 +4,7 @@
<p class="title">{{ title }}</p>
<img class="menu" :src="Menu" v-if="!drawer" @click="openDrawer" />
<div class="menu" v-else></div>
</div>
<div class="modal_drawer" v-if="drawer" @click="hidePanel">
<img :src="Close" class="close" alt="" @click="drawer = false" />
<div class="content" id="sub_navi_tab">
@ -20,7 +21,6 @@
</div>
</div>
</div>
</div>
</template>
<script setup>
@ -66,13 +66,15 @@ const backPage = () => {
align-items: center;
justify-content: space-between;
padding: 16px 18px;
box-sizing: border-box;
background: #efefef;
z-index: 222;
z-index: 999;
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100vw;
overflow: hidden;
box-sizing: border-box;
.back_icon {
width: 8px;
height: 15px;
@ -87,6 +89,7 @@ const backPage = () => {
width: 18px;
height: 12px;
}
}
.modal_drawer {
position: fixed;
top: 0;
@ -144,5 +147,4 @@ const backPage = () => {
}
}
}
}
</style>

7
src/components/Top.vue

@ -16,6 +16,7 @@
v-if="!drawer"
@click="openDrawer"
/>
</div>
<div class="modal_drawer" v-if="drawer" @click="hidePanel">
<img :src="Close" class="close" alt="" @click="drawer = false" />
<div class="content" id="content_tab">
@ -34,7 +35,6 @@
</div>
</div>
</div>
</div>
</template>
<script setup>
@ -116,12 +116,15 @@ const scrollToTop = () => {
width: 18px;
height: 12px;
}
}
.modal_drawer {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100vh;
z-index: 999;
background: rgba(0, 0, 0, 0.67);
.close {
@ -138,6 +141,7 @@ const scrollToTop = () => {
bottom: 0;
height: 348px;
background: #fff;
z-index: 999;
border-top-right-radius: 20px;
border-top-left-radius: 20px;
display: flex;
@ -174,7 +178,6 @@ const scrollToTop = () => {
}
}
}
}
.container_bg {
background: rgba(255, 255, 255, 0.9);
backdrop-filter: blur(30px);

8
src/pages/Hardware.vue

@ -26,11 +26,11 @@
<div class="img_wrap">
<img :src="Dian" class="img" alt="" />
<div class="gif_wrap">
<img :src="Gif1" class="left_img" alt="" />
<img :src="Gif2" class="left_img" alt="" />
<img :src="SAccelerate" class="right_img" alt="" />
</div>
<div class="gif_wrap">
<img :src="Gif2" class="left_img" alt="" />
<img :src="Gif1" class="left_img" alt="" />
<img :src="TAccelerate" class="right_img" alt="" />
</div>
</div>
@ -73,7 +73,9 @@ const handleRelease = e => {
<style lang="scss" scoped>
.hardware_home_container {
background: #f5f5f5;
padding-bottom: $bottom-height;
margin-bottom: $bottom-height;
max-width: 100vw;
overflow: hidden;
.img_wrap {
padding: 0 7px;
.gif_wrap {

Loading…
Cancel
Save