From 45cf92757c0d8700a0be995afdcac6c08b4cda49 Mon Sep 17 00:00:00 2001
From: Alexis <alexis.pele@pm.me>
Date: Mon, 29 Dec 2025 16:06:07 +0100
Subject: [PATCH] Adjusted some styles

---
 src/components/atoms/YrhCard.vue             | 2 +-
 src/components/datas/items/ItemSelection.vue | 2 +-
 src/views/Config.vue                         | 2 +-
 src/views/Data.vue                           | 2 +-
 src/views/Home.vue                           | 2 +-
 src/views/datas/Items.vue                    | 8 ++++----
 6 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/atoms/YrhCard.vue b/src/components/atoms/YrhCard.vue
index 857673a..1b191f4 100644
--- a/src/components/atoms/YrhCard.vue
+++ b/src/components/atoms/YrhCard.vue
@@ -19,7 +19,7 @@ const props = defineProps<{
     </header>
 
     <figure v-if="slots.image" class="mx-4 after:content-[''] after:block after:w-full after:h-[0.1rem] after:my-3 after:bg-y-beige-500">
-      <div class="h-full bg-y-beige-500 grid place-items-center">
+      <div class="h-full bg-y-beige-500 relative *:absolute *:top-1/2 *:left-1/2 *:-translate-1/2">
         <slot name="image" />
       </div>
     </figure>
diff --git a/src/components/datas/items/ItemSelection.vue b/src/components/datas/items/ItemSelection.vue
index dfbbdff..057982e 100644
--- a/src/components/datas/items/ItemSelection.vue
+++ b/src/components/datas/items/ItemSelection.vue
@@ -17,7 +17,7 @@ function handleSelectedItem(item: GameItem) {
 </script>
 
 <template>
-  <div class="h-full relative pl-11">
+  <div class="h-full relative pl-6">
     <menu
       class="h-[calc(100%-16px)] overflow-auto py-2 bg-y-beige-300 max-h-full shadow-sharpest y-scrollbar after:-top-2 after:-bottom-2 after:w-4"
     >
diff --git a/src/views/Config.vue b/src/views/Config.vue
index df79f46..9b51ecf 100644
--- a/src/views/Config.vue
+++ b/src/views/Config.vue
@@ -34,7 +34,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <main class="container grid grid-rows-[auto_1fr_5vh]">
+  <main class="grid grid-rows-[auto_1fr_5vh]">
     <YrhHeading> SYSTEM CONFIGURATION </YrhHeading>
     <div class="grid grid-cols-4 items-center">
       <div>
diff --git a/src/views/Data.vue b/src/views/Data.vue
index fca8c68..80419bb 100644
--- a/src/views/Data.vue
+++ b/src/views/Data.vue
@@ -7,7 +7,7 @@ const { bannerText } = storeToRefs(useBannerStore())
 </script>
 
 <template>
-  <main class="container max-h-screen grid grid-rows-[auto_1fr_auto] overflow-auto">
+  <main class="max-h-screen grid grid-rows-[auto_1fr_auto] overflow-auto">
     <RouterView v-slot="{ Component }">
       <Transition name="fade" mode="out-in">
         <component :is="Component" />
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 084c603..c677b54 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -68,7 +68,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <main class="container grid grid-rows-[auto_1fr_5vh]">
+  <main class="grid grid-rows-[auto_1fr_5vh]">
     <YrhHeading> YORHA SYSTEM </YrhHeading>
     <div class="grid grid-cols-4 items-center">
       <div>
diff --git a/src/views/datas/Items.vue b/src/views/datas/Items.vue
index af39303..6a107c8 100644
--- a/src/views/datas/Items.vue
+++ b/src/views/datas/Items.vue
@@ -35,8 +35,8 @@ onMounted(() => {
     <template #subtitle> All items </template>
   </YrhHeading>
 
-  <section class="grid grid-cols-3 gap-x-10 my-14 overflow-auto">
-    <div class="items-container max-h-full overflow-hidden after:ml-11 before:ml-11 after:h-2 before:h-2 after:left-14 before:left-14 after:-right-14 before:-right-14 after:bg-y-beige-300 before:bg-y-beige-300 before:border-b-2 after:border-t-2">
+  <div class="grid grid-cols-3 gap-x-4 my-8 overflow-auto">
+    <div class="items-container max-h-full overflow-hidden after:ml-6 before:ml-6 after:h-2 before:h-2 after:left-14 before:left-14 after:-right-14 before:-right-14 after:bg-y-beige-300 before:bg-y-beige-300 before:border-b-2 after:border-t-2">
       <ItemSelection :items="availableItems" />
     </div>
 
@@ -62,7 +62,7 @@ onMounted(() => {
         <YrhStatusCard />
       </div>
     </div>
-  </section>
+  </div>
 </template>
 
 <style lang="scss" scoped>
@@ -76,7 +76,7 @@ onMounted(() => {
     position: sticky;
     width: 100%;
     content: '';
-    height: 0.1rem;
+    height: .1rem;
     border-color: rgba(45, 44, 33, 0.33);
     z-index: 10;
   }