feat: Add double border to AMEND match tooltips and sidebar (#247)

guardian · Dec 6, 2022 · d97a67e · d97a67e
1 parent ac2bf7e
commit d97a67e
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/src/ts/components/MatchOverlay.tsx b/src/ts/components/MatchOverlay.tsx
@@ -83,7 +83,7 @@ const matchOverlay = ({
     // If there's a gap, the tooltip library detects a `mouseleave` event
     // and closes the tooltip prematurely. We account for this with
     // padding on the tooltip container – see the styling for MatchWidget.
-    const yOffset = -3;
+    const yOffset = -4;
     const isTop = placement.indexOf("top") >= 0;
     const isBottom = placement.indexOf("bottom") >= 0
     if (referenceElement && currentRectIndex !== undefined && (isTop || isBottom)) {

diff --git a/src/ts/components/SidebarMatch.tsx b/src/ts/components/SidebarMatch.tsx
@@ -69,7 +69,7 @@ export const getSidebarMatchStyles = (
       `;
     case MatchType.AMEND:
       return css`
-        border-left: 2px solid ${color};
+        border-left: 4px double ${color};
       `;
   }
 };

diff --git a/src/ts/utils/decoration.ts b/src/ts/utils/decoration.ts
@@ -279,7 +279,7 @@ export const createGlobalDecorationStyleTag = (
   const styleContent = `
     .${DecorationClassMap.AMEND} {
       background-color: ${hasReplacementColours.backgroundColour};
-      border-bottom: 2px solid ${hasReplacementColours.borderColour};
+      border-bottom: 4px double ${hasReplacementColours.borderColour};
     }
 
     .${DecorationClassMap.AMEND}.MatchDecoration--is-selected {