Merge pull request #4 from valenciarb/reworks-images

Reworks images
valenciarb · Oct 28, 2024 · a3e35eb · a3e35eb
2 parents 48eb5d9 + 188d555
commit a3e35eb
Show file tree

Hide file tree

Showing 8 changed files with 13 additions and 17 deletions.
diff --git a/src/components/Header.astro b/src/components/Header.astro
@@ -11,15 +11,15 @@ const translatePath = useTranslatedPath(lang);
 <NarrowSection css="mt-0 pt-4">
   <div class="header columns mt-0">
     <div class="column is-1 mt-0">
-    <Logo src="valenciarb.png" alt="Valencia.rb" width="100"/>
+    <Logo src="valenciarb.png" alt="Valencia.rb" />
     </div>
     <div class="column is-8 mt-0">
       <h1 class="title"><a href={translatePath("/")}>Valencia.rb</a></h1>
       <h2 class="subtitle is-5">{t("header.tagline")}</h2>
     </div>
     <div class="column mt-0">
       <figure class="image">
-        <Logo src="vlctechhub.png" alt="Valencia Tech Hub" width="100"/>
+        <Logo src="vlctechhub.png" alt="Valencia Tech Hub"/>
         <figcaption class="is-size-7 has-text-centered">
           {t("header.connected")} <a href="https://vlctechhub.org" class="is-underlined has-text-dark">VLCTechHub</a>
         </figcaption>

diff --git a/src/components/Logo.astro b/src/components/Logo.astro
@@ -5,13 +5,12 @@ import { Image } from "astro:assets";
 interface Props {
    src: string;
    alt: string;
-   width: string;
 }
 
-const { src, alt, width="100" } = Astro.props;
+const { src, alt } = Astro.props;
 const imagePath = `/src/images/logos/${src}`
 const images = import.meta.glob<{ default: ImageMetadata }>('/src/images/logos/*.{jpeg,jpg,png,gif,svg}')
 if (!images[imagePath]) throw new Error(`"${imagePath}" does not exist in glob: "/src/images/logos/*.{jpeg,jpg,png,gif,svg}"`);
 ---
 
-<Image src={images[imagePath]()} alt={alt} width={parseInt(width)} loading="eager" />
+<Image src={images[imagePath]()} alt={alt} loading="eager" />
diff --git a/src/components/MeetingSponsor.astro b/src/components/MeetingSponsor.astro
@@ -5,7 +5,9 @@ const { sponsor } = Astro.props
 ---
 {sponsor.logo?
 <a href=`${sponsor.url}` target="_blank">
-  <Logo src={sponsor.logo} alt={sponsor.name} width={sponsor.logo_width}/>
+  <div style=`max-width: ${sponsor.logo_width};`>
+    <Logo src={sponsor.logo} alt={sponsor.name} />
+  </div>
 </a>
 :
 <a href=`${sponsor.url}` target="_blank">{sponsor.name}</a>

diff --git a/src/images/logos/vlctechhub.png b/src/images/logos/vlctechhub.png
diff --git a/src/layouts/MeetingLayout.astro b/src/layouts/MeetingLayout.astro
@@ -31,7 +31,7 @@ const { frontmatter } = Astro.props;
       { frontmatter.extras?
         <div slot="extras">
           <div class="has-text-right">
-            <Logo src={frontmatter.extras.src} alt={frontmatter.extras.alt} width={frontmatter.extras.width}/>
+            <Logo src={frontmatter.extras.src} alt={frontmatter.extras.alt} />
           </div>
         </div>
         :

diff --git a/src/layouts/PageLayout.astro b/src/layouts/PageLayout.astro
@@ -19,13 +19,6 @@ const { title } = Astro.props
     <Header/>
     <slot name="announcement"/>
 
-    <!-- <Anouncement>
-      <h1>2024 Kick-off meeting!</h1>
-      <p>
-        Yes, you heard that right, we are back!
-      </p>
-    </Anouncement> -->
-
     <NarrowSection>
       <slot/>
       <hr>
@@ -34,7 +27,9 @@ const { title } = Astro.props
         <div class="grid">
           <div class="cell">
             <a href="https://www.iukanet.com" target="_blank">
-              <Logo src="iukanet.png" alt="Administración de Sistemas y Servidores a Medida" width="100"/>
+              <div style="max-width: 100px;">
+                <Logo src="iukanet.png" alt="Administración de Sistemas y Servidores a Medida"/>
+              </div>
             </a>
           </div>
         </div>

diff --git a/src/pages/en/index.astro b/src/pages/en/index.astro
@@ -36,7 +36,7 @@ const latestMeeting = allMeetings.reverse()[0];
   { (latestMeeting as any).frontmatter.extras ?
     <div slot="extras">
       <div class="has-text-right">
-      <Logo src={(latestMeeting as any).frontmatter.extras.src} alt={(latestMeeting as any).frontmatter.extras.alt} width={(latestMeeting as any).frontmatter.extras.width}/>
+      <Logo src={(latestMeeting as any).frontmatter.extras.src} alt={(latestMeeting as any).frontmatter.extras.alt} />
       </div>
     </div>
     :

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -34,7 +34,7 @@ const latestMeeting = allMeetings.reverse()[0];
   { (latestMeeting as any).frontmatter.extras ?
     <div slot="extras">
       <div class="has-text-right">
-      <Logo src={(latestMeeting as any).frontmatter.extras.src} alt={(latestMeeting as any).frontmatter.extras.alt} width={(latestMeeting as any).frontmatter.extras.width}/>
+      <Logo src={(latestMeeting as any).frontmatter.extras.src} alt={(latestMeeting as any).frontmatter.extras.alt} />
       </div>
     </div>
     : null