diff --git a/editors/demo/src/Editoria/layout/EditoriaLayout.js b/editors/demo/src/Editoria/layout/EditoriaLayout.js
index 3a40000d648c92e861529ce56da83459e152a775..6eec59820967f0128bf96c69ce0a2ede0cffa171 100644
--- a/editors/demo/src/Editoria/layout/EditoriaLayout.js
+++ b/editors/demo/src/Editoria/layout/EditoriaLayout.js
@@ -282,6 +282,7 @@ const EditoriaLayout = ({ editor }) => {
                   </CommentTrackToolsContainer>
                   <RightArea area="main" />
                 </CommentsContainer>
+                <WaxOverlays />
               </WaxSurfaceScroll>
 
               {hasNotes && (
@@ -297,7 +298,7 @@ const EditoriaLayout = ({ editor }) => {
             </PanelGroup>
           </EditorArea>
         </Main>
-        <WaxOverlays />
+
         <WaxBottomRightInfo>
           <InfoContainer id="info-container">
             <BottomRightInfo />
diff --git a/wax-prosemirror-components/src/components/link/LinkComponent.js b/wax-prosemirror-components/src/components/link/LinkComponent.js
index 7513a37d9a1cec2737c6f5659343d1e1f2e728a5..5ff740b249107f7a507ad591072bfae01cf014d9 100644
--- a/wax-prosemirror-components/src/components/link/LinkComponent.js
+++ b/wax-prosemirror-components/src/components/link/LinkComponent.js
@@ -1,7 +1,7 @@
 /* eslint react/prop-types: 0 */
 import React, { useRef, useEffect, useState, useContext } from 'react';
 import styled from 'styled-components';
-import { grid, th } from '@pubsweet/ui-toolkit';
+import { grid, th, override } from '@pubsweet/ui-toolkit';
 import { WaxContext } from 'wax-prosemirror-core';
 import { DocumentHelpers } from 'wax-prosemirror-utilities';
 
@@ -17,12 +17,15 @@ const Wrapper = styled.div`
     color: #3a4863;
     text-decoration: none;
   }
+  ${override('Wax.LinkContainer')}
 `;
 
 const LinkWrapper = styled.div`
   display: inline-block;
   width: 250px;
   margin-right: 12px;
+
+  ${override('Wax.LinkWrapper')}
 `;
 
 const Input = styled.input`
@@ -32,6 +35,7 @@ const Input = styled.input`
   :focus {
     outline: none;
   }
+  ${override('Wax.LinkInput')}
 `;
 
 const ButtonGroup = styled.div`
@@ -43,13 +47,18 @@ const StyledButton = styled.button`
   background: ${th('colorPrimary')};
   cursor: pointer;
   color: #fff;
+
+  ${override('Wax.LinkCreate')}
 `;
 
 const StyledButtonCancel = styled.button`
   margin-right: 10px;
   background: #fff
   cursor: pointer;
-  color:${th('colorPrimary')};;
+  color:${th('colorPrimary')};
+
+    ${override('Wax.LinkCancel')}
+
 `;
 
 const LinkComponent = ({ mark, setPosition, position }) => {
diff --git a/wax-prosemirror-services/src/OverlayService/usePosition.js b/wax-prosemirror-services/src/OverlayService/usePosition.js
index d5e63043f6901b59253228b90a30b28c49f96376..fe20d24b41011af59ab8783c7bbeba92f46de478 100644
--- a/wax-prosemirror-services/src/OverlayService/usePosition.js
+++ b/wax-prosemirror-services/src/OverlayService/usePosition.js
@@ -33,8 +33,15 @@ export default options => {
     const WaxSurface = focusedView.dom.getBoundingClientRect();
     const start = focusedView.coordsAtPos(from);
     const end = focusedView.coordsAtPos(to);
+    // const { left } = end;
+    // const top = end.top + 20;
+
+    // TEMP FIX
+
+    const parent = focusedView.dom.parentNode.getBoundingClientRect();
+
     const { left } = end;
-    const top = end.top + 20;
+    const top = parent.top + 20;
     return {
       top,
       left,