fixed 我的顧問清單: pagination 與 footer 重疊

Mila

2021-12-06 490fd6cdf44311ad7235f5e5722ebdd9827e3c60

 PAMapp/layouts/default.vue

@@ -1,6 +1,7 @@
<template>
  <div class="pam-background">
    <UiGoToTop></UiGoToTop>
    <NavBar></NavBar>
    <BackActionBar></BackActionBar>
    <div class="pam-banner"
      :class="bannerClassName">
@@ -14,7 +15,7 @@
    </div>
    <div
      class="pam-container"
      :class="{containClassName, 'mt-navBar': bannerClassName === 'pam-no-banner'}"
      :class="[containClassName,{'mt-navBar': bannerClassName === 'pam-no-banner'}]"
    >
      <Nuxt class="pam-page-container"></Nuxt>
    </div>
@@ -50,7 +51,7 @@

    // format to {page}-banner or pam-no-banner tag
    private routeFormatBannerClass(route: string): string {
      const needBannerTags = ['recommendConsultant', 'quickFilter', 'myConsultantList-consultantList', 'myConsultantList-contactedList', 'myAppointmentList-appointmentList', 'myAppointmentList-contactedList'];
      const needBannerTags = ['recommendConsultant', 'quickFilter', 'myConsultantList-consultantList', 'myConsultantList-contactedList', 'myAppointmentList-appointmentList', 'myAppointmentList-contactedList', 'login'];
      return _.includes(needBannerTags, route) ? route + '-banner' : 'pam-no-banner';
    };

@@ -91,18 +92,6 @@
    margin: 30px 20px;
  }

  @include desktop {
    .pam-page-container {
      width: 700px;
      margin: 30px auto 0px auto;
    }
    .pam-banner__text{
      width: 700px;
      position: static !important;
      margin: 30px auto 0px auto;
    }
  }

  .pam-banner {
    width: 100%;
    height: 120px;
@@ -114,8 +103,24 @@
  }

  .mt-navBar {
    margin-top: $MOB_NAV_BAR;
    margin-top: calc($MOB_NAV_BAR * 2);
  }

  @include desktop {
    .mt-navBar {
      margin-top: calc($DESKTOP_NAV_BAR + $MOB_NAV_BAR);
    }
    .pam-page-container {
      width: 700px;
      margin: 30px auto;
    }
    .pam-banner__text{
      width: 700px;
      position: static !important;
      margin: 30px auto 0px auto;
    }
  }



  .pam-banner__text {
@@ -196,4 +201,16 @@
    }
  }

  .login {
    &-banner {
      background-image: url('~/assets/images/login/login_mob.svg');
    }

    @media (min-width: 768px) {
      &-banner {
        background-image: url('~/assets/images/login/login_web.svg');
      }
    }
  }

</style>