https://github.com/hanford/full-height-hoc

Loop over elements so a page can use flexbox height
https://github.com/hanford/full-height-hoc

flex flexbox full-height hoc javascript opensource react

Last synced: 15 days ago
JSON representation

Loop over elements so a page can use flexbox height

• Host: GitHub
• URL: https://github.com/hanford/full-height-hoc
• Owner: hanford
• Created: 2017-12-31T08:29:40.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2018-04-08T19:41:16.000Z (almost 7 years ago)
• Last Synced: 2025-02-03T03:27:34.545Z (18 days ago)
• Topics: flex, flexbox, full-height, hoc, javascript, opensource, react
• Language: JavaScript
• Homepage:
• Size: 34.2 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
## full-height-hoc

Loop over DOM elements setting/unsetting height to 100% so you can use `flexbox` height

## Install

```

$ npm install full-height-hoc --save

```

## Usage

```js

import React, { Component } from 'react'

import withFullHeight from 'full-height-hoc'

class RandomComp extends Component {

  ...

}

export default withFullHeight(RandomComp)

```

Or with your own list of selectors

```js

import React, { Component } from 'react'

import withFullHeight from 'full-height-hoc'

class RandomComp extends Component {

  ...

}

export default withFullHeight(RandomComp, ['section', 'body', '.content', '#container'])

```

## Demo

[![Edit o9rvqxyn6z](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/o9rvqxyn6z)

MIT © [Jack Hanford](http://jackhanford.com)