Abstract SectionHeader and make 12px per Chris's comment and figma design

1 files changed, 22 insertions, 0 deletions

diff --git a/packages/instant/src/components/section_header.tsx b/packages/instant/src/components/section_header.tsx
new file mode 100644
index 000000000..a6be3d8af
--- /dev/null
+++ b/packages/instant/src/components/section_header.tsx
@@ -0,0 +1,22 @@
+import * as React from 'react';
+
+import { ColorOption } from '../style/theme';
+
+import { Text } from './ui/text';
+
+export interface SectionHeaderProps {
+    children?: React.ReactNode;
+}
+export const SectionHeader: React.StatelessComponent<{}> = props => {
+    return (
+        <Text
+            letterSpacing="1px"
+            fontColor={ColorOption.primaryColor}
+            fontWeight={600}
+            textTransform="uppercase"
+            fontSize="12px"
+        >
+            {props.children}
+        </Text>
+    );
+};