Skip to content

Commit 29cbb83

Browse files
committed
chore: snapshot
1 parent 590a82c commit 29cbb83

File tree

200 files changed

+6438
-942
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

200 files changed

+6438
-942
lines changed

playground/default/src/App.vue

Lines changed: 10 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -113,18 +113,6 @@ header {
113113
line-height: 1.5;
114114
}
115115
116-
.color-scheme-switcher {
117-
position: absolute;
118-
left: 0;
119-
top: 20px;
120-
121-
border: none;
122-
background: transparent;
123-
124-
color: var(--color-text);
125-
cursor: pointer;
126-
}
127-
128116
.logo {
129117
display: block;
130118
margin: 0 auto 2rem;
@@ -137,8 +125,10 @@ a,
137125
transition: 0.4s;
138126
}
139127
140-
a:hover {
141-
background-color: hsla(160, 100%, 37%, 0.2);
128+
@media (hover: hover) {
129+
a:hover {
130+
background-color: hsla(160, 100%, 37%, 0.2);
131+
}
142132
}
143133
144134
@media (min-width: 1024px) {
@@ -147,6 +137,12 @@ a:hover {
147137
place-items: center;
148138
}
149139
140+
#app {
141+
display: grid;
142+
grid-template-columns: 1fr 1fr;
143+
padding: 0 2rem;
144+
}
145+
150146
header {
151147
display: flex;
152148
place-items: center;
@@ -162,26 +158,5 @@ a:hover {
162158
.logo {
163159
margin: 0 2rem 0 0;
164160
}
165-
166-
#app {
167-
display: grid;
168-
grid-template-columns: 1fr 1fr;
169-
padding: 0 2rem;
170-
}
171-
172-
.router-links {
173-
margin-top: 1rem;
174-
text-align: left;
175-
}
176-
177-
.router-links a {
178-
padding: 0 0.5rem 0 0;
179-
background-color: transparent;
180-
}
181-
182-
.router-links a + a {
183-
border-left: 0;
184-
margin-left: 0.2rem;
185-
}
186161
}
187162
</style>

playground/default/src/assets/base.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@
3131
--color-border-hover: var(--vt-c-divider-light-1);
3232

3333
--color-heading: var(--vt-c-text-light-1);
34-
--color-text: var(--vt-c-text-light-2);
34+
--color-text: var(--vt-c-text-light-1);
3535

3636
--section-gap: 160px;
3737
}

playground/default/src/components/ColorSchemeSwitch.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ watchEffect(() => {
130130
}
131131
132132
.color-scheme-switch-wrapper .text {
133-
font-size: 1.3em;
133+
font-size: 1.2rem;
134134
font-weight: normal;
135135
}
136136
}

playground/default/src/components/HelloWorld.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ h1 {
2626
}
2727
2828
h3 {
29-
font-size: 1.3rem;
29+
font-size: 1.2rem;
3030
}
3131
3232
.greetings h1,

playground/default/src/components/IntroductionItem.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,8 @@ i {
3434
}
3535
3636
h3 {
37-
font-size: 1.3rem;
37+
font-size: 1.2rem;
38+
font-weight: 500;
3839
margin-bottom: 0.4rem;
3940
color: var(--color-heading);
4041
}

playground/jsx-router-vuex-with-tests/cypress/integration/example.spec.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
describe('My First Test', () => {
44
it('visits the app root url', () => {
55
cy.visit('/')
6-
cy.contains('h1', 'Hello Vue 3 + Vite')
6+
cy.contains('h1', 'You did it!')
77
})
88

99
it('navigates to the about page', () => {
Lines changed: 104 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,120 @@
1+
<script setup>
2+
import HelloWorld from '@/components/HelloWorld.vue'
3+
import ColorSchemeSwitch from '@/components/ColorSchemeSwitch.vue'
4+
</script>
5+
16
<template>
2-
<div id="nav">
3-
<router-link to="/">Home</router-link> |
4-
<router-link to="/about">About</router-link>
5-
</div>
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+
<ColorSchemeSwitch />
13+
14+
<div id="nav">
15+
<router-link to="/">Home</router-link>
16+
<router-link to="/about">About</router-link>
17+
</div>
18+
</div>
19+
</header>
20+
621
<router-view />
722
</template>
823

924
<style>
25+
@import '@/assets/base.css';
26+
1027
#app {
11-
font-family: Avenir, Helvetica, Arial, sans-serif;
12-
-webkit-font-smoothing: antialiased;
13-
-moz-osx-font-smoothing: grayscale;
14-
text-align: center;
15-
color: #2c3e50;
28+
max-width: 1280px;
29+
margin: 0 auto;
30+
padding: 2rem;
31+
32+
font-weight: normal;
33+
}
34+
35+
header {
36+
line-height: 1.5;
37+
max-height: 100vh;
38+
}
39+
40+
.logo {
41+
display: block;
42+
margin: 0 auto 2rem;
43+
}
44+
45+
a,
46+
.green {
47+
text-decoration: none;
48+
color: hsla(160, 100%, 37%, 1);
49+
transition: 0.4s;
50+
}
51+
52+
@media (hover: hover) {
53+
a:hover {
54+
background-color: hsla(160, 100%, 37%, 0.2);
55+
}
1656
}
1757
1858
#nav {
19-
padding: 30px;
59+
width: 100%;
60+
font-size: 12px;
61+
text-align: center;
62+
margin-top: 2rem;
63+
}
64+
65+
#nav a.router-link-exact-active {
66+
color: var(--color-text);
67+
}
68+
69+
#nav a.router-link-exact-active:hover {
70+
background-color: transparent;
2071
}
2172
2273
#nav a {
23-
font-weight: bold;
24-
color: #2c3e50;
74+
display: inline-block;
75+
padding: 0 1rem;
76+
border-left: 1px solid var(--color-border);
2577
}
2678
27-
#nav a.router-link-exact-active {
28-
color: #42b983;
79+
#nav a:first-of-type {
80+
border: 0;
81+
}
82+
83+
@media (min-width: 1024px) {
84+
body {
85+
display: flex;
86+
place-items: center;
87+
}
88+
89+
#app {
90+
display: grid;
91+
grid-template-columns: 1fr 1fr;
92+
padding: 0 2rem;
93+
}
94+
95+
header {
96+
display: flex;
97+
place-items: center;
98+
padding-right: calc(var(--section-gap) / 2);
99+
}
100+
101+
header .wrapper {
102+
display: flex;
103+
place-items: flex-start;
104+
flex-wrap: wrap;
105+
}
106+
107+
.logo {
108+
margin: 0 2rem 0 0;
109+
}
110+
111+
#nav {
112+
text-align: left;
113+
margin-left: -1rem;
114+
font-size: 1rem;
115+
116+
padding: 1rem 0;
117+
margin-top: 1rem;
118+
}
29119
}
30120
</style>
Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
/* color palette from <https://github.com/vuejs/theme> */
2+
:root {
3+
--vt-c-white: #ffffff;
4+
--vt-c-white-soft: #f8f8f8;
5+
--vt-c-white-mute: #f2f2f2;
6+
7+
--vt-c-black: #181818;
8+
--vt-c-black-soft: #222222;
9+
--vt-c-black-mute: #282828;
10+
11+
--vt-c-indigo: #2c3e50;
12+
13+
--vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
14+
--vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
15+
--vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
16+
--vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
17+
18+
--vt-c-text-light-1: var(--vt-c-indigo);
19+
--vt-c-text-light-2: rgba(60, 60, 60, 0.66);
20+
--vt-c-text-dark-1: var(--vt-c-white);
21+
--vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
22+
}
23+
24+
/* semantic color variables for this project */
25+
:root {
26+
--color-background: var(--vt-c-white);
27+
--color-background-soft: var(--vt-c-white-soft);
28+
--color-background-mute: var(--vt-c-white-mute);
29+
30+
--color-border: var(--vt-c-divider-light-2);
31+
--color-border-hover: var(--vt-c-divider-light-1);
32+
33+
--color-heading: var(--vt-c-text-light-1);
34+
--color-text: var(--vt-c-text-light-1);
35+
36+
--section-gap: 160px;
37+
}
38+
39+
[data-color-scheme='dark'] {
40+
--color-background: var(--vt-c-black);
41+
--color-background-soft: var(--vt-c-black-soft);
42+
--color-background-mute: var(--vt-c-black-mute);
43+
44+
--color-border: var(--vt-c-divider-dark-2);
45+
--color-border-hover: var(--vt-c-divider-dark-1);
46+
47+
--color-heading: var(--vt-c-text-dark-1);
48+
--color-text: var(--vt-c-text-dark-2);
49+
}
50+
51+
*,
52+
*::before,
53+
*::after {
54+
box-sizing: border-box;
55+
margin: 0;
56+
position: relative;
57+
font-weight: normal;
58+
}
59+
60+
body {
61+
min-height: 100vh;
62+
color: var(--color-text);
63+
background: var(--color-background);
64+
transition: color 0.5s, background-color 0.5s;
65+
line-height: 1.6;
66+
font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
67+
Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
68+
font-size: 15px;
69+
text-rendering: optimizeLegibility;
70+
-webkit-font-smoothing: antialiased;
71+
-moz-osx-font-smoothing: grayscale;
72+
}
Lines changed: 1 addition & 0 deletions
Loading

0 commit comments

Comments
 (0)