Merge branch 'ep2025' into ep2025-cleanup2

Author: nikoshell

astro.config.mjs

@@ -12,6 +12,8 @@ import deleteUnusedImages from "astro-delete-unused-images";
 import preload from "astro-preload";
 import { execSync } from "node:child_process";
 
+import compress from "astro-compress";
+
 let gitVersion = String(process.env.GIT_VERSION ?? "").slice(0, 7);
 
 if (!gitVersion) {
@@ -87,6 +89,7 @@ export default defineConfig({
     metaTags(),
     pagefind(),
     deleteUnusedImages(),
+    compress(),
   ],
   output: "static",
   build: {

package.json

@@ -20,6 +20,7 @@
     "@fortawesome/fontawesome-free": "^6.7.2",
     "@tailwindcss/typography": "^0.5.16",
     "astro": "^5.7.5",
+    "astro-compress": "^2.3.8",
     "astro-delete-unused-images": "^1.0.3",
     "astro-meta-tags": "^0.3.1",
     "astro-pagefind": "^1.8.3",

pnpm-lock.yaml

@@ -1,10 +1,38 @@
-  <Fragment is:raw>
-  <iframe
-    src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d10245.064741908278!2d14.4290206!3d50.0625764!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x4d26855708eb61f7!2sPrague%20Congress%20Centre!5e0!3m2!1sen!2suk!4v1676555813425!5m2!1sen!2suk"
-    title="Map"
-    class="w-full aspect-video max-w-[800px] border-4 border-white rounded-lg shadow-lg"
-    allowFullScreen="true"
-    loading="lazy"
-    referrerPolicy="no-referrer-when-downgrade"
-  ></iframe>
-  </Fragment>
+---
+interface Props {
+  location?: string;
+  lat?: number;
+  lng?: number;
+  zoom?: number;
+  title?: string;
+}
+
+const {
+  location,
+  lat,
+  lng,
+  zoom = 14,
+  title = "Map",
+} = Astro.props;
+
+let src = "";
+if (lat && lng) {
+  src = `https://maps.google.com/maps?q=${lat},${lng}&z=${zoom}&t=m&output=embed`;
+}
+else if (location) {
+  src = `https://maps.google.com/maps?q=${encodeURIComponent(location)}&t=m&z=${zoom}&output=embed&iwloc=near`;
+}
+---
+<div class="map-container w-full aspect-video max-w-[800px] border-4 border-white rounded-lg shadow-lg">
+  {src && (
+    <iframe
+      src={src}
+      title={title}
+      class="w-full aspect-video"
+      allowfullscreen={true}
+      loading="lazy"
+      referrerpolicy="no-referrer-when-downgrade"
+      style="border:0;"
+    ></iframe>
+  )}
+</div>

src/components/Map.astro

@@ -25,7 +25,7 @@ const { id = 'modal', open = false, closeOnOutsideClick = false } = Astro.props;
     <slot />
   </div>
 </div>
-<script is:inline>
+<script >
   document.addEventListener('DOMContentLoaded', () => {
     // Function to toggle body scroll
     const toggleBodyScroll = (disable) => {

src/components/Modal.astro

@@ -22,7 +22,7 @@ const logo = sponsorLogos[sponsor.id];
 ---
 
 <div
-  class="lg:max-w-[400px] flex flex-col gap-6 p-6 rounded-lg shadow-md bg-white text-black"
+  class="lg:max-w-[400px] flex flex-col p-6 bg-white"
 >
   <div class="w-full flex justify-center items-center md:items-center">
     {

src/components/SponsorLogo.astro

@@ -1,5 +1,6 @@
 ---
 import { getCollection } from "astro:content";
+import SponsorLogo from "@components/SponsorLogo.astro";
 import { Image } from "astro:assets";
 
 type Sponsor = Awaited<ReturnType<typeof getCollection<"sponsors">>>[0];
@@ -29,7 +30,7 @@ const { tier, top } = Astro.props;
   </h4>
   <div
     class:list={[
-      "grid gap-6 lg:gap-12 ml-12 items-center justify-items-center",
+      "grid ml-12 items-center justify-items-center",
       {
         "grid-cols-1 md:grid-cols-2 lg:grid-cols-3": !top,
         "grid-cols-1 md:grid-cols-1": top,
@@ -43,14 +44,8 @@ const { tier, top } = Astro.props;
           href={sponsor.data.url}
           target="_blank"
           rel="noopener noreferrer"
-          class="pb-8"
         >
-          <Image
-            src={sponsorLogos[sponsor.id]}
-            alt={sponsor.data.name}
-            width={500}
-            class="max-w-[250px] max-h-[120px]"
-          />
+          <SponsorLogo sponsor={sponsor.id} />
         </a>
         </div>
       ))

src/components/sponsors/sponsor-tier.astro

@@ -45,46 +45,50 @@ const sponsorTiers = tiers
 
 const topTier = sponsorTiers.find((tier) => tier.name === "Keystone");
 ---
+
 <Section variant="secondary">
-          <Headline id="sponsors" title="Sponsors & Partners" center=true />
-    <div>
-          {
-            hasSponsors ? (
-              <p class="text-center">
-                EuroPython wouldn't be such an affordable event without the help
-                of the sponsors and partners. We'd like to thank all of them for their
-                support.
-              </p>
-            ) : (
-              <p class="text-center">
-                Sponsoring EuroPython guarantees you highly targeted visibility
-                and the opportunity to present yourself and your sponsor to one
-                of the largest and most diverse Python communities in Europe and
-                beyond.
-              </p>
-            )
-          }
+  <Headline id="sponsors" title="Sponsors & Partners" center="true" />
+  <div class="mb-10">
+    {
+      hasSponsors ? (
+        <p class="text-center">
+          EuroPython wouldn't be such an affordable event without the help of
+          the sponsors and partners. We'd like to thank all of them for their
+          support.
+        </p>
+      ) : (
+        <p class="text-center">
+          Sponsoring EuroPython guarantees you highly targeted visibility and
+          the opportunity to present yourself and your sponsor to one of the
+          largest and most diverse Python communities in Europe and beyond.
+        </p>
+      )
+    }
 
-          <div class="mt-4 text-center">
-            <Button url="/sponsor">Become a sponsor</Button>
-      </div>
-      {
-        topTier && topTier.sponsors.length > 0 && (
-          <SponsorTier tier={topTier} top={true} />
-        )
-      }
+    <div class="mt-4 text-center">
+      <Button url="/sponsor">Become a sponsor</Button>
     </div>
+    {
+      topTier && topTier.sponsors.length > 0 && (
+        <SponsorTier tier={topTier} top={true} />
+      )
+    }
+  </div>
 
-    {sponsorTiers.length > 0 && <Separator light />}
+  {sponsorTiers.length > 0 && <hr />}
 
-    <div class="mb-20">
+  <div class="">
     {
       sponsorTiers.map((tier, index) => (
         <Fragment>
           <SponsorTier tier={tier} top={tier.name === "Platinum"} />
-          {index !== sponsorTiers.length - 1 && <Separator light />}
+          {index !== sponsorTiers.length - 1 && <hr />}
         </Fragment>
       ))
     }
-    </div>
+  </div>
 </Section>
+
+<style>
+  hr {margin: 10px 0;}
+</style>

src/components/sponsors/sponsors.astro

@@ -281,3 +281,48 @@ Barking up the right tree
 <Accordion title="Finnish-speaking dogs" id="finnish">
   ***Hau hau!***
 </Accordion>
+
+## Maps
+<h2>Example 1: Map with Location</h2>
+<Map
+  location="Empire State Building, New York"
+  zoom={15}
+/>
+
+<h2>Example 2: Map with Coordinates (Latitude & Longitude)</h2>
+<Map
+  lat={48.8584}
+  lng={2.2945}
+  zoom={16}
+  title="Eiffel Tower, Paris"
+/>
+
+<h2>Example 3: Map with Default Zoom Level</h2>
+<Map
+  location="Sydney Opera House"
+/>
+
+<h2>Example 4: Map with Custom Title</h2>
+<Map
+  lat={36.1069}
+  lng={-112.1129}
+  zoom={13}
+  title="Grand Canyon"
+/>
+
+<h2>Example 5: Map with All Default Values</h2>
+<Map
+  location="Statue of Liberty, New York"
+/>
+
+<h2>Usage in Layout</h2>
+<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+  <div>
+    <h3>New York</h3>
+    <Map location="New York, NY" />
+  </div>
+  <div>
+    <h3>London</h3>
+    <Map location="London, UK" />
+  </div>
+</div>

src/content/pages/test.mdx

@@ -23,7 +23,7 @@ Vyšehrad station (on Line C of the Prague underground railway) is right next to
 the venue and offers convenient public transport from the airport and all major
 rail and bus stations.
 
-<Map />
+<Map location="Prague Congress Centre" zoom={15} />
 
 <address>
 **Entrance 5**