diff --git a/frontend/scenes/Document/components/DocumentMove/components/PathToDocument.js b/frontend/scenes/Document/components/DocumentMove/components/PathToDocument.js index 1c2ec5ff..df2f1697 100644 --- a/frontend/scenes/Document/components/DocumentMove/components/PathToDocument.js +++ b/frontend/scenes/Document/components/DocumentMove/components/PathToDocument.js @@ -13,27 +13,38 @@ import Document from 'models/Document'; import DocumentsStore from 'stores/DocumentsStore'; const ResultWrapper = styled.div` -display: flex; -margin-bottom: 10px; + display: flex; + margin-bottom: 10px; -color: ${color.text}; -cursor: default; + color: ${color.text}; + cursor: default; +`; + +const StyledChevronIcon = styled(ChevronIcon)` + padding-top: 2px; + width: 24px; + height: 24px; `; const ResultWrapperLink = ResultWrapper.withComponent('a').extend` -padding-top: 3px; -padding-left: 5px; + height: 32px; + padding-top: 3px; + padding-left: 5px; -&:hover, -&:active, -&:focus { - margin-left: 0px; - border-radius: 2px; - background: ${color.black}; - color: ${color.smokeLight}; - outline: none; - cursor: pointer; -} + &:hover, + &:active, + &:focus { + margin-left: 0px; + border-radius: 2px; + background: ${color.black}; + color: ${color.smokeLight}; + outline: none; + cursor: pointer; + + ${StyledChevronIcon} svg { + fill: ${color.smokeLight}; + } + } `; type Props = { @@ -79,16 +90,16 @@ type Props = { {this.resultDocument && {' '} - + {' '} {this.resultDocument.pathToDocument .map(doc => {doc.title}) - .reduce((prev, curr) => [prev, , curr])} + .reduce((prev, curr) => [prev, , curr])} } {document && {' '} - + {' '}{document.title} }