From a4d8cf175a8bff477c419210432541a97f87cb76 Mon Sep 17 00:00:00 2001
From: Michael Fabian 'Xaymar' Dirks <info@xaymar.com>
Date: Tue, 11 Jan 2022 07:13:32 +0100
Subject: [PATCH] Fix media and columns

---
 _includes/blocks/media.liquid |  3 +++
 _sass/_block-columns.scss     |  2 +-
 _sass/_block-media.scss       | 12 ++++++++++++
 3 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/_includes/blocks/media.liquid b/_includes/blocks/media.liquid
index 071adf6..e287363 100644
--- a/_includes/blocks/media.liquid
+++ b/_includes/blocks/media.liquid
@@ -4,6 +4,7 @@
 {% endif %}
 {% if include.type == "image" %}
 <picture
+	class="content"
 	src="{{ include.url | absolute_url }}"
 	{% if include.width %}width="{{ include.width }}"{% endif %}
 	{% if include.height %}height="{{ include.height }}"{% endif %}>
@@ -14,6 +15,7 @@
 </picture>
 {% elsif include.type == "video" %}
 <video controls
+	class="content"
 	{% if include.poster %}poster="{{ include.poster | absolute_url }}"{% endif %}
 	{% if include.preload %}preload="{{ include.preload }}"{% endif %}
 	src="{{ include.url | absolute_url }}"
@@ -26,6 +28,7 @@
 </video>
 {% elsif include.type == "audio" %}
 <audio controls
+	class="content"
 	{% if include.preload %}preload="{{ include.preload }}"{% endif %}
 	src="{{ include.url | absolute_url }}"
 	{% if include.width %}width="{{ include.width }}"{% endif %}
diff --git a/_sass/_block-columns.scss b/_sass/_block-columns.scss
index ae1b7db..1968b55 100644
--- a/_sass/_block-columns.scss
+++ b/_sass/_block-columns.scss
@@ -6,7 +6,7 @@
 .block-columns > .content {
 	display: grid;
 	grid-template-columns: repeat(auto-fit, minmax(calc(#{$theme-width} / 3 - 5rem), 1fr));
-	grid-column-gap: 1rem;
+	grid-column-gap: 0rem;
 	grid-row-gap: 1rem;
 }
 
diff --git a/_sass/_block-media.scss b/_sass/_block-media.scss
index c555422..6a9ea73 100644
--- a/_sass/_block-media.scss
+++ b/_sass/_block-media.scss
@@ -1,6 +1,13 @@
 // --------------------------------------------------------------------------------
 // Block: Media
 // --------------------------------------------------------------------------------
+.block-media {
+}
+
+.block-media > a > .content,
+.block-media > .content {
+}
+
 .block-media > figcaption {
 	display: block;
 	margin: 0;
@@ -28,3 +35,8 @@
 // --------------------------------------------------------------------------------
 // Block: Media > Picture
 // --------------------------------------------------------------------------------
+.block-media > a > .content > img,
+.block-media > .content > img {
+	display: block;
+	width: 100%;
+}