diff options
author | Brandon Millman <brandon.millman@gmail.com> | 2018-03-15 05:36:04 +0800 |
---|---|---|
committer | Brandon Millman <brandon.millman@gmail.com> | 2018-03-15 05:36:04 +0800 |
commit | 380e51ca505a880e1ac24f46b3ba7e1a736f693e (patch) | |
tree | 95e0311485834d8181171da821f258dd46a2d258 /packages/react-shared/src/components/section_header.tsx | |
parent | 6a8c2cb7172be9b0aadb34904d1d9b3348bed0cc (diff) | |
parent | aea7207b9f9865a279243889a5f9ca1638ddc739 (diff) | |
download | dexon-0x-contracts-380e51ca505a880e1ac24f46b3ba7e1a736f693e.tar dexon-0x-contracts-380e51ca505a880e1ac24f46b3ba7e1a736f693e.tar.gz dexon-0x-contracts-380e51ca505a880e1ac24f46b3ba7e1a736f693e.tar.bz2 dexon-0x-contracts-380e51ca505a880e1ac24f46b3ba7e1a736f693e.tar.lz dexon-0x-contracts-380e51ca505a880e1ac24f46b3ba7e1a736f693e.tar.xz dexon-0x-contracts-380e51ca505a880e1ac24f46b3ba7e1a736f693e.tar.zst dexon-0x-contracts-380e51ca505a880e1ac24f46b3ba7e1a736f693e.zip |
Merge branch 'development' into feature/utils/console-log
* development: (25 commits)
Enable coverage for all other packages with tests
Fix parallel coverage results reporting
Fix linter issuesx
Remove outdated comment
Add script copying to build command
Add postpublish script to sol-cov
Move configuration into package.json configs section
Transform input data before encoding for callAsync and getABIEncodedTransactionData
Consolidate docs generation and uploading logic
Use async/await instead of promise syntax
Move changelog entry
remove unneeded include
remove unused dep
Fix lint issues
Re-add linter to monorepo-scripts but with tslint-config dep at earlier version to avoid cyclical dependency
small fixes
move scripts to monorepro-scripts
Fix gitignore
Move abi-gen scripts to src
Add missing dep
...
Diffstat (limited to 'packages/react-shared/src/components/section_header.tsx')
-rw-r--r-- | packages/react-shared/src/components/section_header.tsx | 73 |
1 files changed, 73 insertions, 0 deletions
diff --git a/packages/react-shared/src/components/section_header.tsx b/packages/react-shared/src/components/section_header.tsx new file mode 100644 index 000000000..ee34a6c09 --- /dev/null +++ b/packages/react-shared/src/components/section_header.tsx @@ -0,0 +1,73 @@ +import * as React from 'react'; +import { Element as ScrollElement } from 'react-scroll'; + +import { HeaderSizes } from '../types'; +import { colors } from '../utils/colors'; +import { utils } from '../utils/utils'; + +import { AnchorTitle } from './anchor_title'; + +export interface SectionHeaderProps { + sectionName: string; + headerSize?: HeaderSizes; +} + +interface DefaultSectionHeaderProps { + headerSize: HeaderSizes; +} + +type PropsWithDefaults = SectionHeaderProps & DefaultSectionHeaderProps; + +export interface SectionHeaderState { + shouldShowAnchor: boolean; +} + +export class SectionHeader extends React.Component<SectionHeaderProps, SectionHeaderState> { + public static defaultProps: Partial<SectionHeaderProps> = { + headerSize: HeaderSizes.H2, + }; + constructor(props: SectionHeaderProps) { + super(props); + this.state = { + shouldShowAnchor: false, + }; + } + public render() { + const { sectionName, headerSize } = this.props as PropsWithDefaults; + + const finalSectionName = this.props.sectionName.replace(/-/g, ' '); + const id = utils.getIdFromName(finalSectionName); + return ( + <div + onMouseOver={this._setAnchorVisibility.bind(this, true)} + onMouseOut={this._setAnchorVisibility.bind(this, false)} + > + <ScrollElement name={id}> + <AnchorTitle + headerSize={headerSize} + title={ + <span + style={{ + textTransform: 'uppercase', + color: colors.grey, + fontFamily: 'Roboto Mono', + fontWeight: 300, + fontSize: 27, + }} + > + {finalSectionName} + </span> + } + id={id} + shouldShowAnchor={this.state.shouldShowAnchor} + /> + </ScrollElement> + </div> + ); + } + private _setAnchorVisibility(shouldShowAnchor: boolean) { + this.setState({ + shouldShowAnchor, + }); + } +} |