diff --git a/packages/components-faraday/src/components/AuthorList/Author.js b/packages/components-faraday/src/components/AuthorList/Author.js
index e7609082e8b4d840523004bc1874a8796a7a0dd7..08d6c1eb749cf36eed05ea509bf81dbfeb3d7e14 100644
--- a/packages/components-faraday/src/components/AuthorList/Author.js
+++ b/packages/components-faraday/src/components/AuthorList/Author.js
@@ -30,12 +30,12 @@ export default ({
<ButtonContainer>
{!isSubmitting && (
<ClickableIcon onClick={removeAuthor(email)} title="Delete author">
- <Icon size={18}>trash</Icon>
+ <Icon size={3}>trash</Icon>
</ClickableIcon>
)}
{editedAuthor < 0 && (
<ClickableIcon onClick={setAuthorEdit(index)} title="Edit author">
- <Icon size={18}>edit-2</Icon>
+ <Icon size={3}>edit-2</Icon>
</ClickableIcon>
)}
</ButtonContainer>
diff --git a/packages/components-faraday/src/components/AuthorList/AuthorAdder.js b/packages/components-faraday/src/components/AuthorList/AuthorAdder.js
index 5a11c7c6c95f732146a7d0d338dc53f750485b8a..eccca432675ccaadea8061465644fc4afe690571 100644
--- a/packages/components-faraday/src/components/AuthorList/AuthorAdder.js
+++ b/packages/components-faraday/src/components/AuthorList/AuthorAdder.js
@@ -60,7 +60,7 @@ const AuthorAdder = ({
Save
</Button>
) : (
- <Spinner />
+ <Spinner size={3} />
)}
</ButtonsContainer>
</FormBody>
diff --git a/packages/components-faraday/src/components/AuthorList/AuthorEditor.js b/packages/components-faraday/src/components/AuthorList/AuthorEditor.js
index 6c3eda8479f8101460f89aba91773d7fd0768a34..879ff26a344b952246bc176aa5ff21700b8dc228 100644
--- a/packages/components-faraday/src/components/AuthorList/AuthorEditor.js
+++ b/packages/components-faraday/src/components/AuthorList/AuthorEditor.js
@@ -51,14 +51,14 @@ const AuthorEdit = ({
<ButtonsContainer>
<ClickableIcon onClick={setAuthorEdit(-1)}>
- <Icon size={18}>x-circle</Icon>
+ <Icon size={3}>x-circle</Icon>
</ClickableIcon>
{!isFetching ? (
<ClickableIcon onClick={handleSubmit}>
- <Icon size={18}>check-circle</Icon>
+ <Icon size={3}>check-circle</Icon>
</ClickableIcon>
) : (
- <Spinner />
+ <Spinner size={3} />
)}
</ButtonsContainer>
</Header>
diff --git a/packages/components-faraday/src/components/AuthorList/FormItems.js b/packages/components-faraday/src/components/AuthorList/FormItems.js
index 7a8a37a59f6c3b6073d92627b64cefe9eef74fc9..807a34fe4cd3103414ecfb16871e67a9ad9851bc 100644
--- a/packages/components-faraday/src/components/AuthorList/FormItems.js
+++ b/packages/components-faraday/src/components/AuthorList/FormItems.js
@@ -38,11 +38,11 @@ export const Label = ({ label, value }) => (
export const DragHandle = withTheme(({ theme }) => (
<DragHandleRoot>
- <Icon color={theme.colorFurniture}>chevron_up</Icon>
- <Icon color={theme.colorFurniture} size={16}>
+ <Icon color={theme.colorPrimary}>chevron_up</Icon>
+ <Icon color={theme.colorPrimary} size={3}>
menu
</Icon>
- <Icon color={theme.colorFurniture}>chevron_down</Icon>
+ <Icon color={theme.colorPrimary}>chevron_down</Icon>
</DragHandleRoot>
))
diff --git a/packages/components-faraday/src/components/Files/FileItem.js b/packages/components-faraday/src/components/Files/FileItem.js
index da8af74567377e54d6c21edcbd7549fb8000f2d5..618292b0234f5e626ec62ff2b520da834572d764 100644
--- a/packages/components-faraday/src/components/Files/FileItem.js
+++ b/packages/components-faraday/src/components/Files/FileItem.js
@@ -1,6 +1,6 @@
import React from 'react'
import { Icon } from '@pubsweet/ui'
-import styled from 'styled-components'
+import styled, { withTheme } from 'styled-components'
const parseFileSize = size => {
const kbSize = size / 1000
@@ -24,9 +24,10 @@ const FileItem = ({
id,
removeFile,
previewFile,
+ theme,
...rest
}) => (
- <Root>
+ <Root data-test={`file-${id}`}>
{dragHandle}
<Info>
<span>{name}</span>
@@ -34,16 +35,20 @@ const FileItem = ({
</Info>
<Buttons>
<button onClick={previewFile(id)}>
- <Icon color="#666">eye</Icon>
+ <Icon color={theme.colorPrimary} size={3}>
+ eye
+ </Icon>
</button>
<button onClick={removeFile(id)} title="Delete">
- <Icon color="#666">trash-2</Icon>
+ <Icon color={theme.colorPrimary} size={3}>
+ trash-2
+ </Icon>
</button>
</Buttons>
</Root>
)
-export default FileItem
+export default withTheme(FileItem)
// #region styles
const Root = styled.div`
diff --git a/packages/components-faraday/src/components/Files/FileSection.js b/packages/components-faraday/src/components/Files/FileSection.js
index 4d3ceb5d564a966eac06b65e771918c348ed1700..453006fd28b79946f691ea5b8ef8140537731d9d 100644
--- a/packages/components-faraday/src/components/Files/FileSection.js
+++ b/packages/components-faraday/src/components/Files/FileSection.js
@@ -1,27 +1,24 @@
import React from 'react'
import PropTypes from 'prop-types'
-import { Icon } from '@pubsweet/ui'
+import { Icon, Spinner, th } from '@pubsweet/ui'
import styled, { withTheme } from 'styled-components'
import { DropTarget } from 'react-dnd'
import { NativeTypes } from 'react-dnd-html5-backend'
import { compose, getContext, withHandlers, withState } from 'recompose'
-import {
- SortableList,
- Spinner,
-} from 'pubsweet-components-faraday/src/components'
+import { SortableList } from 'pubsweet-components-faraday/src/components'
import FileItem from './FileItem'
import FilePicker from './FilePicker'
const DragHandle = withTheme(({ theme }) => (
<Handle>
- <Icon color={theme.colorBorder} size={14}>
+ <Icon color={theme.colorPrimary} size={3}>
chevron_up
</Icon>
- <Icon color={theme.colorBorder} size={10}>
+ <Icon color={theme.colorPrimary} size={3}>
menu
</Icon>
- <Icon color={theme.colorBorder} size={14}>
+ <Icon color={theme.colorPrimary} size={3}>
chevron_down
</Icon>
</Handle>
@@ -198,15 +195,15 @@ export default compose(
// #region styles
const Error = styled.span`
- color: ${({ theme }) => theme.colorError};
- font-size: ${({ theme }) => theme.fontSizeBaseSmall};
- margin-right: 5px;
+ color: ${th('colorError')};
+ font-size: ${th('fontSizeBaseSmall')};
+ margin-right: ${th('subGridUnit')};
`
const UploadButton = styled.div`
cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
display: flex;
- margin-left: 5px;
+ margin-left: ${th('subGridUnit')};
`
const PickerContainer = styled.div`
@@ -216,7 +213,7 @@ const PickerContainer = styled.div`
`
const Title = styled.span`
- margin: 5px;
+ margin: ${th('subGridUnit')};
text-transform: uppercase;
`
@@ -227,7 +224,7 @@ const Header = styled.div`
`
const DropSection = styled.div`
- border: ${({ theme }) => theme.borderDefault};
+ border: ${th('borderDefault')};
border-top: ${({ isFirst, theme }) =>
isFirst ? theme.borderDefault : 'none'};
border-bottom: ${({ isLast, theme }) =>
@@ -236,18 +233,21 @@ const DropSection = styled.div`
over ? theme.colorSecondary : theme.backgroundColorReverse};
display: flex;
flex-direction: column;
- padding: 5px;
+ padding: ${th('subGridUnit')};
`
const Handle = styled.div`
align-items: center;
- border-right: ${({ theme }) => theme.borderDefault};
+ border-right: ${th('borderDefault')};
cursor: move;
display: flex;
flex-direction: column;
justify-content: center;
- margin-right: 10px;
- padding: 3px;
+ margin-right: calc(${th('subGridUnit')}*2);
+ padding: calc(${th('subGridUnit')}/2);
+ span {
+ padding: 0;
+ }
`
const InfoContainer = styled.div`
@@ -255,11 +255,11 @@ const InfoContainer = styled.div`
display: flex;
height: 60px;
justify-content: center;
- margin: 10px 0;
+ margin: calc(${th('subGridUnit')}*2) 0;
span {
- color: ${({ theme }) => theme.colorTextPlaceholder};
- font-size: ${({ theme }) => theme.themefontSizeBaseSmall};
+ color: ${th('colorTextPlaceholder')};
+ font-size: ${th('fontSizeBaseSmall')};
}
`
// #endregion
diff --git a/packages/components-faraday/src/components/Steps/Steps.js b/packages/components-faraday/src/components/Steps/Steps.js
index c6f5e28eff968f61c8a6a2c1c50c59b19b40d1de..f35a2f4428e7d22afdb68f2a02f70dda6d29391e 100644
--- a/packages/components-faraday/src/components/Steps/Steps.js
+++ b/packages/components-faraday/src/components/Steps/Steps.js
@@ -1,30 +1,31 @@
import React from 'react'
import PropTypes from 'prop-types'
+import { th } from '@pubsweet/ui'
import styled, { css } from 'styled-components'
import { compose, withHandlers, setDisplayName } from 'recompose'
const Separator = styled.div`
- background-color: #000;
+ background-color: ${th('colorPrimary')};
flex: 1;
height: 2px;
`
const StyledStep = styled.div`
align-items: center;
- border: 2px solid #000;
+ border: ${th('borderDefault')};
border-radius: 50%;
display: flex;
- height: 16px;
justify-content: center;
position: relative;
- width: 16px;
+ height: calc(${th('subGridUnit')} * 3);
+ width: calc(${th('subGridUnit')} * 3);
`
const bulletStyle = css`
- background-color: #000;
+ background-color: ${th('colorPrimary')};
border-radius: 50%;
- height: 10px;
- width: 10px;
+ height: calc(${th('subGridUnit')} * 2);
+ width: calc(${th('subGridUnit')} * 2);
`
const Bullet = styled.div`
@@ -34,16 +35,17 @@ const Bullet = styled.div`
const Success = styled.div`
${bulletStyle};
align-items: center;
- color: #fff;
+ color: ${th('colorBackground')};
display: flex;
- font-size: 12px;
- height: 18px;
+ font-size: ${th('fontSizeBaseSmall')};
+ height: ${th('fontSizeBase')};
justify-content: center;
- width: 18px;
+ width: ${th('fontSizeBase')};
`
const StepTitle = styled.span`
- font-size: 0.9em;
+ font-size: ${th('fontSizeBaseSmall')};
+ line-height: ${th('fontSizeBaseSmall')};
left: -45px;
position: absolute;
text-align: center;
diff --git a/packages/xpub-faraday/app/config/journal/submit-wizard.js b/packages/xpub-faraday/app/config/journal/submit-wizard.js
index ba82ddd15a86922d5c035b4110a102e9361d3748..fc0158b728284b9d084456f9ac89c2e747537f21 100644
--- a/packages/xpub-faraday/app/config/journal/submit-wizard.js
+++ b/packages/xpub-faraday/app/config/journal/submit-wizard.js
@@ -1,7 +1,7 @@
import React from 'react'
import styled from 'styled-components'
import uploadFileFn from 'xpub-upload'
-import { TitleEditor } from 'xpub-edit'
+import { AbstractEditor, TitleEditor } from 'xpub-edit'
import { Menu, YesOrNo, TextField } from '@pubsweet/ui'
import { required, minChars, minSize } from 'xpub-validators'
import {
@@ -142,7 +142,7 @@ export default {
},
{
fieldId: 'metadata.abstract',
- renderComponent: TitleEditor,
+ renderComponent: AbstractEditor,
title: 'Abstract',
placeholder: 'Write an abstract',
validate: [requiredBasedOnType],
diff --git a/packages/xpub-faraday/package.json b/packages/xpub-faraday/package.json
index fdeed11e7a42eb008471d942184d288abd02dfbd..365407d9373fac7980c27e0f9773f0b71db7bc16 100644
--- a/packages/xpub-faraday/package.json
+++ b/packages/xpub-faraday/package.json
@@ -27,7 +27,7 @@
"pubsweet": "^1.1.1",
"pubsweet-client": "^2.2.2",
"pubsweet-component-invite": "^0.0.1",
- "pubsweet-component-login": "^1.0.1",
+ "pubsweet-component-login": "^1.1.0",
"pubsweet-component-signup": "^1.0.0",
"pubsweet-component-xpub-manuscript": "^0.0.3",
"pubsweet-server": "^1.0.1",
diff --git a/yarn.lock b/yarn.lock
index eabd52e5f86eb47d4e53692b9e62e529deba8775..78fcd80cbea0b5bec10c849f023d4fed20f55693 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8102,12 +8102,11 @@ pubsweet-client@^2.2.2:
styled-components "^2.4.0"
styled-normalize "^3.0.1"
-pubsweet-component-login@^1.0.1:
- version "1.0.1"
- resolved "https://registry.yarnpkg.com/pubsweet-component-login/-/pubsweet-component-login-1.0.1.tgz#49ca1dd02cd56e4169af875465a655ee88736989"
+pubsweet-component-login@^1.1.0:
+ version "1.1.0"
+ resolved "https://registry.yarnpkg.com/pubsweet-component-login/-/pubsweet-component-login-1.1.0.tgz#037b666863ae44c5fcde0d4b02e23b8a53f0d104"
dependencies:
prop-types "^15.5.10"
- react-bootstrap "^0.32.0"
react-redux "^5.0.6"
react-router-dom "^4.2.2"
react-router-redux "^5.0.0-alpha.9"