npm.io
3.0.0 • Published 7 years ago

@stellar-apps/min-height-hero

Licence
MIT
Version
3.0.0
Deps
2
Size
9 kB
Vulns
0
Weekly
0
Stars
3

@stellar-apps/min-height-hero

A Hero component that sets the viewport's height as a min-height unless the maxHeight prop is set and exceeds the viewport height.

Installation

yarn add @stellar-apps/min-height-hero

Usage

import Hero from '@stellar-apps/min-height-hero'

function HomePage (props) {
  return (
    <Hero headerID='my-header' maxHeight={900}>
      
    </Hero>
  )
}
Hero
Props
  • maxHeight {number}
    • default Infinity
    • The maximum allowed height of the Hero
  • headerID {string}
    • default main-header
    • A header DOM id to subtract from the height of the hero. i.e. if provided and the header element's height is 96, the height of the hero will be viewportHeight - 96
  • footerID {string}
    • default null
    • A footer DOM id to subtract from the height of the hero. i.e. if provided and the footer element's height is 96, the height of the hero will be viewportHeight - 96