Change Typography Size
Summary: Typography on Sandy! The designed typography is [here in Figma](https://www.figma.com/file/4e6BMdm2SuZ1L7FSuOPQVC/Flipper?node-id=238%3A172) Current deflects - cannot find component for 'body - small' and 'meta' - don't know how to set 'link secondary hover' as designed Reviewed By: mweststrate Differential Revision: D23869256 fbshipit-source-id: efb1475749cebad529b502458d1b15bd445bb346
This commit is contained in:
committed by
Facebook GitHub Bot
parent
869d62b8c9
commit
93c897820b
53
desktop/app/src/sandy-chrome/TypographyExample.tsx
Normal file
53
desktop/app/src/sandy-chrome/TypographyExample.tsx
Normal file
@@ -0,0 +1,53 @@
|
||||
/**
|
||||
* Copyright (c) Facebook, Inc. and its affiliates.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
* @format
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import {Typography, Button, Space, Input} from 'antd';
|
||||
// import {styled, FlexColumn} from 'flipper';
|
||||
|
||||
const {Title, Text, Link} = Typography;
|
||||
|
||||
// const Container = styled(FlexColumn)({});
|
||||
|
||||
export default function TypographyExample() {
|
||||
return (
|
||||
<Space>
|
||||
<Space direction="vertical">
|
||||
<Title>h1. Headline</Title>
|
||||
<Title level={2}>h2. Headline</Title>
|
||||
<Title level={3}>h3. Headline</Title>
|
||||
<Title level={4}>h4. Headline</Title>
|
||||
<Text>Body - Regular</Text>
|
||||
<Text strong>Body - Strong</Text>
|
||||
<Button type="text" size="middle">
|
||||
Button
|
||||
</Button>
|
||||
<Button type="text" size="small">
|
||||
Button small
|
||||
</Button>
|
||||
<Text code>Code</Text>
|
||||
</Space>
|
||||
<Space direction="vertical">
|
||||
<Text>Primary</Text>
|
||||
<Text type="secondary">Secondary</Text>
|
||||
<Input placeholder="Placeholder" />
|
||||
<Text disabled>Disabled</Text>
|
||||
<Text type="success">Positive</Text>
|
||||
<Text type="warning">Warning</Text>
|
||||
<Text type="danger">Danger</Text>
|
||||
<Link href="https://fbflipper.com/" target="_blank">
|
||||
Link
|
||||
</Link>
|
||||
<Link type="secondary" href="https://fbflipper.com/" target="_blank">
|
||||
Link Secondary
|
||||
</Link>
|
||||
</Space>
|
||||
</Space>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user