From 1967ee3c71736a6a59759e8a9dff623036b6908f Mon Sep 17 00:00:00 2001
From: inwerpsel <pieter.vincent1988@gmail.com>
Date: Thu, 21 Apr 2022 10:49:11 +0200
Subject: [PATCH] Prevent conflict with pdf and external link styles

* By using :before instead of :after.
* Remove the pseudo element text in the editor.
* Only show the outline of the first link while the parent block has
focus within.
---
 assets/src/styles/editorStyle.scss | 12 +-----------
 assets/src/styles/style.scss       | 20 +++++++++++++-------
 2 files changed, 14 insertions(+), 18 deletions(-)

diff --git a/assets/src/styles/editorStyle.scss b/assets/src/styles/editorStyle.scss
index a795171439..f398dadfef 100644
--- a/assets/src/styles/editorStyle.scss
+++ b/assets/src/styles/editorStyle.scss
@@ -28,7 +28,7 @@
 @import "editorFonts";
 
 .is-style-expand-link {
-  a {
+  &:focus-within a {
     outline: 1px dashed grey;
     outline-offset: 2px;
   }
@@ -36,14 +36,4 @@
   a:not(:first-of-type) {
     outline: 2px solid red;
   }
-
-  &:before {
-    content: "Entirely clickable";
-    position: absolute;
-    bottom: -24px;
-    left: 8px;
-    font-size: 14px;
-    font-style: italic;
-    color: grey;
-  }
 }
diff --git a/assets/src/styles/style.scss b/assets/src/styles/style.scss
index 5480045ae9..7ee698ebaf 100644
--- a/assets/src/styles/style.scss
+++ b/assets/src/styles/style.scss
@@ -10,12 +10,18 @@
 .is-style-expand-link {
   position: relative;
 
-  a:after {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    bottom: 0;
-    right: 0;
+  a {
+    &:before {
+      content: "";
+      position: absolute;
+      top: 0;
+      left: 0;
+      bottom: 0;
+      right: 0;
+    }
+
+    &:after {
+      display: none;
+    }
   }
 }