42 lines
860 B
Vue

<script setup>
import VideoMonitor from './VideoMonitor.vue'
import DataChart from './DataChart.vue'
</script>
<template>
<div class="center-panel-container">
<div class="video-section">
<VideoMonitor />
</div>
<div class="chart-section">
<DataChart />
</div>
</div>
</template>
<style lang="scss" scoped>
.center-panel-container {
height: 100%;
display: flex;
flex-direction: column;
gap: 16px;
.video-section {
flex: 3;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
backdrop-filter: blur(4px);
overflow: hidden;
}
.chart-section {
flex: 2;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
backdrop-filter: blur(4px);
overflow: hidden;
}
}
</style>