Merge pull request #2 from geo-engine/bring-down-10mb-bg-image

no more 10 mb beach image

Author: michaelmattig

src/components/Hero.astro

@@ -1,10 +1,11 @@
 ---
 import {useTranslations} from '../i18n/utils';
 import geoEngineTitle from '../images/Strand.png';
+import {optimizedBackgroundImage} from '../images/util';
 
 const t = useTranslations(Astro.currentLocale);
 
-const geoEngineBackground = 'url(' + geoEngineTitle.src + ')';
+const geoEngineBackground = await optimizedBackgroundImage(geoEngineTitle);
 ---
 
 <style define:vars={{geoEngineBackground}}>

src/components/Section.astro

@@ -1,9 +1,9 @@
 ---
-import {getImage} from 'astro:assets';
 import beachBg from '../images/Strand.png';
 import blueBg from '../images/backgrounds/GeoEngine_Structure_midblue.svg';
 import greenBg from '../images/backgrounds/GeoEngine_Structure_lightgreen.svg';
 import lightblueBg from '../images/backgrounds/GeoEngine_Structure_lightblue.svg';
+import {optimizedBackgroundImage} from '../images/util';
 
 interface Props {
     bg?: 'green' | 'blue' | 'lightblue' | 'beach';
@@ -12,11 +12,6 @@ interface Props {
 
 const {bg, box = false} = Astro.props;
 
-async function optimizedBackgroundImage(src: ImageMetadata): Promise<string> {
-    const bg = await getImage({src});
-    return `url('${bg.src}')`;
-}
-
 let backgroundImage = 'none';
 if (bg == 'green') {
     backgroundImage = await optimizedBackgroundImage(greenBg);

src/images/util.ts

@@ -0,0 +1,6 @@
+import {getImage} from 'astro:assets';
+
+export async function optimizedBackgroundImage(src: ImageMetadata): Promise<string> {
+    const bg = await getImage({src});
+    return `url('${bg.src}')`;
+}