1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
| <script setup lang="ts">
| defineProps<{
| msg: string
| }>()
| </script>
|
| <template>
| <div class="greetings">
| <h1 class="green ">{{ msg }}</h1>
| <h3>
| You’ve successfully created a project with
| <a href="https://vitejs.dev/" target="_blank" rel="noopener">Vite</a> +
| <a href="https://vuejs.org/" target="_blank" rel="noopener">Vue 3</a>. What's next?
| </h3>
| </div>
| </template>
|
| <style scoped>
| h1 {
| font-weight: 500;
| font-size: 2.6rem;
| top: -10px;
| }
|
| h3 {
| font-size: 1.2rem;
| }
|
| .greetings h1,
| .greetings h3 {
| text-align: center;
| }
|
| @media (min-width: 1024px) {
| .greetings h1,
| .greetings h3 {
| text-align: left;
| }
| }
| </style>
|
|