aboutsummaryrefslogtreecommitdiffstats
path: root/packages/dev-tools-pages/ts/components/inline-code.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/dev-tools-pages/ts/components/inline-code.tsx')
-rw-r--r--packages/dev-tools-pages/ts/components/inline-code.tsx20
1 files changed, 20 insertions, 0 deletions
diff --git a/packages/dev-tools-pages/ts/components/inline-code.tsx b/packages/dev-tools-pages/ts/components/inline-code.tsx
new file mode 100644
index 000000000..561666b0f
--- /dev/null
+++ b/packages/dev-tools-pages/ts/components/inline-code.tsx
@@ -0,0 +1,20 @@
+import * as React from 'react';
+import styled from 'styled-components';
+
+import { colors } from '../variables';
+
+interface InlineCodeProps {
+ isAlt?: boolean;
+ children: React.ReactNode;
+}
+
+const Code: React.StatelessComponent<InlineCodeProps> = ({ isAlt, children, ...props }) => (
+ <code {...props}>{children}</code>
+);
+
+const InlineCode = styled(Code)`
+ background-color: ${props => (props.isAlt ? '#E5E8E9' : colors.blueGray)};
+ padding: 0.3125rem;
+`;
+
+export { InlineCode };