diff options
| -rw-r--r-- | packages/dev-tools-pages/ts/components/Compiler.tsx | 2 | ||||
| -rw-r--r-- | packages/dev-tools-pages/ts/components/InlineCode.tsx | 10 |
2 files changed, 9 insertions, 3 deletions
diff --git a/packages/dev-tools-pages/ts/components/Compiler.tsx b/packages/dev-tools-pages/ts/components/Compiler.tsx index a5b92da13..995a53e89 100644 --- a/packages/dev-tools-pages/ts/components/Compiler.tsx +++ b/packages/dev-tools-pages/ts/components/Compiler.tsx @@ -45,7 +45,7 @@ const cards = [ title: 'Project-centric', body: ( <React.Fragment> - It can compile an entire project instead of only individual <InlineCode>.sol</InlineCode> files + It can compile an entire project instead of only individual <InlineCode alt>.sol</InlineCode> files </React.Fragment> ), }, diff --git a/packages/dev-tools-pages/ts/components/InlineCode.tsx b/packages/dev-tools-pages/ts/components/InlineCode.tsx index bfbaeb395..4b5afa95c 100644 --- a/packages/dev-tools-pages/ts/components/InlineCode.tsx +++ b/packages/dev-tools-pages/ts/components/InlineCode.tsx @@ -1,8 +1,14 @@ +import * as React from 'react'; import styled from 'styled-components'; import { colors } from '../variables'; -const InlineCode = styled.code` - background-color: ${colors.blueGray} +interface InlineCodeProps { + alt?: boolean; + children: React.ReactNode; +} + +const InlineCode = styled(({ alt, children, ...props }: InlineCodeProps) => <code {...props}>{children}</code>)` + background-color: ${props => (props.alt ? '#E5E8E9' : colors.blueGray)}; padding: 0.1875rem; `; |