DocSpace-client/packages/shared/components/headline

Headline

Component that displays Heading text with custom styles

Usage

import Headline from "@docspace/common/components/Headline";

<Headline type="content" title="Some title" isInline>
  Some text
</Headline>

<Headline type="header" title="Some title">
  Some text
</Headline>

<Headline type="menu" title="Some title">
  Some text
</Headline>

If you need to override styles add forwardedAs instead of as

const StyledText = styled(Headline)`
  &:hover {
    border-bottom: 1px dotted;
  }
`;

<StyledText forwardedAs="span" title="Some title">
  Some text
</StyledText>

Properties

Props	Type	Required	Values	Default	Description
color	string	-	-	#333333	Specifies the contentHeader color
isInline	bool	-	-	false	Sets the 'display: inline-block' property
title	bool	-	-	-	Title
truncate	bool	-	-	false	Disables word wrapping
type	oneOf	✅	content, header, menu	-	Sets the size of text: content (21px), header (28px) or menu (27px)