From 62d94aea8f15d606d2ce157fb611df02f649a007 Mon Sep 17 00:00:00 2001
From: Alexander Ebert <ebert@woltlab.com>
Date: Tue, 22 Aug 2023 10:28:19 +0200
Subject: [PATCH] Force unfurled URLs into separate rows

---
 com.woltlab.wcf/templates/unfurlUrl.tpl       | 24 ++++++++++---------
 .../install/files/acp/templates/unfurlUrl.tpl | 24 ++++++++++---------
 .../install/files/style/ui/unfurlUrl.scss     |  5 +++-
 3 files changed, 30 insertions(+), 23 deletions(-)

diff --git a/com.woltlab.wcf/templates/unfurlUrl.tpl b/com.woltlab.wcf/templates/unfurlUrl.tpl
index 80cfae04d32..4b9805ee436 100644
--- a/com.woltlab.wcf/templates/unfurlUrl.tpl
+++ b/com.woltlab.wcf/templates/unfurlUrl.tpl
@@ -2,17 +2,19 @@
 	{if $object->isPlainUrl()}
 		<a {anchorAttributes url=$object->url isUgc=$enableUgc}>{$object->title}</a>
 	{else}
-		<div class="unfurlUrlCard{*
-			*}{if $object->hasCoverImage()} unfurlUrlCardCoverImage{/if}{*
-			*}{if $object->hasSquaredImage()} unfurlUrlCardSquaredImage{/if}{*
-		*}">
-			{if !$object->getImageUrl()|empty}
-				<img src="{$object->getImageUrl()}" height="{$object->height}" width="{$object->width}" class="unfurlUrlImage" alt="" loading="lazy">
-			{/if}
-			<div class="unfurlUrlInformation">
-				<a class="unfurlUrlTitle" {anchorAttributes url=$object->url appendClassname=false isUgc=$enableUgc}>{$object->title}</a>
-				<div class="unfurlUrlDescription">{$object->description}</div>
-				<div class="unfurlUrlHost">{$object->getHost()}</div>
+		<div class="unfurlUrlCardContainer">
+			<div class="unfurlUrlCard{*
+				*}{if $object->hasCoverImage()} unfurlUrlCardCoverImage{/if}{*
+				*}{if $object->hasSquaredImage()} unfurlUrlCardSquaredImage{/if}{*
+			*}">
+				{if !$object->getImageUrl()|empty}
+					<img src="{$object->getImageUrl()}" height="{$object->height}" width="{$object->width}" class="unfurlUrlImage" alt="" loading="lazy">
+				{/if}
+				<div class="unfurlUrlInformation">
+					<a class="unfurlUrlTitle" {anchorAttributes url=$object->url appendClassname=false isUgc=$enableUgc}>{$object->title}</a>
+					<div class="unfurlUrlDescription">{$object->description}</div>
+					<div class="unfurlUrlHost">{$object->getHost()}</div>
+				</div>
 			</div>
 		</div>
 	{/if}
diff --git a/wcfsetup/install/files/acp/templates/unfurlUrl.tpl b/wcfsetup/install/files/acp/templates/unfurlUrl.tpl
index 80cfae04d32..4b9805ee436 100644
--- a/wcfsetup/install/files/acp/templates/unfurlUrl.tpl
+++ b/wcfsetup/install/files/acp/templates/unfurlUrl.tpl
@@ -2,17 +2,19 @@
 	{if $object->isPlainUrl()}
 		<a {anchorAttributes url=$object->url isUgc=$enableUgc}>{$object->title}</a>
 	{else}
-		<div class="unfurlUrlCard{*
-			*}{if $object->hasCoverImage()} unfurlUrlCardCoverImage{/if}{*
-			*}{if $object->hasSquaredImage()} unfurlUrlCardSquaredImage{/if}{*
-		*}">
-			{if !$object->getImageUrl()|empty}
-				<img src="{$object->getImageUrl()}" height="{$object->height}" width="{$object->width}" class="unfurlUrlImage" alt="" loading="lazy">
-			{/if}
-			<div class="unfurlUrlInformation">
-				<a class="unfurlUrlTitle" {anchorAttributes url=$object->url appendClassname=false isUgc=$enableUgc}>{$object->title}</a>
-				<div class="unfurlUrlDescription">{$object->description}</div>
-				<div class="unfurlUrlHost">{$object->getHost()}</div>
+		<div class="unfurlUrlCardContainer">
+			<div class="unfurlUrlCard{*
+				*}{if $object->hasCoverImage()} unfurlUrlCardCoverImage{/if}{*
+				*}{if $object->hasSquaredImage()} unfurlUrlCardSquaredImage{/if}{*
+			*}">
+				{if !$object->getImageUrl()|empty}
+					<img src="{$object->getImageUrl()}" height="{$object->height}" width="{$object->width}" class="unfurlUrlImage" alt="" loading="lazy">
+				{/if}
+				<div class="unfurlUrlInformation">
+					<a class="unfurlUrlTitle" {anchorAttributes url=$object->url appendClassname=false isUgc=$enableUgc}>{$object->title}</a>
+					<div class="unfurlUrlDescription">{$object->description}</div>
+					<div class="unfurlUrlHost">{$object->getHost()}</div>
+				</div>
 			</div>
 		</div>
 	{/if}
diff --git a/wcfsetup/install/files/style/ui/unfurlUrl.scss b/wcfsetup/install/files/style/ui/unfurlUrl.scss
index 2373daa7f31..09a38029204 100644
--- a/wcfsetup/install/files/style/ui/unfurlUrl.scss
+++ b/wcfsetup/install/files/style/ui/unfurlUrl.scss
@@ -1,3 +1,7 @@
+.unfurlUrlCardContainer {
+	margin: 1em 0 0 0;
+}
+
 .unfurlUrlCard {
 	background-color: var(--wcfContentBackground);
 	border-radius: 3px;
@@ -6,7 +10,6 @@
 		0 1px 2px rgba(0, 0, 0, 0.24);
 	color: var(--wcfContentText);
 	display: inline-block;
-	margin: 1em 0 0 0;
 	max-width: 100%;
 	overflow: hidden;
 	position: relative;