Replace PNG images with AVIF format for DisCorkie and GameOutlet projects

Author: AppOutletTeam

public/component/our-apps/discorkie-icon.avif

@@ -8,11 +8,11 @@ <h2 class="text-4xl md:text-5xl font-bold text-center mb-20 bg-gradient-to-r fro
       <!-- Project 1: DisCorkie -->
       <div class="flex flex-col md:flex-row items-center gap-12">
         <div class="md:w-1/2 transform transition-transform duration-500 hover:scale-105">
-          <img src="component/our-apps/discorkie-screenshot.png" i18n-alt alt="DisCorkie App Screenshot" class="w-full h-auto object-cover">
+          <img src="component/our-apps/discorkie-screenshot.avif" i18n-alt alt="DisCorkie App Screenshot" class="w-full h-auto object-cover">
         </div>
         <div class="md:w-1/2">
           <div class="flex flex-col items-center text-center md:flex-row md:items-center md:text-left gap-6 mb-4">
-            <img src="component/our-apps/discorkie-icon.png" i18n-alt alt="DisCorkie App Icon" class="w-20 h-20 flex-shrink-0">
+            <img src="component/our-apps/discorkie-icon.avif" i18n-alt alt="DisCorkie App Icon" class="w-20 h-20 flex-shrink-0">
             <div>
               <h3 class="text-4xl font-bold text-gray-900 mb-1" i18n>DisCorkie</h3>
               <p class="text-xl font-semibold text-indigo-600" i18n>Navigate on your Discourse forums</p>
@@ -33,11 +33,11 @@ <h3 class="text-4xl font-bold text-gray-900 mb-1" i18n>DisCorkie</h3>
       <!-- Project 2: GameOutlet -->
       <div class="flex flex-col md:flex-row-reverse items-center gap-12">
         <div class="md:w-1/2 transform transition-transform duration-500 hover:scale-105">
-          <img src="component/our-apps/gameoutlet-screenshot.png" i18n-alt alt="GameOutlet App Screenshot" class="w-full h-auto object-cover">
+          <img src="component/our-apps/gameoutlet-screenshot.avif" i18n-alt alt="GameOutlet App Screenshot" class="w-full h-auto object-cover">
         </div>
         <div class="md:w-1/2">
           <div class="flex flex-col items-center text-center md:flex-row md:items-center md:text-left gap-6 mb-4">
-            <img src="component/our-apps/gameoutlet-icon.png" i18n-alt alt="GameOutlet App Icon" class="w-20 h-20 flex-shrink-0">
+            <img src="component/our-apps/gameoutlet-icon.avif" i18n-alt alt="GameOutlet App Icon" class="w-20 h-20 flex-shrink-0">
             <div>
               <h3 class="text-4xl font-bold text-gray-900 mb-1" i18n>GameOutlet</h3>
               <p class="text-xl font-semibold text-indigo-600" i18n>Find the best prices on PC games</p>