Browse Source

feat: 图文页面样式更新

dev
jiannibang 4 years ago
parent
commit
530f7cd0db
  1. 10
      src/components/CarouselWithIntro/CarouselWithIntro.vue
  2. 10
      src/components/PublicComponent/Tabs.vue
  3. 2
      src/views/Member/Member.vue

10
src/components/CarouselWithIntro/CarouselWithIntro.vue

@ -43,17 +43,16 @@ const qr = computed(() => props.data.qrFileList ?? [])
<style lang="scss" scoped> <style lang="scss" scoped>
.benefits-wrapper { .benefits-wrapper {
display: flex; display: flex;
flex-direction: column;
width: 100%; width: 100%;
flex: 1; flex: 1;
align-items: center;
padding-top: 48px;
align-items: flex-start;
padding-top: 100px;
padding-left: 63px;
.carousel { .carousel {
position: relative;
flex-shrink: 0; flex-shrink: 0;
width: 944px; width: 944px;
height: 548px; height: 548px;
overflow: hidden; overflow: hidden;
:deep(.swiper) { :deep(.swiper) {
overflow: visible; overflow: visible;
@ -89,7 +88,6 @@ const qr = computed(() => props.data.qrFileList ?? [])
} }
} }
.title { .title {
padding-top: 32px;
padding-left: 68px; padding-left: 68px;
font-weight: 700; font-weight: 700;
font-size: 28px; font-size: 28px;

10
src/components/PublicComponent/Tabs.vue

@ -23,21 +23,21 @@ const goPage = item => {
<style lang="scss" scoped> <style lang="scss" scoped>
.tabs { .tabs {
position: fixed; position: fixed;
top: 400px;
left: 68px;
right: 68px;
top: 156px;
left: 456px;
right: 456px;
display: flex; display: flex;
.item { .item {
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex: 1; flex: 1;
height: 170px;
height: 124px;
.icon { .icon {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 97px;
height: 80px;
background: rgba(255, 255, 255, 0.4); background: rgba(255, 255, 255, 0.4);
border-radius: 24px; border-radius: 24px;
img { img {

2
src/views/Member/Member.vue

@ -1,5 +1,5 @@
<template> <template>
<View long>
<View>
<CarouselWithIntro :data="benefits" /> <CarouselWithIntro :data="benefits" />
</View> </View>
</template> </template>

Loading…
Cancel
Save