style(dashboard-card): change style of decline agree he buttons

packages/components-faraday/src/components/Dashboard/DashboardCard.js

@@ -164,6 +164,7 @@ export default compose(
       const assignedHE =
         assignedPeople && assignedPeople.find(p => p.role === 'handlingEditor')
 
+      // this can be changed, but it works; cba
       if (isAdmin || isEic) {
         if (status === 'submitted' || status === 'he-invited')
           return <EditorInChiefActions project={project} />

packages/components-faraday/src/components/Dashboard/EditorInChiefActions.js

@@ -180,9 +180,9 @@ const HEActions = styled.div`
 const AssignButton = styled(Button)`
   ${defaultText};
   align-items: center;
-  background-color: ${th('colorPrimary')};
   color: ${th('colorTextReverse')};
-  text-align: center;
+  background-color: ${th('colorPrimary')};
   height: calc(${th('subGridUnit')}*5);
+  text-align: center;
 `
 // #endregion

packages/components-faraday/src/components/Dashboard/HandlingEditorActions.js

 import React from 'react'
 import { connect } from 'react-redux'
-import styled from 'styled-components'
-import { th, Button } from '@pubsweet/ui'
 import { actions } from 'pubsweet-client'
+import { th, Button } from '@pubsweet/ui'
+import styled, { css } from 'styled-components'
 import { withHandlers, compose, withState } from 'recompose'
 import {
   withModal,
@@ -45,10 +45,10 @@ const ModalComponent = ({ type, ...rest }) =>
 
 const HandlingEditorActions = ({ showHEModal }) => (
   <Root>
-    <Button onClick={showHEModal('decline')}>DECLINE</Button>
-    <Button onClick={showHEModal()} primary>
+    <DecisionButton onClick={showHEModal('decline')}>DECLINE</DecisionButton>
+    <DecisionButton onClick={showHEModal()} primary>
       AGREE
-    </Button>
+    </DecisionButton>
   </Root>
 )
 
@@ -111,6 +111,22 @@ export default compose(
 )(HandlingEditorActions)
 
 // #region styled-components
+const defaultText = css`
+  font-family: ${th('fontReading')};
+  font-size: ${th('fontSizeBaseSmall')};
+`
+
+const DecisionButton = styled(Button)`
+  ${defaultText};
+  align-items: center;
+  color: ${({ primary }) =>
+    primary ? th('colorTextReverse') : th('colorPrimary')});
+  background-color: ${({ primary }) =>
+    primary ? th('colorPrimary') : th('backgroundColorReverse')};
+  height: calc(${th('subGridUnit')}*5);
+  text-align: center;
+`
+
 const DeclineRoot = styled.div`
   align-items: center;
   background-color: ${th('backgroundColor')};