<template>
 <div id="app">
   <v-app light>
    <v-content>
      <section>
        <v-parallax src="/static/home1.jpg" height="600">
          <v-layout
            column
            align-center
            justify-center
            class="white--text"
          >
            <img src="/static/vuetify.png" alt="Vuetify.js" height="200">
            <h1 class="white--text mb-2 display-1 text-xs-center" style="font-weight:bold">Bio-omic Platform API</h1>
            <div class="subheading mb-3 text-xs-center" style="font-weight:bold"> Make Data Simple</div>
            <v-btn
              class="grey darken-3"
              dark
              large
              href="/pre-made-themes"
            >
              登陆/注册
            </v-btn>
          </v-layout>
        </v-parallax>
      </section>

      <section>
        <v-layout
          column
          wrap
          class="my-5"
          align-center
        >
          <v-flex xs12 sm4 class="my-3">
            <div class="text-xs-center">
              <h1 style="font-weight:bold;font-size:400%">一站式数据分析</h1>
              <span class="subheading">
              </span>
            </div>
          </v-flex>
          <v-flex xs12>
            <v-container grid-list-xl>
              <v-layout row wrap align-center>
                <v-flex xs12 md4>
                  <v-card class="elevation-0 transparent">
                    <v-card-text class="text-xs-center">
                      <v-icon x-large class="blue--text text--lighten-2">color_lens</v-icon>
                    </v-card-text>
                    <v-card-title primary-title class="layout justify-center">
                      <div class="headline text-xs-center" style="font-weight:bold">方便易用</div>
                    </v-card-title>
                    <v-card-text>
                      区别于传统的数据处理工具繁琐的操作流程，Data Fusion凭借高效易懂的UI涉及让您轻松上手。
                      数据可视化效果的即时呈现，更让您所见即所得！
                    </v-card-text>
                  </v-card>
                </v-flex>
                <v-flex xs12 md4>
                  <v-card class="elevation-0 transparent">
                    <v-card-text class="text-xs-center">
                      <v-icon x-large class="blue--text text--lighten-2">flash_on</v-icon>
                    </v-card-text>
                    <v-card-title primary-title class="layout justify-center">
                      <div class="headline" style="font-weight:bold">一站解决</div>
                    </v-card-title>
                    <v-card-text>
                      一个网站、一个云端、一个平台，满足您所有数据处理的需求。
                      Data Fusion协助您获取数据、融合数据、表现数据、管理数据，为您打造大数据的一站式解决方案！
                    </v-card-text>
                  </v-card>
                </v-flex>
                <v-flex xs12 md4>
                  <v-card class="elevation-0 transparent">
                    <v-card-text class="text-xs-center">
                      <v-icon x-large class="blue--text text--lighten-2">build</v-icon>
                    </v-card-text>
                    <v-card-title primary-title class="layout justify-center">
                      <div class="headline text-xs-center" style="font-weight:bold">稳定可靠</div>
                    </v-card-title>
                    <v-card-text>
                      Data Fusion通过稳健的后端构造和持续的系统优化，保证您的上手体验，同时也为您的数据安全保驾护航
                    </v-card-text>
                  </v-card>
                </v-flex>
              </v-layout>
            </v-container>
          </v-flex>
        </v-layout>
      </section>

      <section>
        <v-parallax src="/static/home2.jpg" height="380">
          <v-layout column align-center justify-center>
            <h1 class="white--text mb-2 display-1 text-xs-center" style="font-weight:bold">Connect all data</h1>
            <div class="subheading mb-3 text-xs-center" style="font-weight:bold">Make Data Sharable</div>
            <v-btn
              class="grey darken-3"
              dark
              large
              href="/pre-made-themes"
            >
              登陆/注册
            </v-btn>
          </v-layout>
        </v-parallax>
      </section>

      <!-- <section>
        <v-container grid-list-xl>
          <v-layout row wrap justify-center class="my-5">
            <v-flex xs12 sm4>
              <v-card class="elevation-0 transparent">
                <v-card-title primary-title class="layout justify-center">
                  <div class="headline">数据集成分析平台简介</div>
                </v-card-title>
                <v-card-text>
                  树融科技数据集成分析是树融公司独立开发的全功能数据分析利器，
                  重在将数据分析过程中复杂的清洗、提取、可视化、运算、建模等过程简化，
                  用最方便快捷的方式将各种数据中的价值挖掘出来。
                </v-card-text>
              </v-card>
            </v-flex>
            <v-flex xs12 sm4 offset-sm1>
              <v-card class="elevation-0 transparent">
                <v-card-title primary-title class="layout justify-center">
                  <div class="headline">联系我们</div>
                </v-card-title>
                <v-card-text>
                  某某地址
                </v-card-text>
                <v-list class="transparent">
                  <v-list-tile>
                    <v-list-tile-action>
                      <v-icon class="blue--text text--lighten-2">电话</v-icon>
                    </v-list-tile-action>
                    <v-list-tile-content>
                      <v-list-tile-title>+86-xxxxxxx</v-list-tile-title>
                    </v-list-tile-content>
                  </v-list-tile>
                  <v-list-tile>
                    <v-list-tile-action>
                      <v-icon class="blue--text text--lighten-2">地址</v-icon>
                    </v-list-tile-action>
                    <v-list-tile-content>
                      <v-list-tile-title>上海, 中国</v-list-tile-title>
                    </v-list-tile-content>
                  </v-list-tile>
                  <v-list-tile>
                    <v-list-tile-action>
                      <v-icon class="blue--text text--lighten-2">邮件l</v-icon>
                    </v-list-tile-action>
                    <v-list-tile-content>
                      <v-list-tile-title>test@email</v-list-tile-title>
                    </v-list-tile-content>
                  </v-list-tile>
                </v-list>
              </v-card>
            </v-flex>
          </v-layout>
        </v-container>
      </section> -->
    </v-content>
  </v-app>
 </div>
</template>

<script>
export default {
}
</script>