From 55508d81d650b1b03f60c7724051dbb92cf13a36 Mon Sep 17 00:00:00 2001
From: Marcel Werk <burntime@woltlab.com>
Date: Fri, 30 Jul 2021 23:21:07 +0200
Subject: [PATCH] Improved a11y of content items

---
 .../templates/articleListItems.tpl            |  4 +---
 .../install/files/style/ui/contentItem.scss   | 20 ++++++++++++++++++-
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/com.woltlab.wcf/templates/articleListItems.tpl b/com.woltlab.wcf/templates/articleListItems.tpl
index 3f3aeba599..fbdc522170 100644
--- a/com.woltlab.wcf/templates/articleListItems.tpl
+++ b/com.woltlab.wcf/templates/articleListItems.tpl
@@ -27,14 +27,12 @@
 						</div>
 					{/if}
 					
-					<h2 class="contentItemTitle">{$article->getTitle()}</h2>
+					<h2 class="contentItemTitle"><a href="{$article->getLink()}" class="contentItemTitleLink">{$article->getTitle()}</a></h2>
 					
 					<div class="contentItemDescription">
 						{@$article->getFormattedTeaser()}
 					</div>
 				</div>
-				
-				<a href="{$article->getLink()}" class="contentItemLinkShadow"></a>
 			</div>
 			
 			<div class="contentItemMeta">
diff --git a/wcfsetup/install/files/style/ui/contentItem.scss b/wcfsetup/install/files/style/ui/contentItem.scss
index dc2d09a5b3..872b8a7866 100644
--- a/wcfsetup/install/files/style/ui/contentItem.scss
+++ b/wcfsetup/install/files/style/ui/contentItem.scss
@@ -31,9 +31,27 @@
 
 .contentItemLink {
 	flex: 1 auto;
-	position: relative;
 }
 
+.contentItemTitleLink {
+	color: inherit;
+
+	&::before {
+		bottom: 0;
+		content: "";
+		left: 0;
+		position: absolute;
+		right: 0;
+		top: 0;
+	}
+
+	&:hover,
+	&:focus {
+		color: inherit;
+	}
+}
+
+/* Deprecated: use contentItemTitleLink instead. */
 .contentItemLinkShadow {
 	bottom: 0;
 	left: 0;
-- 
2.20.1