Extracted breadcrumbs into a shared component, added it to project settings page

This commit is contained in:
ireic
2019-12-27 16:40:40 +01:00
parent 7ceb18ee84
commit 2fb374b082
10 changed files with 65 additions and 47 deletions

View File

@@ -1,18 +1,6 @@
import styled from 'styled-components';
import { color, font } from 'shared/utils/styles';
export const Breadcrumbs = styled.div`
color: ${color.textMedium};
${font.size(15)};
`;
export const Divider = styled.span`
position: relative;
top: 2px;
margin: 0 10px;
${font.size(18)};
`;
import { font } from 'shared/utils/styles';
export const Header = styled.div`
margin-top: 6px;

View File

@@ -1,31 +1,14 @@
import React from 'react';
import PropTypes from 'prop-types';
import { CopyLinkButton } from 'shared/components';
import { Breadcrumbs, Divider, Header, BoardName } from './Styles';
import { Header, BoardName } from './Styles';
const propTypes = {
projectName: PropTypes.string.isRequired,
};
const ProjectBoardHeader = ({ projectName }) => (
<>
<Breadcrumbs>
Projects
<Divider>/</Divider>
{projectName}
<Divider>/</Divider>
Kanban Board
</Breadcrumbs>
<Header>
<BoardName>Kanban board</BoardName>
<CopyLinkButton />
</Header>
</>
const ProjectBoardHeader = () => (
<Header>
<BoardName>Kanban board</BoardName>
<CopyLinkButton />
</Header>
);
ProjectBoardHeader.propTypes = propTypes;
export default ProjectBoardHeader;