import styled from 'styled-components';

import { typography } from '@redocly/theme/core/utils';

export const H3 = styled.h3.attrs<{ className?: string }>(({ className }) => ({
  'data-component-name': 'Typography/H3',
  className,
}))`
  color: var(--h3-text-color);
  margin: var(--h3-margin-top) 0 var(--h3-margin-bottom);

  ${typography('h3')};
`;