From 6f9d1af23eacf9ce369a7c24681f94c3d18537ac Mon Sep 17 00:00:00 2001
From: Olivier Tassinari <olivier.tassinari@gmail.com>
Date: Wed, 21 Feb 2024 19:03:35 +0100
Subject: [PATCH] [docs-infra] Style collocation

Style spread on two different files will be hard to keep in sync.
Follow-up on https://github.com/mui/material-ui/pull/41181
Also simplify the CSS selector for performance.
---
 docs/src/modules/components/Ad.js              | 5 +----
 docs/src/modules/components/MarkdownElement.js | 6 +++++-
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/docs/src/modules/components/Ad.js b/docs/src/modules/components/Ad.js
index b6ffa38090565f..0e910aa6614d4d 100644
--- a/docs/src/modules/components/Ad.js
+++ b/docs/src/modules/components/Ad.js
@@ -222,10 +222,6 @@ export default function Ad() {
         mt: AD_MARGIN_TOP,
         mb: AD_MARGIN_BOTTOM,
         minHeight: AD_HEIGHT_MOBILE,
-        '& a[target="_blank"]::after': {
-          // Remove link arrow for ads
-          display: 'none',
-        },
         [theme.breakpoints.up('sm')]: {
           minHeight: AD_HEIGHT,
         },
@@ -242,6 +238,7 @@ export default function Ad() {
       data-ga-event-category="ad"
       data-ga-event-action="click"
       data-ga-event-label={eventLabel}
+      className="Ad-root"
     >
       <AdErrorBoundary eventLabel={eventLabel}>{children}</AdErrorBoundary>
     </Box>
diff --git a/docs/src/modules/components/MarkdownElement.js b/docs/src/modules/components/MarkdownElement.js
index 4cb01ecf1d3e29..98a10397e8d56a 100644
--- a/docs/src/modules/components/MarkdownElement.js
+++ b/docs/src/modules/components/MarkdownElement.js
@@ -407,10 +407,14 @@ const Root = styled('div')(
       opacity: 1,
       transform: 'translate(1px, 0)',
     },
-    '& a.remove-link-arrow[target="_blank"]::after': {
+    '& a.remove-link-arrow::after': {
       // Allows to remove link arrows for images
       display: 'none',
     },
+    '& .MuiAd-root a::after': {
+      // Remove link arrow for ads
+      display: 'none',
+    },
     '& a, & a code': {
       // Style taken from the Link component
       color: `var(--muidocs-palette-primary-600, ${lightTheme.palette.primary[600]})`,