<template>
  <div class="main">
    
  </div>
</template>

<script setup>
import { useFullscreen } from "@vueuse/core";
const { isFullscreen, enter, exit, toggle } = useFullscreen();
console.log("isFullscreen", isFullscreen);
</script>
<style>
.main {
  --main-left-background: #e2caa3;
  --main-right-background: #910000;
}
</style>

<style scoped>
.main {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
}
.left {
  flex: 0 0 70%;
  background-color: var(--main-left-background);
}
.right {
  flex: 0 0 30%;
  background-color: var(--main-right-background);
}
</style>
