diff --git a/package.json b/package.json
index bf77290a1418ad3105466778a339fd81b31f7e46..dbf78de917a4ab373ad50b44ace4f5864775191d 100644
--- a/package.json
+++ b/package.json
@@ -35,6 +35,9 @@
     "stylelint": "^8.2.0",
     "svg-inline-loader": "^0.8.0"
   },
+  "resolutions": {
+    "styled-components": "4.2.0"
+  },
   "workspaces": [
     "wax-prosemirror-core",
     "wax-prosemirror-schema",
diff --git a/wax-prosemirror-components/src/components/button/Button.js b/wax-prosemirror-components/src/components/button/Button.js
index c62287dc0f7d799e622fd2dd5429af89815e7dd0..c2c799786a2a35118f25b9ba192acd1ffabc3f76 100644
--- a/wax-prosemirror-components/src/components/button/Button.js
+++ b/wax-prosemirror-components/src/components/button/Button.js
@@ -1,6 +1,6 @@
 import React from "react";
 import styled from "styled-components";
-import { override } from "@pubsweet/ui-toolkit";
+import { ButtonStyles } from "wax-prosemirror-themes";
 
 const ButtonStyled = styled.button`
   opacity: ${props => (props.select ? 1 : 0.4)};
@@ -10,7 +10,7 @@ const ButtonStyled = styled.button`
   &:hover {
     color: ${props => (props.isActive ? props.theme.colorPrimary : "#000")};
   }
-  ${override("ui.Button")};
+  ${ButtonStyles};
 `;
 
 const Button = ({ view = {}, item }) => (
diff --git a/wax-prosemirror-themes/index.js b/wax-prosemirror-themes/index.js
index b1ec4b46ba92d73dde1bf29392428c87c2b60b8b..042895a859e75e424b4eefa3fcfe75a1916f5ced 100644
--- a/wax-prosemirror-themes/index.js
+++ b/wax-prosemirror-themes/index.js
@@ -1 +1,4 @@
 export { default as cokoTheme } from "./src/coko-theme/index";
+export {
+  default as ButtonStyles
+} from "./src/coko-theme/elements/ButtonStyles";
diff --git a/wax-prosemirror-themes/src/coko-theme/elements/Button.js b/wax-prosemirror-themes/src/coko-theme/elements/Button.js
deleted file mode 100644
index 5a54e9877430650d1835b3b5a117d0cbbe51b350..0000000000000000000000000000000000000000
--- a/wax-prosemirror-themes/src/coko-theme/elements/Button.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import styled, { css } from "styled-components";
-
-export default css`
-  background: #fff;
-  border: none;
-  font-size: inherit;
-  cursor: pointer;
-  border-radius: 0;
-  padding: 5px 10px;
-  &:disabled {
-    color: #ccc;
-    pointer-events: none;
-  }
-  &:hover {
-    background: #f6f6f6;
-  }
-`;
diff --git a/wax-prosemirror-themes/src/coko-theme/elements/index.js b/wax-prosemirror-themes/src/coko-theme/elements/index.js
index 1fdf4382e5bd73f112a978acdddd4aa444265db1..06cac1a0c26cbd6d124cdec09c7ca44d9cd57b12 100644
--- a/wax-prosemirror-themes/src/coko-theme/elements/index.js
+++ b/wax-prosemirror-themes/src/coko-theme/elements/index.js
@@ -1 +1 @@
-export { default as Button } from "./Button";
+export { default as ButtonStyles } from "./ButtonStyles";
diff --git a/wax-prosemirror-themes/src/coko-theme/index.js b/wax-prosemirror-themes/src/coko-theme/index.js
index e6cf886e3cdb7d15873300b446ad15f7ffd8b968..314007987680eb80babb87da18fc5554362c028a 100644
--- a/wax-prosemirror-themes/src/coko-theme/index.js
+++ b/wax-prosemirror-themes/src/coko-theme/index.js
@@ -2,7 +2,7 @@
 import "typeface-fira-sans-condensed";
 import "typeface-vollkorn";
 
-import { Button } from "./elements";
+import { ButtonStyled } from "./elements";
 
 const cokoTheme = {
   /* Colors */
@@ -69,7 +69,7 @@ const cokoTheme = {
 
   cssOverrides: {
     ui: {
-      Button
+      ButtonStyled
     }
   }
 };