style: atualiza todo design interno da aplicacao

app/pages/(protected)/catalogo/index.vue

@@ -26,10 +26,6 @@
             <Icon name="mdi:plus" class="text-base" />
             Novo jogo
           </NuxtLink>
-          <NuxtLink to="/home"
-            class="inline-flex h-10 items-center justify-center rounded-full border border-[#d6d3d1] bg-transparent px-5 text-[15px] font-medium leading-none text-[#0c0a09] transition hover:border-[#0c0a09]">
-            Voltar
-          </NuxtLink>
         </div>
       </header>
 
@@ -71,13 +67,22 @@
                 <Icon name="mdi:gamepad-variant-outline" class="text-4xl text-[#d6d3d1]" />
               </div>
 
-              <button type="button" :disabled="togglingId === game.title"
-                :aria-label="favoriteIds.has(game.title) ? 'Remover dos favoritos' : 'Adicionar aos favoritos'"
-                @click="toggleFavorite(game)"
+              <button type="button" :disabled="togglingId === game.title" :aria-label="favoriteIds.has(game.title) ? 'Remover dos favoritos' : 'Adicionar aos favoritos'
+                " @click="toggleFavorite(game)"
                 class="absolute right-2 top-2 inline-flex h-8 w-8 items-center justify-center rounded-full bg-white/80 shadow backdrop-blur-sm transition hover:bg-white disabled:cursor-not-allowed disabled:opacity-50">
-                <Icon
-                  :name="togglingId === game.title ? 'mdi:loading' : favoriteIds.has(game.title) ? 'mdi:heart' : 'mdi:heart-outline'"
-                  :class="['text-base', togglingId === game.title ? 'animate-spin text-[#777169]' : favoriteIds.has(game.title) ? 'text-rose-500' : 'text-[#777169]']" />
+                <Icon :name="togglingId === game.title
+                  ? 'mdi:loading'
+                  : favoriteIds.has(game.title)
+                    ? 'mdi:heart'
+                    : 'mdi:heart-outline'
+                  " :class="[
+                    'text-base',
+                    togglingId === game.title
+                      ? 'animate-spin text-[#777169]'
+                      : favoriteIds.has(game.title)
+                        ? 'text-rose-500'
+                        : 'text-[#777169]'
+                  ]" />
               </button>
             </div>
 
@@ -134,8 +139,8 @@
 
       <div class="flex flex-col items-center gap-2 text-center text-xs leading-[1.4] tracking-[0.16px] text-[#777169]">
         <p>
-          Microsserviço consumido: <span
-            class="font-medium text-[#4e4e4e]">https://catalogo-jogos-sd-production.up.railway.app</span>
+          Microsserviço consumido:
+          <span class="font-medium text-[#4e4e4e]">https://catalogo-jogos-sd-production.up.railway.app</span>
           &nbsp;·&nbsp; Feito por Lucas Kauã
         </p>
         <span class="inline-flex items-center gap-1.5">
@@ -149,7 +154,8 @@
 
 <script setup>
 definePageMeta({
-  middleware: 'auth'
+  middleware: 'auth',
+  layout: 'protected'
 })
 
 const CATALOG_API_BASE_URL = 'https://catalogo-jogos-sd-production.up.railway.app'
@@ -299,7 +305,9 @@ async function confirmDelete(game) {
     confirmingDeleteId.value = null
     $toast.success(`${game.title} removido do catálogo.`, { duration: 4000 })
   } catch (error) {
-    $toast.error(error?.data?.message ?? 'Erro ao remover o jogo. Tente novamente.', { duration: 6000 })
+    $toast.error(error?.data?.message ?? 'Erro ao remover o jogo. Tente novamente.', {
+      duration: 6000
+    })
   } finally {
     deletingId.value = null
   }