dev-audioprocessing/pages/index.vue

65 lines
1.6 KiB
Vue

<template>
<div>
<div class="container-fluid">
<div class="row">
<div class="col-12">
<video-background
src="video/bg-video.mp4"
style="max-height: 400px; height: 100vh;"
>
<h1 style="color: white;">Hello welcome!</h1>
</video-background>
<!-- <video muted id="myVideo" autoplay loop>-->
<!-- <source src="~/assets/video/bg-video.mp4" type="video/mp4">-->
<!-- <source src="~/assets/video/bg-video.ogg" type="video/ogg">-->
<!-- Your browser does not support HTML5 video.-->
<!-- </video>-->
</div>
</div>
</div>
<home-bar />
<div class="container-fluid">
<div class="row">
<div class="col-12 ">
<div class="d-flex justify-content-center adaptive mb-4">
<span class="text-muted fw-bold fs-6 ">Adaptive soundscape : <span class="" style="color: #e9c046">On</span> </span><span class="ps-3"><i class="fa-solid text-muted d-flex pt-1 mt-1 fa-chevron-right"></i></span>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import HomeBar from "../components/homebar";
export default {
components: {HomeBar},
methods:{
handleAnimation: function (anim) {
this.anim = anim;
}
}
}
</script>
<style>
#myVideo{
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
padding: 0;
margin: 0;
z-index: -99;
}
.adaptive{
position: fixed;
bottom: 0;
text-align: center;
width: 100%;
}
</style>