import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';

import Text from '@bufferapp/components/Text';

const Container = styled.div`
  display: block;
  margin: 0 1rem 0.5rem;
  padding: 0 0 0.5rem;
  border-bottom: 1px solid #E0E0E0;

  > span {
    color: #3D3D3D !important;
  }
`;

const Label = ({ children }) => (
  <Container>
    <Text color="lightSlate" weight="bold" size="mini">{children}</Text>
  </Container>
);

Label.propTypes = {
  children: PropTypes.node.isRequired,
};

export default Label;