Working

app/components/AppFooter.vue

@@ -1,22 +1,22 @@
 <script setup lang="ts">
 const socials = [
   {
-    icon: 'i-ph-x-logo-duotone',
+    icon: 'x-logo-duotone',
     label: 'Twitter',
     link: 'https://twitter.com/ArthurDanj',
   },
   {
-    icon: 'i-ph-github-logo-duotone',
+    icon: 'github-logo-duotone',
     label: 'GitHub',
     link: 'https://github.com/ArthurDanjou',
   },
   {
-    icon: 'i-ph-linkedin-logo-duotone',
+    icon: 'linkedin-logo-duotone',
     label: 'LinkedIn',
     link: 'https://www.linkedin.com/in/arthurdanjou/',
   },
   {
-    icon: 'i-ph-discord-logo-duotone',
+    icon: 'discord-logo-duotone',
     label: 'Discord',
     link: 'https://discordapp.com/users/179635349100691456',
   },
@@ -44,7 +44,7 @@ const { t } = useI18n({
             v-for="social in socials.sort((a, b) => a.label.localeCompare(b.label))"
             :key="social.label"
             :href="social.link"
-            :icon="social.icon"
+            :icon="`i-ph:${social.icon}`"
             :label="social.label"
             target="_blank"
           />

app/components/AppHeader.vue

@@ -13,11 +13,7 @@ const navs = [
       fr: 'accueil',
     },
     to: '/',
-    icon: 'i-ph-house-line-duotone',
-    shortcut: {
-      en: 'h',
-      fr: 'a',
-    },
+    icon: 'house-line-duotone',
   },
   {
     label: {
@@ -25,11 +21,7 @@ const navs = [
       fr: 'usages',
     },
     to: '/uses',
-    icon: 'i-ph-backpack-duotone',
-    shortcut: {
-      en: 'u',
-      fr: 'u',
-    },
+    icon: 'backpack-duotone',
   },
   {
     label: {
@@ -37,11 +29,7 @@ const navs = [
       fr: 'écrits',
     },
     to: '/writings',
-    icon: 'i-ph-books-duotone',
-    shortcut: {
-      en: 'w',
-      fr: 'e',
-    },
+    icon: 'books-duotone',
   },
   {
     label: {
@@ -50,11 +38,7 @@ const navs = [
     },
     to: config.public.cloud.resume,
     target: '_blank',
-    icon: 'i-ph-address-book-duotone',
-    shortcut: {
-      en: 'r',
-      fr: 'c',
-    },
+    icon: 'address-book-duotone',
   },
 ]
 
@@ -85,13 +69,6 @@ async function changeLocale() {
 
 const router = useRouter()
 defineShortcuts({
-  h: () => router.push('/'),
-  a: () => router.push('/'),
-  u: () => router.push('/uses'),
-  w: () => router.push('/writings'),
-  e: () => router.push('/writings'),
-  r: () => window.open(config.public.cloud.resume, '_blank'),
-  c: () => window.open(config.public.cloud.resume, '_blank'),
   t: () => toggleTheme(),
   l: () => changeLocale(),
   backspace: () => router.back(),
@@ -110,11 +87,10 @@ defineShortcuts({
       <UTooltip
         v-for="nav in navs"
         :key="nav.label.en"
-        :shortcuts="[nav.shortcut[locale]]"
         :text="nav.label[locale]"
       >
         <UButton
-          :icon="nav.icon"
+          :icon="`i-ph:${nav.icon}`"
           :target="nav.target ? nav.target : '_self'"
           :to="nav.to"
           :aria-label="nav.label"

app/components/content/Activity.vue

@@ -88,7 +88,7 @@ const { t } = useI18n({
         <template #editor>
           <span class="space-x-1">
             <UIcon
-              :name="IDEs.find(ide => ide.name === getActivity!.name)!.icon"
+              :name="`i-logos:${IDEs.find(ide => ide.name === getActivity!.name)!.icon}`"
               size="16"
             />
             <strong>{{ getActivity.name }}</strong></span>

app/components/content/Quote.vue

@@ -11,9 +11,6 @@ const { t } = useI18n({
         <div class="flex items-center w-12 h-12">
           <UAvatar
             alt="Avatar"
-            chip-color="gray"
-            chip-position="top-right"
-            chip-text="?"
             class="hover:rotate-[360deg] duration-500 transform-gpu"
             size="md"
             src="/favicon.png"

app/components/home/Map.vue

@@ -87,7 +87,7 @@ const config = useRuntimeConfig()
 
 <style lang="scss">
 .map-button {
-  @apply z-30 absolute bottom-2 dark:bg-gray-800 dark:hover:bg-gray-900 bg-gray-200 hover:bg-gray-100 duration-300 border border-neutral-300 dark:border-neutral-700 cursor-pointer flex items-center justify-center rounded-full p-2
+  @apply z-30 absolute bottom-2 dark:bg-gray-900 dark:hover:bg-gray-900 bg-gray-200 hover:bg-gray-100 duration-300 border border-neutral-300 dark:border-neutral-700 cursor-pointer flex items-center justify-center rounded-full p-2
 }
 
 .mapboxgl-control-container {

types.ts

@@ -41,7 +41,7 @@ export interface Activity {
 }
 
 export const IDEs = [
-  { name: 'Visual Studio Code', icon: 'i-logos-visual-studio-code' },
-  { name: 'IntelliJ IDEA Ultimate', icon: 'i-logos-intellij-idea' },
-  { name: 'WebStorm', icon: 'i-logos-webstorm' },
+  { name: 'Visual Studio Code', icon: 'visual-studio-code' },
+  { name: 'IntelliJ IDEA Ultimate', icon: 'intellij-idea' },
+  { name: 'WebStorm', icon: 'webstorm' },
 ]