PanelHeader.js

import React from 'react';
import styled from 'styled-components';
import { Row } from 'react-styled-flexboxgrid';
import { base as baseTheme } from '../../cl-themes/src';

const PanelHeader = styled(Row).attrs({
  between: 'xs',
  middle: 'xs',
})`
  background-color: ${(props) => props.theme.palette.panel};
  border-bottom: ${(props) => `1px solid ${props.theme.palette.border}`};
`;

PanelHeader.defaultProps = {
  theme: baseTheme,
};

export default PanelHeader;