refactor: improve formatting and consistency in InfoIcon component and documentation

Author: ErwanDecoster

src/components/InfoIcon.vue

@@ -1,22 +1,24 @@
 <template>
-  <div class="inline-flex items-center relative cursor-help group">
-    <Icon 
-      icon="heroicons:information-circle" 
-      class="w-3.5 h-3.5 opacity-60 transition-opacity duration-200 text-gray-600 hover:opacity-100 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-200"
+  <div class="group relative inline-flex cursor-help items-center">
+    <Icon
+      icon="heroicons:information-circle"
+      class="h-3.5 w-3.5 text-gray-600 opacity-60 transition-opacity duration-200 hover:text-gray-800 hover:opacity-100 dark:text-gray-400 dark:hover:text-gray-200"
     />
-    <span class="invisible absolute bottom-full left-1/2 transform -translate-x-1/2 bg-gray-800 text-white text-xs p-2 rounded w-max max-w-xs shadow-lg z-50 opacity-0 transition-all duration-200 group-hover:visible group-hover:opacity-100 before:content-[''] before:absolute before:top-full before:left-1/2 before:transform before:-translate-x-1/2 before:border-4 before:border-solid before:border-gray-800 before:border-b-transparent before:border-l-transparent before:border-r-transparent">
+    <span
+      class="invisible absolute bottom-full left-1/2 z-50 w-max max-w-xs -translate-x-1/2 transform rounded bg-gray-800 p-2 text-xs text-white opacity-0 shadow-lg transition-all duration-200 group-hover:visible group-hover:opacity-100 before:absolute before:top-full before:left-1/2 before:-translate-x-1/2 before:transform before:border-4 before:border-solid before:border-gray-800 before:border-r-transparent before:border-b-transparent before:border-l-transparent before:content-['']"
+    >
       {{ tooltip }}
     </span>
   </div>
 </template>
 
 <script setup>
-import { Icon } from '@iconify/vue'
+import { Icon } from '@iconify/vue';
 
 defineProps({
   tooltip: {
     type: String,
-    required: true
-  }
-})
+    required: true,
+  },
+});
 </script>

src/overview/helloWorld/3-buildIApp.md

@@ -258,17 +258,17 @@ iapp deploy
 
 <div class="bg-gradient-to-r from-fuchsia-400/10 to-fuchsia-400/5 rounded-[6px] p-6 border-l-4 border-fuchsia-700 mb-6">
   <p class="m-0!">📝 Make sure to save your <span class="text-fuchsia-700 font-semibold">iApp address</span> after deployment - you'll need it later!</p>
-  <p>You can find your iApp address in the <code>iexec-app.json</code> file in your project folder.</p>
+  <p class="m-0!">You can find your iApp address in the <code>iexec-app.json</code> file in your project folder.</p>
   <br>
-  <p>⚠️  If you encounter issues during deployment, make sure Docker's BuildKit feature is enabled and supports AMD64 architecture:</p>
+  <p class="m-0!">⚠️  If you encounter issues during deployment, make sure Docker's BuildKit feature is enabled and supports AMD64 architecture:</p>
 
 ```sh
 docker buildx inspect --bootstrap | grep -i platforms
 ```
 
-  <p>The output should include <code>linux/amd64</code> in the list of supported platforms. If not, update to the latest Docker Desktop version which includes these requirements.</p>
+  <p class="m-0!">The output should include <code>linux/amd64</code> in the list of supported platforms. If not, update to the latest Docker Desktop version which includes these requirements.</p>
   <br>
-   <p>⚠️  If you set the wrong Docker username, you can change it by editing the <code>iapp.config.json</code> file</p>
+  <p class="m-0!">⚠️  If you set the wrong Docker username, you can change it by editing the <code>iapp.config.json</code> file</p>
 </div>
 
 ## 🏃 Run Your iApp