gcs-user-interface/src/App.vue

65 lines
1.8 KiB
Vue

<script setup lang="ts">
// This starter template is using Vue 3 <script setup> SFCs
// Check out https://vuejs.org/api/sfc-script-setup.html#script-setup
import Greet from "./components/Greet.vue";
import Navbar from "./components/Navbar.vue";
import Camera from "./components/Camera.vue";
import { RouterView } from "vue-router";
</script>
<template>
<div>
<Navbar/>
</div>
<RouterView/>
<!-- <div class="container">
<h1>Welcome to Tauri!</h1>
<div class="row">
<a href="https://vitejs.dev" target="_blank">
<img src="/vite.svg" class="logo vite" alt="Vite logo" />
</a>
<a href="https://tauri.app" target="_blank">
<img src="/tauri.svg" class="logo tauri" alt="Tauri logo" />
</a>
<a href="https://vuejs.org/" target="_blank">
<img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
</a>
</div>
<p>Click on the Tauri, Vite, and Vue logos to learn more.</p>
<p>
Recommended IDE setup:
<a href="https://code.visualstudio.com/" target="_blank">VS Code</a>
+
<a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+
<a href="https://github.com/tauri-apps/tauri-vscode" target="_blank"
>Tauri</a
>
+
<a href="https://github.com/rust-lang/rust-analyzer" target="_blank"
>rust-analyzer</a
>
</p>
</div> -->
</template>
<style scoped>
.logo.vite:hover {
filter: drop-shadow(0 0 2em #747bff);
}
.logo.vue:hover {
filter: drop-shadow(0 0 2em #249b73);
}
.grid {
display: grid;
grid-template-columns: repeat(2, 1fr); /* 2 columns */
grid-template-rows: repeat(2, 46vh); /* 2 rows */
max-width: 100vw; /* Limit width to viewport width */
max-height: 100vh; /* Limit height to viewport height */
}
</style>