feat(Images): convert images to AVIF format for improved performance

- Updated image references in various components and configuration files to use AVIF format instead of PNG and JPG.
- Modified the build process to include a script for converting images to AVIF, enhancing loading times and reducing file sizes.
- Ensured consistency across the application by updating image paths in the footer, main layout, and content components.

src/components/Content.js

@@ -722,7 +722,7 @@ class Content extends Component {
               justifyContent: 'center'
             }}>
               <img
-                src="/assets/images/seeds.jpg"
+                src="/assets/images/seeds.avif"
                 alt="Seeds"
                 fetchPriority="high"
                 loading="eager"
@@ -783,7 +783,7 @@ class Content extends Component {
               justifyContent: 'center'
             }}>
               <img
-                src="/assets/images/cutlings.jpg"
+                src="/assets/images/cutlings.avif"
                 alt="Stecklinge"
                 fetchPriority="high"
                 loading="eager"

src/components/Footer.js

@@ -296,7 +296,7 @@ class Footer extends Component {
                 >
                   <Box 
                     component="img" 
-                    src="/assets/images/gg.png" 
+                    src="/assets/images/gg.avif" 
                     alt="Google Reviews" 
                     sx={{ 
                       height: { xs: 50, md: 60 }, 
@@ -326,7 +326,7 @@ class Footer extends Component {
                 >
                   <Box 
                     component="img" 
-                    src="/assets/images/maps.png" 
+                    src="/assets/images/maps.avif" 
                     alt="Google Maps" 
                     sx={{ 
                       height: { xs: 40, md: 50 }, 

src/components/MainPageLayout.js

@@ -163,8 +163,8 @@ const MainPageLayout = () => {
 
   const allContentBoxes = {
     home: [
-      { title: t('sections.seeds'), image: "/assets/images/seeds.jpg", bgcolor: "#e1f0d3", link: "/Kategorie/Seeds" },
-      { title: t('sections.stecklinge'), image: "/assets/images/cutlings.jpg", bgcolor: "#e8f5d6", link: "/Kategorie/Stecklinge" }
+      { title: t('sections.seeds'), image: "/assets/images/seeds.avif", bgcolor: "#e1f0d3", link: "/Kategorie/Seeds" },
+      { title: t('sections.stecklinge'), image: "/assets/images/cutlings.avif", bgcolor: "#e8f5d6", link: "/Kategorie/Stecklinge" }
     ],
     aktionen: [
       { title: t('sections.oilPress'), image: "/assets/images/presse.jpg", bgcolor: "#e1f0d3", link: "/presseverleih" },

src/components/header/Logo.js

@@ -16,7 +16,7 @@ const Logo = () => {
       }}
     >
       <img
-        src="/assets/images/sh.png"
+        src="/assets/images/sh.avif"
         alt="SH Logo"
         width="108px"
         height="45px"

src/config.js

@@ -206,7 +206,7 @@ const config = {
   
   // Images
   images: {
-    logo: "/assets/images/sh.png",
+    logo: "/assets/images/sh.avif",
     placeholder: "/assets/images/nopicture.jpg"
   },