Add css optimization and improve images (#20)

* fix video url

* update deploy script for using rsync

* remove delete from script

* translate resources page

* fix images dimensions and favicon

* add css optimization plugin and improve images

src/components/header.astro

@@ -44,7 +44,9 @@ const { lang } = Astro.props;
           width={80}
           height={80}
           loading="eager"
-          class="w-auto h-auto"
+          decoding="sync"
+          fetchpriority="high"
+          class="w-auto h-auto aspect-square"
           alt="juancmandev logo"
         />
       </LinkButton>

src/components/mdx/astro-image.astro

@@ -6,15 +6,18 @@ const props = Astro.props;
 
 <Image
   id="img"
+  decoding="async"
   src={props.src}
   alt={props.alt}
   width={props.width}
   height={props.height}
-  class="w-auto h-auto rounded-md aspect-auto"
+  class="w-auto h-auto rounded-md aspect-auto object-cover"
 />
 
 <script>
   const image = document.getElementById("img")!;
 
   image && image.setAttribute("loading", "eager");
+  image && image.setAttribute("decoding", "sync");
+  image && image.setAttribute("fetchpriority", "high");
 </script>