import styled from 'styled-components';

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

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

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