<template>
  <div class="body-wrapper">
    <BannerPage></BannerPage>
    <InviteCode class="mg"></InviteCode>
    <FriendList class="mg"></FriendList>
    <BankStatus class="mg"></BankStatus>
    <RecordList class="mg"></RecordList>
    <DescPage class="mg"></DescPage>
  </div>
</template>

<script>
import InviteCode from './components/invite-code';
import FriendList from './components/friend-list';
import BankStatus from './components/bankcard-status';
import RecordList from './components/record-list';
import DescPage from '../components/desc';
import BannerPage from './components/banner';

export default {
  name: 'detailPage',
  components: {
    InviteCode,
    FriendList,
    BankStatus,
    RecordList,
    DescPage,
    BannerPage
  }
};
</script>

<style lang="scss" scoped>
.body-wrapper {
  padding: 0 20PX;
  background-color: #08304b;
}

.mg {
  margin: 0 auto;
  margin-bottom: 110px;
  text-align: center;

  &:last-child {
    margin-bottom: 0;
    padding-bottom: 120px;
  }
}

</style>