diff --git a/css/lite-yt-embed.css b/css/lite-yt-embed.css index c96a472..55ca0f3 100644 --- a/css/lite-yt-embed.css +++ b/css/lite-yt-embed.css @@ -6,7 +6,7 @@ lite-youtube { background-position: center center; background-size: cover; cursor: pointer; - max-width: 720px; + max-width: 100%; } /* gradient */ diff --git a/eleventy.config.js b/eleventy.config.js index 3f0b432..55a3fe3 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -242,11 +242,18 @@ export default function (eleventyConfig) { }); // Embed Everything - auto-embed YouTube, Vimeo, Bluesky, Mastodon, etc. + // YouTube uses lite-yt-embed facade: shows thumbnail + play button, + // only loads full iframe on click (~800 KiB savings). + // CSS/JS disabled here — already loaded in base.njk. eleventyConfig.addPlugin(embedEverything, { use: ["youtube", "vimeo", "twitter", "mastodon", "bluesky", "spotify", "soundcloud"], youtube: { options: { - lite: false, + lite: { + css: { enabled: false }, + js: { enabled: false }, + responsive: true, + }, recommendSelfOnly: true, }, }, @@ -266,7 +273,8 @@ export default function (eleventyConfig) { // Usage: {{ url | unfurlCard | safe }} eleventyConfig.addFilter("unfurlCard", getCachedCard); - // Custom transform to convert YouTube links to embeds + // Custom transform to convert YouTube links to lite-youtube embeds + // Catches bare YouTube links in Markdown that the embed plugin misses eleventyConfig.addTransform("youtube-link-to-embed", function (content, outputPath) { if (!outputPath || !outputPath.endsWith(".html")) { return content; @@ -276,8 +284,8 @@ export default function (eleventyConfig) { const youtubePattern = /]+href="https?:\/\/(?:www\.)?(?:youtube\.com\/watch\?v=|youtu\.be\/)([a-zA-Z0-9_-]+)[^"]*"[^>]*>(?:https?:\/\/)?(?:www\.)?[^<]*(?:youtube|youtu\.be)[^<]*<\/a>/gi; content = content.replace(youtubePattern, (match, videoId) => { - // Use standard YouTube iframe with exact oEmbed parameters - return `
`; + // Use lite-youtube facade — loads full iframe only on click + return `
`; }); // Clean up empty
tags created by the replacement diff --git a/images/rick.jpg b/images/rick.jpg index f976d6d..82322a8 100644 Binary files a/images/rick.jpg and b/images/rick.jpg differ diff --git a/tailwind.config.js b/tailwind.config.js index 3d3477f..52e6bbb 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -41,20 +41,6 @@ export default { 900: "#78350f", 950: "#451a03", }, - // Legacy — kept for compatibility, not used in templates - primary: { - 50: "#eff6ff", - 100: "#dbeafe", - 200: "#bfdbfe", - 300: "#93c5fd", - 400: "#60a5fa", - 500: "#3b82f6", - 600: "#2563eb", - 700: "#1d4ed8", - 800: "#1e40af", - 900: "#1e3a8a", - 950: "#172554", - }, }, fontFamily: { sans: [