diff options
author | GeckoEidechse <gecko.eidechse+git@pm.me> | 2024-12-22 23:55:52 +0100 |
---|---|---|
committer | GeckoEidechse <gecko.eidechse+git@pm.me> | 2024-12-22 23:55:52 +0100 |
commit | f1dee718da95836ffa5c0985c9e8f5643e0f3f6f (patch) | |
tree | 24967a28bcae1fc1e5b08da9f58bcc678ed52937 /src | |
parent | cc5ae684221d3165479d7a68556a2bb6fa81cf3a (diff) | |
download | FlightCore-f1dee718da95836ffa5c0985c9e8f5643e0f3f6f.tar.gz FlightCore-f1dee718da95836ffa5c0985c9e8f5643e0f3f6f.zip |
dev: Replace with sample Tauri 2.0 project
as a first step to convert FlightCore to Tauri 2.0
Diffstat (limited to 'src')
-rw-r--r-- | src/App.vue | 151 | ||||
-rw-r--r-- | src/assets/vue.svg | 1 | ||||
-rw-r--r-- | src/main.ts | 4 | ||||
-rw-r--r-- | src/vite-env.d.ts | 7 |
4 files changed, 163 insertions, 0 deletions
diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 00000000..0426defe --- /dev/null +++ b/src/App.vue @@ -0,0 +1,151 @@ +<script setup lang="ts"> +import { ref } from "vue"; +import { invoke } from "@tauri-apps/api/core"; + +const greetMsg = ref(""); +const name = ref(""); + +async function greet() { + // Learn more about Tauri commands at https://tauri.app/develop/calling-rust/ + greetMsg.value = await invoke("greet", { name: name.value }); +} +</script> + +<template> + <main class="container"> + <h1>Welcome to Tauri + Vue</h1> + + <div class="row"> + </div> + <p>Click on the Tauri, Vite, and Vue logos to learn more.</p> + + <form class="row" @submit.prevent="greet"> + <input id="greet-input" v-model="name" placeholder="Enter a name..." /> + <button type="submit">Greet</button> + </form> + <p>{{ greetMsg }}</p> + </main> +</template> + +<style scoped> +.logo.vite:hover { + filter: drop-shadow(0 0 2em #747bff); +} + +.logo.vue:hover { + filter: drop-shadow(0 0 2em #249b73); +} + +</style> +<style> +:root { + font-family: Inter, Avenir, Helvetica, Arial, sans-serif; + font-size: 16px; + line-height: 24px; + font-weight: 400; + + color: #0f0f0f; + background-color: #f6f6f6; + + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + -webkit-text-size-adjust: 100%; +} + +.container { + margin: 0; + padding-top: 10vh; + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; +} + +.logo { + height: 6em; + padding: 1.5em; + will-change: filter; + transition: 0.75s; +} + +.logo.tauri:hover { + filter: drop-shadow(0 0 2em #24c8db); +} + +.row { + display: flex; + justify-content: center; +} + +a { + font-weight: 500; + color: #646cff; + text-decoration: inherit; +} + +a:hover { + color: #535bf2; +} + +h1 { + text-align: center; +} + +input, +button { + border-radius: 8px; + border: 1px solid transparent; + padding: 0.6em 1.2em; + font-size: 1em; + font-weight: 500; + font-family: inherit; + color: #0f0f0f; + background-color: #ffffff; + transition: border-color 0.25s; + box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); +} + +button { + cursor: pointer; +} + +button:hover { + border-color: #396cd8; +} +button:active { + border-color: #396cd8; + background-color: #e8e8e8; +} + +input, +button { + outline: none; +} + +#greet-input { + margin-right: 5px; +} + +@media (prefers-color-scheme: dark) { + :root { + color: #f6f6f6; + background-color: #2f2f2f; + } + + a:hover { + color: #24c8db; + } + + input, + button { + color: #ffffff; + background-color: #0f0f0f98; + } + button:active { + background-color: #0f0f0f69; + } +} + +</style> diff --git a/src/assets/vue.svg b/src/assets/vue.svg new file mode 100644 index 00000000..770e9d33 --- /dev/null +++ b/src/assets/vue.svg @@ -0,0 +1 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
\ No newline at end of file diff --git a/src/main.ts b/src/main.ts new file mode 100644 index 00000000..b670de8b --- /dev/null +++ b/src/main.ts @@ -0,0 +1,4 @@ +import { createApp } from "vue"; +import App from "./App.vue"; + +createApp(App).mount("#app"); diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts new file mode 100644 index 00000000..fc812394 --- /dev/null +++ b/src/vite-env.d.ts @@ -0,0 +1,7 @@ +/// <reference types="vite/client" /> + +declare module "*.vue" { + import type { DefineComponent } from "vue"; + const component: DefineComponent<{}, {}, any>; + export default component; +} |