<template>
  <div class="container">
    <mobile-header current-section="home"></mobile-header>
    <mobile-top-section></mobile-top-section>
    <mobile-center-section></mobile-center-section>
    <hero-section></hero-section>
    <investors-section></investors-section>
    <partner-section></partner-section>
    <mobile-footer></mobile-footer>
  </div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import MobileHeader from '@/components/mobile/main/MobileHeader.vue'
import MobileTopSection from '@/components/mobile/main/TopSection.vue'
import MobileCenterSection from '@/components/mobile/main/CenterSection.vue'
import HeroSection from '@/components/index/HeroSection.vue'
import InvestorsSection from '@/components/index/InvestorsSection.vue'
import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
import PartnerSection from '@/components/index/PartnerSection.vue'

@Component({
  name: 'MobileIndex',
  components: {
    PartnerSection,
    MobileFooter,
    InvestorsSection,
    HeroSection,
    MobileCenterSection,
    MobileTopSection,
    MobileHeader
  }
})
export default class MobileIndex extends Vue {}
</script>
<style lang="scss" scoped>
.container{
  width: 100vw;
  margin: 10.4vw auto 0;
  background-color: #2E2E2E;
}
</style>
