Merge branch 'ep2025' into ep2025-ilikeit

Author: nikoshell

astro.config.mjs

@@ -93,7 +93,9 @@ export default defineConfig({
     pagefind(),
     deleteUnusedImages(),
     svelte(),
-    compress(),
+    (await import("astro-compress")).default({
+      SVG: false,
+    }),
   ],
   output: "static",
   build: {

public/social/bg2.png

@@ -6,7 +6,7 @@ const puppeteer = require("puppeteer");
     args: ["--no-sandbox", "--disable-setuid-sandbox"],
   });
   const page = await browser.newPage();
-  await page.goto("http://localhost:4321/media/social_media_cards");
+  await page.goto("http://localhost:4321/media/speakers");
 
   const elements = await page.$$(".social");
 

public/social/bg3.png

@@ -0,0 +1,114 @@
+---
+import { getEntry } from "astro:content";
+import { sponsorLogos } from "@data/sponsorLogos";
+
+const { sponsor } = Astro.props;
+
+const {
+  name: title,
+  url: website,
+  logo_padding = false,
+} = sponsor.data;
+
+
+const logo = sponsorLogos[sponsor.id];
+// Assuming logo.width and logo.height are known
+const targetWidth = 400;
+const originalWidth = logo.width;
+const originalHeight = logo.height;
+const aspectRatio = originalWidth / originalHeight;
+
+let width = targetWidth;
+let height = width / aspectRatio;
+
+const maxHeight = 220;
+if (height > maxHeight) {
+  height = maxHeight;
+  width = height * aspectRatio ;
+}
+
+const x = 450 - width / 2;
+const y = 650 - height / 2;
+
+---
+<svg width="900" height="900" class="h-full w-full -z-10">
+  <image href="/social/bg4.png" width="900" height="900" />
+</svg>
+    <svg width="900" height="900">
+
+<image
+  class="sponsor_logo"
+  href={logo.src}
+  x={x}
+  y={y}
+  width={width}
+  height={height}
+  style={{
+    padding: logo_padding ? logo_padding : undefined,
+  }}
+  clip-path="url(#curvedCornerClip)"
+  preserveAspectRatio="xMidYMid meet"
+/>
+    </svg>
+
+<p lang="en" class="box2 fit-text">
+{title}
+</p>
+
+
+<style>
+  .box {
+      margin-top:250px;
+      width: 630px;
+      height: 150px;
+      font-size: 100px;
+      color: rgb(239, 215, 123);
+      padding: 1rem;
+      opacity: 0;
+  }
+
+  .box2 {
+      margin-top:320px;
+      margin-left:150px;
+      width: 640px;
+      height: 180px;
+      font-size: 70px;
+      color:white;
+      padding: 2rem;
+  }
+
+  .box3 {
+      margin-top:280px;
+      width: 800px;
+      height: 300px;
+      font-size: 100px;
+      color: rgb(239, 215, 123);
+      padding: 1rem;
+  }
+
+  .box4 {
+
+      width: 580px;
+      height: 200px;
+      font-size: 70px;
+      color:white;
+      padding: 2rem;
+  }
+
+
+  .box, .box2, .box3, .box4 {
+      box-sizing: border-box;
+      overflow: hidden;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      text-align: center;
+      font-family: Inter, sans-serif !important;
+      font-weight: bold;
+      line-height: 1em;
+    }
+
+  .sponsor_logo {
+    max-height:120px;
+  }
+</style>

public/social/bg4.png

@@ -2,6 +2,7 @@
 import CodeHeart from "@components/island/CodeHeart.svelte";
 import Speakers from "./speakers.astro";
 import { slugify } from "@utils/content";
+import Headline from "@ui/Headline.astro";
 
 export interface props {
   style: any;
@@ -92,6 +93,7 @@ const hasFooter = true;
             <Speakers speakers={session.speakers} />
           </>
         )}
+
       </footer>
     )
   }
@@ -103,6 +105,7 @@ const hasFooter = true;
 
 <style>
   .session {
+
     border: 1px solid transparent;
     font-weight: bold;
     display: flex;
@@ -143,6 +146,7 @@ const hasFooter = true;
     bottom: 0;
     left: 0;
     z-index: 1;
+
   }
 
   footer :global(a) {
@@ -206,6 +210,7 @@ const hasFooter = true;
     border: 1px solid #e9714d;
   }
 
+
   .time,
   footer {
     font-size: 0.9em;
@@ -220,7 +225,7 @@ const hasFooter = true;
 
   h2 {
     margin-bottom: 1em;
-    height: 100%;
+    height:100%;
   }
 
   footer.has-speakers {
@@ -243,6 +248,6 @@ const hasFooter = true;
   }
 
   .poster header {
-    text-align: center;
+    text-align:center
   }
 </style>

scripts/download_social.cjs

@@ -20,7 +20,7 @@ type Speaker = CollectionEntry<"speakers">;
   <body class="overflow-auto">
 {
   speakers.map((entry: Speaker) => (
-  <a href=`/media/card/${entry.data.slug}`>
+  <a href=`/media/speaker/${entry.data.slug}`>
   <div class="social relative w-[900px] h-[900px] overflow-hidden" data-slug={entry.data.slug}>
       <SocialMediaCard entry={entry} />
     </div>