aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/App.vue
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/App.vue')
-rw-r--r--frontend/src/App.vue85
1 files changed, 0 insertions, 85 deletions
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
deleted file mode 100644
index 7905b05..0000000
--- a/frontend/src/App.vue
+++ /dev/null
@@ -1,85 +0,0 @@
1<script setup lang="ts">
2import { RouterLink, RouterView } from 'vue-router'
3import HelloWorld from './components/HelloWorld.vue'
4</script>
5
6<template>
7 <header>
8 <img alt="Vue logo" class="logo" src="@/assets/logo.svg" width="125" height="125" />
9
10 <div class="wrapper">
11 <HelloWorld msg="You did it!" />
12
13 <nav>
14 <RouterLink to="/">Home</RouterLink>
15 <RouterLink to="/about">About</RouterLink>
16 </nav>
17 </div>
18 </header>
19
20 <RouterView />
21</template>
22
23<style scoped>
24header {
25 line-height: 1.5;
26 max-height: 100vh;
27}
28
29.logo {
30 display: block;
31 margin: 0 auto 2rem;
32}
33
34nav {
35 width: 100%;
36 font-size: 12px;
37 text-align: center;
38 margin-top: 2rem;
39}
40
41nav a.router-link-exact-active {
42 color: var(--color-text);
43}
44
45nav a.router-link-exact-active:hover {
46 background-color: transparent;
47}
48
49nav a {
50 display: inline-block;
51 padding: 0 1rem;
52 border-left: 1px solid var(--color-border);
53}
54
55nav a:first-of-type {
56 border: 0;
57}
58
59@media (min-width: 1024px) {
60 header {
61 display: flex;
62 place-items: center;
63 padding-right: calc(var(--section-gap) / 2);
64 }
65
66 .logo {
67 margin: 0 2rem 0 0;
68 }
69
70 header .wrapper {
71 display: flex;
72 place-items: flex-start;
73 flex-wrap: wrap;
74 }
75
76 nav {
77 text-align: left;
78 margin-left: -1rem;
79 font-size: 1rem;
80
81 padding: 1rem 0;
82 margin-top: 1rem;
83 }
84}
85</style>