feat: update UI
This commit is contained in:
1 parent
6c3ed25a43
commit
0aead4d551
9 files changed
+77
-59
No files matched your search
@@ -4,13 +4,13 @@ const { count, inc, dec } = useCount()
|
||||
|
||||
<template>
|
||||
<div inline-flex m="y-3">
|
||||
<button btn class="!p-2" @click="dec()">
|
||||
<button btn p-2 rounded-full @click="dec()">
|
||||
<div i-carbon-subtract></div>
|
||||
</button>
|
||||
<div font="mono" w="15" m-auto inline-block>
|
||||
{{ count }}
|
||||
</div>
|
||||
<button btn class="!p-2" @click="inc()">
|
||||
<button btn p-2 rounded-full @click="inc()">
|
||||
<div i-carbon-add></div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div
|
||||
text="2xl gray-500"
|
||||
text="xl gray4"
|
||||
m-5
|
||||
flex
|
||||
justify-center
|
||||
gap-2
|
||||
gap-3
|
||||
>
|
||||
<NuxtLink i-carbon-campsite to="/" />
|
||||
<a i-carbon-logo-github href="https://github.com/antfu/vitesse-nuxt3" target="__blank" />
|
||||
|
||||
@@ -9,6 +9,7 @@ const go = () => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<input
|
||||
id="input"
|
||||
v-model="name"
|
||||
@@ -33,4 +34,5 @@ const go = () => {
|
||||
GO
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<div inline-flex text-2xl font-300 cursor-default>
|
||||
<div flex flex-col children:mx-auto>
|
||||
<img w-18 inline-block src="/nuxt.png" />
|
||||
<span text-green5 mt--2>Nuxt 3</span>
|
||||
</div>
|
||||
<div
|
||||
text="3xl gray4"
|
||||
m="x-4 y-auto"
|
||||
transition-all-500
|
||||
transform
|
||||
hover:rotate-135
|
||||
i-carbon-add
|
||||
/>
|
||||
<div flex flex-col children:mx-auto>
|
||||
<img w-18 inline-block src="/vite.png" />
|
||||
<span text-purple5 mt--2>Vitesse</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -5,7 +5,7 @@ const time = useTimeAgo(computed(() => data.value.startAt))
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div text-gray>
|
||||
<span font-500>{{ data.pageview }}</span> page views since <span font-500>{{ time }}</span>
|
||||
<div text-gray:50>
|
||||
<span font-500 text-gray>{{ data.pageview }}</span> page views since <span text-gray>{{ time }}</span>
|
||||
</div>
|
||||
</template>
|
||||
+2
-2
@@ -8,11 +8,11 @@
|
||||
"devDependencies": {
|
||||
"@antfu/eslint-config": "^0.10.0",
|
||||
"@iconify/json": "^1.1.423",
|
||||
"@unocss/nuxt": "^0.5.1",
|
||||
"@unocss/nuxt": "^0.6.1",
|
||||
"@vueuse/core": "^6.7.6",
|
||||
"eslint": "^8.1.0",
|
||||
"nuxt3": "latest",
|
||||
"typescript": "^4.4.4",
|
||||
"unocss": "^0.5.1"
|
||||
"unocss": "^0.6.1"
|
||||
}
|
||||
}
|
||||
+8
-6
@@ -7,20 +7,22 @@ const name = route.params.id
|
||||
<template>
|
||||
<div>
|
||||
<div i-twemoji:waving-hand text-4xl inline-block animate-bounce></div>
|
||||
<h3 text-2xl>
|
||||
Hi!
|
||||
<h3 text-2xl font-500>
|
||||
Hi,
|
||||
</h3>
|
||||
<div>{{ name }}</div>
|
||||
<div text-xl>
|
||||
{{ name }}!
|
||||
</div>
|
||||
|
||||
<Counter />
|
||||
|
||||
<div>
|
||||
<NuxtLink
|
||||
class="btn m-3 text-sm mt-6"
|
||||
class="btn m-3 text-sm"
|
||||
to="/"
|
||||
>
|
||||
Back
|
||||
</NuxtLink>
|
||||
</div>
|
||||
|
||||
<Counter />
|
||||
</div>
|
||||
</template>
|
||||
+1
-7
@@ -1,12 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<img w-16 inline-block src="/nuxt.png" />
|
||||
<img w-16 inline-block src="/vite.png" />
|
||||
<h1 mt-1 text-2xl cursor-default>
|
||||
<span text-green-500 hover:text-white hover:bg-green-600>Nuxt 3</span>
|
||||
<span text-gray-400 mx-2>+</span>
|
||||
<span text-purple-500>Vitesse</span>
|
||||
</h1>
|
||||
<Logos mb-6 />
|
||||
<Suspense>
|
||||
<PageView />
|
||||
<template #fallback>
|
||||
|
||||
Generated
+38
-38
@@ -3,22 +3,22 @@ lockfileVersion: 5.3
|
||||
specifiers:
|
||||
'@antfu/eslint-config': ^0.10.0
|
||||
'@iconify/json': ^1.1.423
|
||||
'@unocss/nuxt': ^0.5.1
|
||||
'@unocss/nuxt': ^0.6.1
|
||||
'@vueuse/core': ^6.7.6
|
||||
eslint: ^8.1.0
|
||||
nuxt3: latest
|
||||
typescript: ^4.4.4
|
||||
unocss: ^0.5.1
|
||||
unocss: ^0.6.1
|
||||
|
||||
devDependencies:
|
||||
'@antfu/eslint-config': 0.10.0_eslint@8.1.0+typescript@4.4.4
|
||||
'@iconify/json': 1.1.423
|
||||
'@unocss/nuxt': 0.5.1
|
||||
'@unocss/nuxt': 0.6.1
|
||||
'@vueuse/core': 6.7.6
|
||||
eslint: 8.1.0
|
||||
nuxt3: 3.0.0-27267816.6bd7186
|
||||
typescript: 4.4.4
|
||||
unocss: 0.5.1
|
||||
unocss: 0.6.1
|
||||
|
||||
packages:
|
||||
|
||||
@@ -1001,60 +1001,60 @@ packages:
|
||||
eslint-visitor-keys: 3.0.0
|
||||
dev: true
|
||||
|
||||
/@unocss/config/0.5.1:
|
||||
resolution: {integrity: sha512-4AzkxLnWuUHVZC/Ao4X0wsu5x3McB38I1yEnuOmTGADXgzrnBaeDV4HCpycYrhINlOAlfMGuoZ3kaIznR+3YMQ==}
|
||||
/@unocss/config/0.6.1:
|
||||
resolution: {integrity: sha512-E8sJtn7Nh94E/8dKJDkAECcaVacPmuHj1YbIJDxhaH5o36uamivMI6uQE393/HHZ8fyiW/2Mm5QtP1kCqy8LHg==}
|
||||
engines: {node: '>=14'}
|
||||
dependencies:
|
||||
'@unocss/core': 0.5.1
|
||||
'@unocss/core': 0.6.1
|
||||
sucrase: 3.20.3
|
||||
dev: true
|
||||
|
||||
/@unocss/core/0.5.1:
|
||||
resolution: {integrity: sha512-QGVm1h3BumjobzKFBppSf5OYYcH73bEUHiUyfsEDL1K2JzSswE+ugBw13NuCyIH442o8M7N3OEUIWjzs5gYy+g==}
|
||||
/@unocss/core/0.6.1:
|
||||
resolution: {integrity: sha512-eEJSrFFjbUh7/K+nLe1U3zkSSusqsXax1xM8gxjvRqrCeJC7fY/U4u1AwiWdGHjvObVIZXIAzoOd9PLBafMHag==}
|
||||
dev: true
|
||||
|
||||
/@unocss/nuxt/0.5.1:
|
||||
resolution: {integrity: sha512-IubhlFC97Yu13GvVjd8Lm4WsA+t4bl4BmcoiO4P9KvgYvFolC4Xq3ZR0ef+nUCxylJLkp/+bqHYetcVJeBGxEg==}
|
||||
/@unocss/nuxt/0.6.1:
|
||||
resolution: {integrity: sha512-dQyUrNnZndicUCttlituOivVB5ZJGbKIX5C+Rks0c3jhiaDw5U12RsbterxRUXGRzwxsIOehGXmh0dQzrqHClg==}
|
||||
dependencies:
|
||||
'@nuxt/kit': /@nuxt/kit-edge/3.0.0-27267816.6bd7186
|
||||
unocss: 0.5.1
|
||||
unocss: 0.6.1
|
||||
dev: true
|
||||
|
||||
/@unocss/preset-attributify/0.5.1:
|
||||
resolution: {integrity: sha512-42oDw9iW/bP7xWkWnCaHLph1FQokYu9zjuErxYGvNNk8umGP/DxzFC3/BdMlAswzUDcVZgNsE7WJI3YZdf/vFA==}
|
||||
/@unocss/preset-attributify/0.6.1:
|
||||
resolution: {integrity: sha512-FnHec33XF1zTkh5BFfLTOe/EsYMRMlZUT6IoutBQIBf3/rwz9xNSLVwqVKqwD9mjYWvC5WvpekuYWJfoQ8TBSQ==}
|
||||
dependencies:
|
||||
'@unocss/core': 0.5.1
|
||||
'@unocss/core': 0.6.1
|
||||
dev: true
|
||||
|
||||
/@unocss/preset-icons/0.5.1:
|
||||
resolution: {integrity: sha512-qt2wBccudSv3ciKLJ8MjHDSX17aplChmLAHV8NQe8AxBLvxVTPUvx3fVyPoopbcoioYstS1tWkqEazbk/CZFLQ==}
|
||||
/@unocss/preset-icons/0.6.1:
|
||||
resolution: {integrity: sha512-KWvfEZIjtXGW4sZYBjTjJF02DW4JLYf9tQwbjkVM87o9460ptU91JCzMoT562IY8mxy6l+GmuGJyYMhb9BfkjQ==}
|
||||
dependencies:
|
||||
'@iconify/utils': 1.0.18
|
||||
'@unocss/core': 0.5.1
|
||||
'@unocss/core': 0.6.1
|
||||
local-pkg: 0.4.0
|
||||
dev: true
|
||||
|
||||
/@unocss/preset-uno/0.5.1:
|
||||
resolution: {integrity: sha512-siOQRK8WlDBZljjvzrgLkLfw8UxB+YUjDiwvJY59m8PSGjHyuQiY9tuCDVbPDd3XkMBHGE7oZgLVuzR6Waygzw==}
|
||||
/@unocss/preset-uno/0.6.1:
|
||||
resolution: {integrity: sha512-z9hTbfyYh3RDrmADYk3dZSYv9C9iF+RvOQrOVH8z1jBPj7D17ZYT/oKawO68bpqyM+hsSARkGHNpI1W0y8+4Nw==}
|
||||
dependencies:
|
||||
'@unocss/core': 0.5.1
|
||||
'@unocss/core': 0.6.1
|
||||
dev: true
|
||||
|
||||
/@unocss/reset/0.5.1:
|
||||
resolution: {integrity: sha512-oSYmiUtcMeeMJDITBSp52ro6HGgpszswsV4X7qYQPO7NQVfv6awIWVSkm7zJj8znhxqCiDziur8v3OnxdsnncA==}
|
||||
/@unocss/reset/0.6.1:
|
||||
resolution: {integrity: sha512-GbKViNVaEl+YdGa7kJaBnXYpYgLg3TlXSW2ktptiQgCUdbMZDCPkO80cbr3nlVExjxEAxBR2arJGENh4+CafTg==}
|
||||
dev: true
|
||||
|
||||
/@unocss/scope/0.5.1:
|
||||
resolution: {integrity: sha512-KjAOhsOYKFNZfnqYKd+AqJCQ4Wb2Hlix7E509i0dTFhlY43tk0ofsy+NG/2PLst4Xy+HV2d+ToV14jOLXeYTmQ==}
|
||||
/@unocss/scope/0.6.1:
|
||||
resolution: {integrity: sha512-iovbZyykTbqx0/5afR/afYNHsTLFBhn1JNaBx9AncPTVcSX2tRGKae0RXGgoQxbsVcNbls9/tNTz4yAKROtm0w==}
|
||||
dev: true
|
||||
|
||||
/@unocss/vite/0.5.1:
|
||||
resolution: {integrity: sha512-Hk+EnjgA6YReyKga0Y2nzTa+ZJJOOhwRnpiUTP9Vi/TW1UH6ARzZ/H66pcMLEfaNgfWPHyHYrB1doXteCV72ZA==}
|
||||
/@unocss/vite/0.6.1:
|
||||
resolution: {integrity: sha512-VG4OkK3o3fQrCMm5XkRi0MsYveNhWuQ8XpVYQXLLciJCiDWIYblPzlm0ZK9u3PwqTmWzC4wXTVW9Q7OBzmCgXQ==}
|
||||
dependencies:
|
||||
'@rollup/pluginutils': 4.1.1
|
||||
'@unocss/config': 0.5.1
|
||||
'@unocss/core': 0.5.1
|
||||
'@unocss/scope': 0.5.1
|
||||
'@unocss/config': 0.6.1
|
||||
'@unocss/core': 0.6.1
|
||||
'@unocss/scope': 0.6.1
|
||||
dev: true
|
||||
|
||||
/@vercel/nft/0.17.0:
|
||||
@@ -6608,16 +6608,16 @@ packages:
|
||||
engines: {node: '>= 10.0.0'}
|
||||
dev: true
|
||||
|
||||
/unocss/0.5.1:
|
||||
resolution: {integrity: sha512-6OMaaJEgRvLfwcxiYka0zpf0yNUm0t8QMr+I+sjxKWdar23NNDmO3a5crJj0rgvvaHR1tlOu2nIosw6dRV/Cig==}
|
||||
/unocss/0.6.1:
|
||||
resolution: {integrity: sha512-ygpeYK8Kbu7Vga9UdOps1jA3YWekD42/rzYy4FI+EhRTe5FtZDnhnXVPuSYWamYgVk6WIsVol3cYkPj5wynDkw==}
|
||||
engines: {node: '>=14'}
|
||||
dependencies:
|
||||
'@unocss/core': 0.5.1
|
||||
'@unocss/preset-attributify': 0.5.1
|
||||
'@unocss/preset-icons': 0.5.1
|
||||
'@unocss/preset-uno': 0.5.1
|
||||
'@unocss/reset': 0.5.1
|
||||
'@unocss/vite': 0.5.1
|
||||
'@unocss/core': 0.6.1
|
||||
'@unocss/preset-attributify': 0.6.1
|
||||
'@unocss/preset-icons': 0.6.1
|
||||
'@unocss/preset-uno': 0.6.1
|
||||
'@unocss/reset': 0.6.1
|
||||
'@unocss/vite': 0.6.1
|
||||
dev: true
|
||||
|
||||
/unpipe/1.0.0:
|
||||
|
||||
Reference in new issue
Block a user