44 lines
705 B
Vue
44 lines
705 B
Vue
<template>
|
|
<div class="ueScreen">
|
|
<Header />
|
|
<LeftPage />
|
|
</div>
|
|
<div class="right">
|
|
<Right />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Header from './components/header.vue';
|
|
import LeftPage from './components/leftPage.vue';
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
$vm_base: 1920;
|
|
$vh_base: 1080;
|
|
// 计算vw
|
|
@function vw($px) {
|
|
@return calc(($px / $vm_base) * 100vw);
|
|
}
|
|
|
|
// 计算vh
|
|
@function vh($px) {
|
|
@return calc(($px / $vh_base) * 100vh);
|
|
}
|
|
|
|
.ueScreen {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background-color: rgba(4, 7, 17, 0.8);
|
|
color: #fff;
|
|
}
|
|
|
|
.right {
|
|
position: absolute;
|
|
top: vh(60);
|
|
right: vw(20);
|
|
width: 25vw;
|
|
height: calc(100vh - vh(80));
|
|
}
|
|
</style>
|