<template>
  <div class="body">
    <div class="bg">
      <div class="mobile_box">
        <div class="logo">
          <img class="mobile_logo" src="../assets/images/bob-logo.png" />
        </div>
        <div class="ewm">
          <div id="qrcode1">
            <vue-qr :text="url" :size="192"></vue-qr>
          </div>
        </div>
        <span class="title1">TG体育手机客户端下载</span>
        <br />
        <span class="scan1">扫一扫下载APP</span>
        <span class="cnt"
          >在这里，有全网最丰富的游戏、最贴心的优惠、最卓越的用户体验，全年无休的技术支持，稳定陪伴您畅快游戏。小体积，大容量，娱乐真的可以信手拈来！</span
        >
      </div>
    </div>
  </div>
</template>

<script>
import VueQr from "vue-qr";
export default {
  name: "PcIndex",
  components: { VueQr },
  computed: {
    url() {
      return location.href;
    },
  },
};
</script>
<style>
body {
  margin: 0;
  padding: 0;
}
</style>
<style scoped>
.body {
  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC,
    Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, sans-serif;
}
.bg {
  width: 100%;
  height: 100vh;
  margin: 0 auto;
  background: url(../assets/images/bg_down2.jpg) top center no-repeat;
  background-size: cover;
}
.mobile_box {
  width: 380px;
  text-align: center;
  position: absolute;
  left: 10%;
  top: 14%;
}
.logo {
  display: inline-block;
  width: 239px;
  margin-bottom: 30px;
}
.mobile_logo {
  width: 239px;
  text-align: center;
}
.ewm {
  display: inline-block;
  background: #fff;
  width: 235px;
  height: 235px;
  box-sizing: border-box;
  margin-bottom: 30px;
  border-radius: 6px;
}
.title1 {
  display: inline-block;
  font-size: 30px;
  font-weight: 700;
  color: #8d531b;
  font-style: italic;
  letter-spacing: 2px;
}
.scan1 {
  display: inline-block;
  font-size: 18px;
  color: #8d531b;
  font-weight: 700;
  line-height: 40px;
  font-style: italic;
}
.cnt {
  display: inline-block;
  font-size: 15px;
  color: #5c5e6a;
  text-align: center;
  line-height: 24px;
  margin-top: 30px;
  font-weight: 600;
}
#qrcode1 {
  width: 205px;
  height: 205px;
  box-sizing: border-box;
  border: 1px solid #d7cec5;
  background: #fff;
  padding: 5px;
  margin: 0 auto;
  margin-top: 15px;
}
</style>>
