bonus-ui/src/views/screen/wsScreen/index.vue

84 lines
1.7 KiB
Vue

<template>
<div class="wrap">
<div id="index" ref="appRef">
<div class="bg" id="app">
<el-row :gutter="0">
<el-col :span="7" :offset="0"><left /></el-col>
<el-col :span="10" :offset="0"><center /></el-col>
<el-col class="right" :span="7" :offset="0"><right /></el-col>
</el-row>
</div>
</div>
</div>
</template>
<script>
import drawMixin from '@/utils/drawMixin2'
import left from './components/left'
import center from './components/center'
import right from './components/right'
export default {
mixins: [drawMixin],
components: {
left,
center,
right,
},
data() {
return {}
},
mounted() {},
beforeDestroy() {},
methods: {},
}
</script>
<style lang="scss" scoped>
@font-face {
font-family: 'DS-TITle';
src: url('../../../assets/font-family/DS-Digital/DS-TITle.ttf');
}
@font-face {
font-family: 'Alibaba-PuHuiTi-Regular';
src: url('../../../assets/font-family/alibaba/Alibaba-PuHuiTi-Regular.ttf');
}
@font-face {
font-family: 'DIN';
src: url('../../../assets/font-family/DIN/DIN-Medium.otf');
}
.wrap {
width: 100%;
height: 100%;
background-color: #333;
}
#index {
color: #d3d6dd;
/* width: 100%;
height: 100%; */
width: 1920px;
height: 1080px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transform-origin: left top;
overflow: hidden;
background-image: url('../../screen/wsScreen/img/bg.jpg');
background-size: 100% 100%;
background-position: center center;
font-family: 'Alibaba-PuHuiTi-Regular';
.bg {
/* width: 100vw;
height: 100vh; */
/* padding: 79px 2% 0 2%; */
padding-top: 79px;
}
}
.right {
// 左移
margin-left: -20px;
}
</style>