From 68deb25cd15562cbe3ae7ea27336d3d2eb08b7fd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rapha=C3=ABl=20de=20Courville?= Date: Thu, 1 Oct 2026 13:48:07 +0200 Subject: [PATCH 1/2] Add Butter partner page and footer sponsor Co-Authored-By: Claude Sonnet 5.5 --- pcd-website/src/config/sponsors.ts | 6 ++++++ .../organizer-kit/partner-pages/butter.md | 21 +++++++++++++++++++ pcd-website/src/images/butter_logo.svg | 1 + 3 files changed, 28 insertions(+) create mode 100644 pcd-website/src/content/organizer-kit/partner-pages/butter.md create mode 100644 pcd-website/src/images/butter_logo.svg diff --git a/pcd-website/src/config/sponsors.ts b/pcd-website/src/config/sponsors.ts index d219ccef..2fbd121a 100644 --- a/pcd-website/src/config/sponsors.ts +++ b/pcd-website/src/config/sponsors.ts @@ -1,5 +1,6 @@ import type { ImageMetadata } from 'astro'; import openProcessingLogo from '../images/openprocessing_logo.svg'; +import butterLogo from '../images/butter_logo.svg'; export interface Sponsor { name: string; @@ -13,4 +14,9 @@ export const SPONSORS: Sponsor[] = [ href: 'https://openprocessing.org', logo: openProcessingLogo, }, + { + name: 'Butter', + href: 'https://www.butter.video/', + logo: butterLogo, + }, ]; diff --git a/pcd-website/src/content/organizer-kit/partner-pages/butter.md b/pcd-website/src/content/organizer-kit/partner-pages/butter.md new file mode 100644 index 00000000..51149755 --- /dev/null +++ b/pcd-website/src/content/organizer-kit/partner-pages/butter.md @@ -0,0 +1,21 @@ +--- +title: Butter +hideFromNav: true +order: 1 +description: Free Butter Pro for PCD participants in October 2026 +draft: false +hideToc: true +partnerCard: + logo: ../../../images/butter_logo.svg + summary: Get free access to Butter Pro as a PCD participant during October 2026 and build a tool to get a chance to win a cash prize. +--- + +[Butter](https://www.butter.video/) is an online video editor with customizable blocks for motion graphics, animated type, and visual effects. + +## Butter Pro in October + +Butter is offering PCD participants access to Butter Pro during October 2026. Details on how to claim access will be shared here when available. + +## Creative Coding Challenge + +Details TBD diff --git a/pcd-website/src/images/butter_logo.svg b/pcd-website/src/images/butter_logo.svg new file mode 100644 index 00000000..3e66d58f --- /dev/null +++ b/pcd-website/src/images/butter_logo.svg @@ -0,0 +1 @@ + \ No newline at end of file From ea905b560841be8e3232a52e1109be3801300daf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rapha=C3=ABl=20de=20Courville?= Date: Thu, 8 Oct 2026 16:20:04 +0200 Subject: [PATCH 2/2] Update butter content and add video embeds --- AGENTS.md | 2 +- .../organizer-kit/partner-pages/butter.md | 24 +++++++++++++++---- pcd-website/src/styles/prose.css | 11 +++++++++ 3 files changed, 31 insertions(+), 6 deletions(-) diff --git a/AGENTS.md b/AGENTS.md index 212c34e5..71cbe0a5 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -92,7 +92,7 @@ Zine cards live in `src/content/zines//` and the library grid at `/organiz The `Zine Intake` workflow produces final content directly in `src/content/zines//`. Submitters attach files only through GitHub issue-form fields: exactly one reader-order PDF and one print-ready PDF, optional PNG/JPG/JPEG/WebP cover, and optional PDF/ZIP/image/TXT/MD/CSV/JSON supplements. The limits are ten files total, 25 MB per non-image, 10 MB per image, and 50 MB total. Attachment URLs must be GitHub uploads; both Markdown upload links/images and GitHub-generated HTML `` embeds are accepted. When an embedded image URL has no filename, the workflow derives its extension from the validated file signature. The workflow follows only approved GitHub object-store redirects, validates signatures/UTF-8/JSON content, assigns title-derived cover alt text, and writes original filenames (with lowercase extensions) into `downloads/`. Cover and download filenames are separate namespaces, while download filenames must be case-insensitively unique. It builds the Astro site before force-updating the automation-owned `automation/new-zine-` review branch. An invalid later edit preserves the last valid PR commit, marks the PR `needs changes`, and a subsequent valid edit restores `needs review`; maintainer notes are retained in the PR body. Review PDFs for selectable text, logical reading order, document title and language, tagged headings where possible, alt text, and at least one screen-reader-friendly reading-order version. -The global Markdown pipeline runs `rehype-table-wrapper` and `rehype-heading-anchors`, which respectively wrap rendered tables in `.table-wrapper` and add permalink anchors to h2–h6. Their presentation styles live in the shared `prose.css` layer, scoped to both `.prose` and `.docs-prose`, because both plugins apply to all Markdown collections. For a styled caption immediately after a Markdown image, use `…` on the next line; it supports normal Markdown links for attribution. +The global Markdown pipeline runs `rehype-table-wrapper` and `rehype-heading-anchors`, which respectively wrap rendered tables in `.table-wrapper` and add permalink anchors to h2–h6. Their presentation styles live in the shared `prose.css` layer, scoped to both `.prose` and `.docs-prose`, because both plugins apply to all Markdown collections. For a styled caption immediately after a Markdown image, use `…` on the next line; it supports normal Markdown links for attribution. Embed videos hosted on Google Drive with a raw ` + +You can also write your own p5.js sketches and use them within Butter's video editor. Images and fonts you load become easily editable controls. You can seek anywhere in time, and combine your sketch with other visual elements. You can use this to create your own unique visuals, or also to create editable templates or pieces of video that you can reuse in multiple projects. + +Here's a screen recording showing the integration of an existing p5.js sketch into a Butter block: -## Creative Coding Challenge + -Details TBD +Take a look at [Butter's p5.js documentation](https://www.butter.video/docs) for more info, examples, and tutorials for writing p5.js code inside of Butter, or [check out Butter's engineering blog](https://www.butter.video/blog/creative-tool-for-everyone) to learn more about the opportunities of using p5.js for video. \ No newline at end of file diff --git a/pcd-website/src/styles/prose.css b/pcd-website/src/styles/prose.css index f6d2081d..b62899ee 100644 --- a/pcd-website/src/styles/prose.css +++ b/pcd-website/src/styles/prose.css @@ -105,6 +105,17 @@ height: auto; } +:where(.prose, .docs-prose) .prose-video { + display: block; + width: 100%; + height: auto; + aspect-ratio: 1000 / 730; + margin-block: var(--spacing-xl); + border: 0; + border-radius: 0.5rem; + background: #000; +} + :where(.prose, .docs-prose) p:has(+ p > .prose-figure-caption) { margin-bottom: var(--spacing-xs); }