diff --git a/packages/component-faraday-ui/src/ActionLink.js b/packages/component-faraday-ui/src/ActionLink.js index ef0f8fb1ad20287e507369cc61c18184a2730ea7..2a42c9c6cba868c85a0972c818a79b630cc062dd 100644 --- a/packages/component-faraday-ui/src/ActionLink.js +++ b/packages/component-faraday-ui/src/ActionLink.js @@ -3,6 +3,8 @@ import styled from 'styled-components' import { th } from '@pubsweet/ui-toolkit' import { Action, Icon } from '@pubsweet/ui' +import { paddingHelper } from './styledHelpers' + const ActionLink = ({ to, icon, @@ -10,8 +12,9 @@ const ActionLink = ({ children, iconSize = 2, iconPosition = 'left', + ...rest }) => ( - <Root> + <Root {...rest} to={to}> {icon && iconPosition === 'left' && ( <Icon secondary={to} size={iconSize} warning={!to}> @@ -40,7 +43,7 @@ export default ActionLink const ExternalLink = styled.a` color: ${th('colorSecondary')}; font-family: ${th('fontReading')}; - text-decoration: none; + text-decoration: underline; &:hover { color: ${th('colorSecondary')}; @@ -51,6 +54,10 @@ const ExternalLink = styled.a` const Root = styled.div` align-items: center; - display: flex; + display: ${props => (props.to ? 'inline-flex' : 'flex')}; + ${paddingHelper}; + + height: max-content; + width: max-content; ` // #endregion diff --git a/packages/component-faraday-ui/src/Text.js b/packages/component-faraday-ui/src/Text.js index 590a35c0648966251875623ceb0792e68f502780..a20e14240b4b57b5fd483c9784a2d91bd9701cb8 100644 --- a/packages/component-faraday-ui/src/Text.js +++ b/packages/component-faraday-ui/src/Text.js @@ -37,6 +37,7 @@ const fontSize = css` ` export default styled.span` + display: inline-block; text-align: ${props => props.align || 'start'}; ${fontSize}; ${textHelper}; diff --git a/packages/component-faraday-ui/src/index.js b/packages/component-faraday-ui/src/index.js index 638da0a07ac606db49f82a38d240a545fdeb1dc0..e8d7558d16339ef24fee4df7ae9c8d50c2711995 100644 --- a/packages/component-faraday-ui/src/index.js +++ b/packages/component-faraday-ui/src/index.js @@ -1,3 +1,4 @@ +export { default as ActionLink } from './ActionLink' export { default as AppBar } from './AppBar' export { default as AppBarMenu } from './AppBarMenu' export { default as AuthorCard } from './AuthorCard' @@ -5,6 +6,7 @@ export { default as AuthorTag } from './AuthorTag' export { default as AuthorTagList } from './AuthorTagList' export { default as AutosaveIndicator } from './AutosaveIndicator' export { default as ContextualBox } from './ContextualBox' +export { default as DragHandle } from './DragHandle' export { default as File } from './File' export { default as IconButton } from './IconButton' export { default as Label } from './Label' diff --git a/packages/component-wizard/src/components/StepOne.js b/packages/component-wizard/src/components/StepOne.js index df7d40655aae5a2327f937104256c4cc14f3647b..b6cc33b1cdefcbd2734f6f96dc1640dbb10cbd9b 100644 --- a/packages/component-wizard/src/components/StepOne.js +++ b/packages/component-wizard/src/components/StepOne.js @@ -1,8 +1,8 @@ import React, { Fragment } from 'react' import styled from 'styled-components' import { th } from '@pubsweet/ui-toolkit' -import { Row, Text } from 'pubsweet-component-faraday-ui' -import { Checkbox, ValidatedField, H2, Action } from '@pubsweet/ui' +import { Checkbox, ValidatedField, H2 } from '@pubsweet/ui' +import { ActionLink, Text, Row } from 'pubsweet-component-faraday-ui' const StepOne = () => ( <Fragment> @@ -15,8 +15,10 @@ const StepOne = () => ( </Row> <Row justify="flex-start" mb={1}> <Text> - I am aware that accepted manuscripts are subject to an{' '} - <Action>Article Processing Charge of $1,250.</Action> + I am aware that accepted manuscripts are subject to an + <ActionLink pl={1 / 2} pr={1 / 2} to="https://www.hindawi.com/apc/"> + Article Processing Charge of $1,250. + </ActionLink> </Text> </Row> <Row justify="flex-start" mb={1}> @@ -44,16 +46,24 @@ const StepOne = () => ( </Row> <Row justify="flex-start" mb={1}> <Text> - I am aware that an <Action>ORCID</Action> is required for the - corresponding author before the article can be published (if accepted). - The ORCID should be added via your user account. + I am aware that an + <ActionLink pl={1 / 2} pr={1 / 2} to="https://orcid.org/"> + ORCID + </ActionLink> + is required for the corresponding author before the article can be + published (if accepted). The ORCID should be added via your user + account. </Text> </Row> <Row justify="flex-start" mb={1}> <Text> - I am aware that an <Action>institutional membership</Action> is required - for the corresponding author before the article can be published (if - accepted). The ORCID should be added via your user account. + I am aware that an + <ActionLink pl={1 / 2} pr={1 / 2} to="https://www.hindawi.com/members/"> + institutional membership + </ActionLink> + is required for the corresponding author before the article can be + published (if accepted). The ORCID should be added via your user + account. </Text> </Row> <Row justify="center" mb={6} mt={1}> diff --git a/packages/component-wizard/src/components/StepTwo.js b/packages/component-wizard/src/components/StepTwo.js index ef42d043231e5c59679ae084c8c86ee4b38dfef0..f0cdacf13582f36f018362c97e251da489aa6f1e 100644 --- a/packages/component-wizard/src/components/StepTwo.js +++ b/packages/component-wizard/src/components/StepTwo.js @@ -36,6 +36,7 @@ const StepTwo = ({ authors </Text> </Row> + <Row mb={1}> <Item data-test="submission-title" flex={3} vertical withRightMargin> <Label required>MANUSCRIPT TITLE</Label> @@ -54,6 +55,7 @@ const StepTwo = ({ /> </Item> </Row> + <Row mb={1}> <Item data-test="submission-abstract" vertical> <Label required>ABSTRACT</Label> @@ -64,6 +66,7 @@ const StepTwo = ({ /> </Item> </Row> + <Row mb={1}> <Item vertical> <Label justify="space-between" required>