import React from "react";
import { Title, Subtitle, Description } from "@storybook/addon-docs";
import { Text } from "../Typography";

export const TextDocs: React.VFC<{}> = () => {
  return (
    <>
      <Title>Text</Title>
      <Subtitle>Основной текст</Subtitle>
      <Description>
        Стили используются в некрупных элементах, таких как основной текст и
        заголовки
      </Description>
      <div style={{marginBottom: '10px'}}>
        <Text type="P">Paragraph</Text>
      </div>
      <div style={{marginBottom: '10px'}}>
        <Text type="LINK">LINK</Text>
      </div>
      <div style={{marginBottom: '10px'}}>
        <Text type="IMAGE_TEXT">IMAGE_TEXT</Text>
      </div>
    </>
  );
};