From eea504a96176187f11381aa711360c208621a214 Mon Sep 17 00:00:00 2001 From: Zach Leatherman Date: Tue, 14 Jan 2025 15:23:55 -0600 Subject: [PATCH] Add 16/9 aspect ratio for video/iframe to default CSS --- eleventy.config.js | 1 + public/css/index.css | 10 +++++++--- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/eleventy.config.js b/eleventy.config.js index ea6a25f..4c5e170 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -79,6 +79,7 @@ export default async function(eleventyConfig) { // widths: ["auto"], + failOnError: false, htmlOptions: { imgAttributes: { // e.g. assigned on the HTML tag will override these values. diff --git a/public/css/index.css b/public/css/index.css index c768de1..b8a97e1 100644 --- a/public/css/index.css +++ b/public/css/index.css @@ -72,9 +72,7 @@ body { } /* Fluid images via https://www.zachleat.com/web/fluid-images/ */ -img, -video, -iframe { +img{ max-width: 100%; } img[width][height] { @@ -85,6 +83,12 @@ img[src$=".svg"] { height: auto; max-width: none; } +video, +iframe { + max-width: 100%; + height: auto; + aspect-ratio: 16/9; +} p:last-child { margin-bottom: 0;