feat: update UI

This commit is contained in:
Anthony Fu committed 2021-11-05 13:14:07 +08:00
1 parent 6c3ed25a43
commit 0aead4d551
9 files changed
+77 -59

No files matched your search

+2 -2
View File
@@ -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>
+2 -2
View File
@@ -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" />
+2
View File
@@ -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>
+20
View File
@@ -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>
+2 -2
View File
@@ -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
View File
@@ -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
View File
@@ -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
View File
@@ -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>
+38 -38
View File
@@ -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: