Skip to content

Commit 2c50e6a

Browse files
rizenrizen
committed
switched to nuxt icon
1 parent f173105 commit 2c50e6a

File tree

10 files changed

+544
-102
lines changed

10 files changed

+544
-102
lines changed

‎.npmrc

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,2 @@
11
shamefully-hoist=true
2-
strict-peer-dependencies=false
3-
@fortawesome:registry=https://npm.fontawesome.com/
4-
//npm.fontawesome.com/:_authToken=F8418FC0-6231-42B8-87D7-2C7075D01BA7
2+
strict-peer-dependencies=false

‎app.config.ts

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export default defineAppConfig({
2+
nuxtIcon: {
3+
size: '24px'
4+
}
5+
})

‎content/ving/2.installation/2.vs-code.md

+1
Original file line numberDiff line numberDiff line change
@@ -8,3 +8,4 @@ And for the best possible experience, we also recommend installing these plugins
88
- [REST Client](https://marketplace.visualstudio.com/items?itemName=humao.rest-client) - optional, but nice
99
- [vscode-icons](https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons) - optional, but nice
1010
- [MySQL](https://marketplace.visualstudio.com/items?itemName=cweijan.vscode-mysql-client2) - optional, but nice
11+
- [Iconify IntelliSense](https://marketplace.visualstudio.com/items?itemName=antfu.iconify) - optional, but nice

‎layouts/default.vue

+15-14
Original file line numberDiff line numberDiff line change
@@ -5,23 +5,23 @@
55
<img :src="config.public.logoUrl" :alt="config.public.companyName" height="40" class="mr-0 lg:mr-6">
66
<a v-ripple class="cursor-pointer block lg:hidden text-gray-400 p-ripple"
77
v-styleclass="{ selector: '@next', enterClass: 'hidden', leaveToClass: 'hidden', hideOnOutsideClick: true }">
8-
<i class="pi pi-bars text-4xl"></i>
8+
<Icon name="prime:bars" class="text-4xl" />
99
</a>
1010
<div
1111
class="align-items-center flex-grow-1 justify-content-between hidden lg:flex absolute lg:static w-full bg-gray-900 left-0 top-100 z-1 shadow-2 lg:shadow-none border-1 lg:border-none border-gray-800">
1212
<ul class="list-none p-0 m-0 flex lg:align-items-center select-none flex-column lg:flex-row">
1313
<li>
1414
<NuxtLink to="/" v-ripple
1515
class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
16-
<i class="pi pi-home mr-2"></i>
16+
<Icon name="prime:home" class="mr-2" />
1717
<span>Home</span>
1818
</NuxtLink>
1919
</li>
2020

2121
<li>
2222
<NuxtLink to="/ving" v-ripple
2323
class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
24-
<i class="pi pi-book mr-2"></i>
24+
<Icon name="prime:book" class="mr-2" />
2525
<span>Ving Documentation</span>
2626
</NuxtLink>
2727
</li>
@@ -30,33 +30,33 @@
3030
<NuxtLink to="/" v-ripple
3131
class="flex px-6 p-3 lg:px-3 lg:py-2 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple"
3232
v-styleclass="{ selector: '@next', enterClass: 'hidden', enterActiveClass: 'scalein', leaveToClass: 'hidden', leaveActiveClass: 'fadeout', hideOnOutsideClick: true }">
33-
<i class="pi pi-building mr-2"></i>
33+
<Icon name="prime:building" class="mr-2" />
3434
<span>Sample Dropdown</span>
35-
<i class="pi pi-angle-down ml-auto lg:ml-3"></i>
35+
<Icon name="prime:angle-down" class="ml-auto lg:ml-3" />
3636
</NuxtLink>
3737
<ul
3838
class="list-none py-3 px-6 m-0 lg:px-0 lg:py-0 border-round shadow-0 lg:shadow-2 lg:absolute bg-gray-900 hidden origin-top w-full lg:w-15rem cursor-pointer lg:border-1 border-gray-800">
3939
<li>
4040
<NuxtLink to="/" v-ripple
4141
class="flex p-3 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 transition-colors transition-duration-150 p-ripple">
42-
<i class="pi pi-thumbs-down mr-2"></i>
42+
<Icon name="prime:thumbs-down" class="mr-2" />
4343
<span class="font-medium">Sample Submenu</span>
4444
</NuxtLink>
4545
</li>
4646
<li class="relative">
4747
<NuxtLink to="/" v-ripple
4848
class="flex p-3 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 transition-colors transition-duration-150 p-ripple"
4949
v-styleclass="{ selector: '@next', enterClass: 'hidden', enterActiveClass: 'scalein', leaveToClass: 'hidden', leaveActiveClass: 'fadeout', hideOnOutsideClick: true }">
50-
<i class="pi pi-search mr-2"></i>
50+
<Icon name="pixelarticons:avatar" class="mr-2" />
5151
<span class="font-medium">Sample 2</span>
52-
<i class="pi pi-sliders-h ml-auto lg:-rotate-90"></i>
52+
<Icon name="prime:sliders-h" class="ml-auto lg:-rotate-90" />
5353
</NuxtLink>
5454
<ul
5555
class="list-none py-3 pl-3 m-0 lg:px-0 lg:py-0 border-round shadow-0 lg:shadow-2 lg:absolute bg-gray-900 hidden origin-top w-full lg:w-15rem cursor-pointer left-100 top-0 lg:border-1 border-gray-800">
5656
<li>
5757
<NuxtLink to="/" v-ripple
5858
class="flex p-3 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 transition-colors transition-duration-150 p-ripple">
59-
<i class="pi pi-comments mr-2"></i>
59+
<Icon name="prime:comments" class="mr-2" />
6060
<span class="font-medium">Sample 3</span>
6161
</NuxtLink>
6262
</li>
@@ -69,7 +69,7 @@
6969
<li class="flex-order-2 lg:flex-order-0">
7070
<div class="flex px-6 p-3 lg:px-3 lg:py-2">
7171
<span class="p-input-icon-left w-full">
72-
<i class="pi pi-search text-gray-400"></i>
72+
<i class="pi pi-search" />
7373
<InputText type="text" placeholder="Search (non-functional)"
7474
class="bg-gray-800 text-gray-400 border-gray-800 w-full" />
7575
</span>
@@ -83,28 +83,28 @@
8383
<span class="text-white font-medium ml-2">
8484
{{ currentUser.meta?.displayName }}
8585
</span>
86-
<i class="pi pi-angle-down ml-auto lg:ml-3 mr-3 lg:mr-0"></i>
86+
<Icon name="prime:angle-down" class="ml-auto lg:ml-3 mr-3 lg:mr-0" />
8787
</div>
8888
<ul
8989
class="list-none py-3 px-6 m-0 lg:px-0 lg:py-0 border-round shadow-0 lg:shadow-2 lg:absolute bg-gray-900 hidden origin-top w-full lg:w-15rem cursor-pointer lg:border-1 border-gray-800">
9090
<li>
9191
<NuxtLink :to="'/user/profile/' + currentUser.props.id" v-ripple
9292
class="flex p-3 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 transition-colors transition-duration-150 p-ripple">
93-
<i class="pi pi-user-plus mr-2"></i>
93+
<Icon name="prime:user-plus" class="mr-2" />
9494
<span class="font-medium">View profile</span>
9595
</NuxtLink>
9696
</li>
9797
<li>
9898
<NuxtLink to="/user/settings" v-ripple
9999
class="flex p-3 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 transition-colors transition-duration-150 p-ripple">
100-
<i class="pi pi-search mr-2"></i>
100+
<Icon name="fa6-solid:sliders" class="mr-2" />
101101
<span class="font-medium">Settings</span>
102102
</NuxtLink>
103103
</li>
104104
<li>
105105
<NuxtLink to="/user/logout" v-ripple
106106
class="flex p-3 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 transition-colors transition-duration-150 p-ripple">
107-
<i class="pi pi-search mr-2"></i>
107+
<Icon name="fa6-solid:door-closed" class="mr-2" />
108108
<span class="font-medium">Sign out</span>
109109
</NuxtLink>
110110
</li>
@@ -113,6 +113,7 @@
113113
<li v-else>
114114
<NuxtLink to="/user/login" v-ripple
115115
class="flex p-3 align-items-center text-gray-400 hover:text-white hover:bg-gray-800 transition-colors transition-duration-150 p-ripple">
116+
<Icon name="fa6-solid:door-open" class="mr-2" />
116117
Sign In
117118
</NuxtLink>
118119
</li>

‎nuxt.config.ts

+1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ export default defineNuxtConfig({
33
modules: [
44
'@pinia/nuxt',
55
'@nuxt/content',
6+
'nuxt-icon',
67
],
78
imports: {
89
dirs: [

0 commit comments

Comments
 (0)