From 2f185ba211d3680be4481ce7f4d299d61601250d Mon Sep 17 00:00:00 2001
From: Joe Carstairs <jcarstairs@scottlogic.com>
Date: Thu, 5 Oct 2023 19:38:55 +0100
Subject: Optimises images

---
 src/components/Footer.astro                    |  3 ++-
 src/components/LallansIssue.astro              |  4 ++--
 src/components/LallansIssueContributions.astro |  5 +----
 src/components/LallansIssuesGallery.astro      |  2 +-
 src/components/Scotsoun.astro                  | 10 ++--------
 src/components/ScotsounCdGallery.astro         |  2 +-
 6 files changed, 9 insertions(+), 17 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 40fdddb..ffb49c9 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -3,6 +3,7 @@ import translate from '$i18n/translate';
 import tComponent from '$i18n/translations/components/footer';
 import { getLocaleFromPathOrDefault } from '$lib/getLocaleFromPath';
 import Button from './Button.astro';
+import rssImg from '$images/rss.svg';
 
 const locale = getLocaleFromPathOrDefault(Astro.url.pathname);
 const t = translate(locale);
@@ -13,7 +14,7 @@ const t = translate(locale);
     <span class="footer__rss-button__label">
       {t(tComponent, { key: 'subscribe-to-rss' })}
     </span>
-    <img class="footer__rss-button__img" src="/images/rss.svg" />
+    <img class="footer__rss-button__img" src={rssImg.src} alt="" />
   </a>
 
   <Button classNames="footer__back-to-top" href="#top">
diff --git a/src/components/LallansIssue.astro b/src/components/LallansIssue.astro
index efbcdec..3b58124 100644
--- a/src/components/LallansIssue.astro
+++ b/src/components/LallansIssue.astro
@@ -20,12 +20,12 @@ const t = translate(locale);
 <section class="section--full-width">
   <div class="product__header-block">
     <header>
-      <h1>{t(tSite, { key: 'lallans' })} {issue.issueNumber}</h1>
+      <h1>{t(tSite, { key: 'lallans' }) + ' ' + issue.issueNumber}</h1>
       <p class="italic">{issue.description[locale]}</p>
     </header>
 
     <div class="product__action-block">
-      <img alt="" src={`/images/lallans/issue${issue.issueNumber}.jpg`} />
+      <img alt="" src={issue.img.src} />
       <PayPalButtons
         successPageUrl={relativePath(Astro.url.pathname, `payment-success-confirmation`)}
         productDescription={`Lallans ${issue.issueNumber} | ${issue.issueName}`}
diff --git a/src/components/LallansIssueContributions.astro b/src/components/LallansIssueContributions.astro
index 98824de..5d3084d 100644
--- a/src/components/LallansIssueContributions.astro
+++ b/src/components/LallansIssueContributions.astro
@@ -21,10 +21,7 @@ const t = translate(locale);
         <li>
           <span class="italic">{contribution.title}</span>
           {'author' in contribution && (
-            <span>
-              {' '}
-              {t(tSite, { key: 'by' })} {contribution.author}
-            </span>
+            <span> {t(tSite, { key: 'by' }) + ' ' + contribution.author}</span>
           )}
         </li>
       ))
diff --git a/src/components/LallansIssuesGallery.astro b/src/components/LallansIssuesGallery.astro
index 76209c6..1d6a3e7 100644
--- a/src/components/LallansIssuesGallery.astro
+++ b/src/components/LallansIssuesGallery.astro
@@ -19,7 +19,7 @@ function issueNumberDescending(issue1: LallansIssue, issue2: LallansIssue) {
           class="link link-gallery__container"
           href={`/${locale}/furthsettins/lallans/${issue.issueNumber}`}
         >
-          <img src={`/images/lallans/issue${issue.issueNumber}.jpg`} />
+          <img src={issue.img.src} alt="" />
           <p class="link-gallery__title">
             Lallans {issue.issueNumber} | {issue.issueName}
           </p>
diff --git a/src/components/Scotsoun.astro b/src/components/Scotsoun.astro
index 2e5ecc2..594b8c9 100644
--- a/src/components/Scotsoun.astro
+++ b/src/components/Scotsoun.astro
@@ -22,16 +22,10 @@ const t = translate(locale);
       <h1>{scotsoun.title}</h1>
       <p class="italic">Scotsoun SSCD{scotsoun.scotsounId}</p>
       {scotsoun?.subtitle && <p class="italic">{scotsoun.subtitle}</p>}
-      {
-        scotsoun?.author && (
-          <p>
-            {t(tSite, { key: 'by' })} {scotsoun.author}
-          </p>
-        )
-      }
+      {scotsoun?.author && <p>{t(tSite, { key: 'by' }) + ' ' + scotsoun.author}</p>}
     </header>
     <div class="product__action-block">
-      <img src={`/images/scotsoun/sscd${scotsoun.scotsounId}.jpg`} />
+      <img src={scotsoun.img.src} alt="" />
       <PayPalButtons
         successPageUrl={relativePath(Astro.url.pathname, `payment-success-confirmation`)}
         productDescription={`SSCD${scotsoun.scotsounId} | ${scotsoun.longName}`}
diff --git a/src/components/ScotsounCdGallery.astro b/src/components/ScotsounCdGallery.astro
index e1a9aaf..1c810a0 100644
--- a/src/components/ScotsounCdGallery.astro
+++ b/src/components/ScotsounCdGallery.astro
@@ -19,7 +19,7 @@ function scotsounIdDescending(scotsoun1: Scotsoun, scotsoun2: Scotsoun) {
           class="link link-gallery__container"
           href={`/${locale}/furthsettins/scotsoun/${scotsounItem.scotsounId}`}
         >
-          <img src={`/images/scotsoun/sscd${scotsounItem.scotsounId}.jpg`} />
+          <img src={scotsounItem.img.src} alt="" />
           <p class="link-gallery__title">{scotsounItem.title}</p>
         </a>
       </li>
-- 
cgit v1.2.3