fix: redesing and add features

src/components/pokemon/Information.vue

@@ -0,0 +1,26 @@
+<script setup>
+import { defineProps } from 'vue'
+
+const props = defineProps({
+    pokemonData: Object,
+});
+</script>
+
+<template>
+    <div class="space-y-4">
+        <h3 class="text-[10px] uppercase font-bold text-zinc-500 tracking-widest border-b border-zinc-800 pb-1">Biometrics</h3>
+        
+        <div class="grid grid-cols-2 gap-2">
+            <div class="bg-zinc-900 border border-zinc-800 p-2 rounded flex flex-col items-center">
+                <span class="text-[9px] uppercase text-zinc-500 font-bold">Height</span>
+                <span class="text-lg font-mono text-zinc-200">{{ pokemonData.height / 10 }}m</span>
+            </div>
+            <div class="bg-zinc-900 border border-zinc-800 p-2 rounded flex flex-col items-center">
+                <span class="text-[9px] uppercase text-zinc-500 font-bold">Weight</span>
+                <span class="text-lg font-mono text-zinc-200">{{ pokemonData.weight / 10 }}kg</span>
+            </div>
+        </div>
+
+    </div>
+</template>
+