diff options
author | Dan Miller <danjm.com@gmail.com> | 2018-08-03 00:02:22 +0800 |
---|---|---|
committer | Dan Miller <danjm.com@gmail.com> | 2018-12-04 11:36:04 +0800 |
commit | 342dc95410b10f042b3f8ee4135f5fef1fd6fe93 (patch) | |
tree | 83f6e8a0500e91fef1fdc9f460c03dc638e33f99 /ui/app/components/gas-customization/gas-slider/gas-slider.component.js | |
parent | 5e7409482b6fc55eafc330e4bc119f7485f068bb (diff) | |
download | tangerine-wallet-browser-342dc95410b10f042b3f8ee4135f5fef1fd6fe93.tar.gz tangerine-wallet-browser-342dc95410b10f042b3f8ee4135f5fef1fd6fe93.tar.zst tangerine-wallet-browser-342dc95410b10f042b3f8ee4135f5fef1fd6fe93.zip |
Adds the content of the advanced tab - w/o chart or dynamic content - to gas customize modal.
Diffstat (limited to 'ui/app/components/gas-customization/gas-slider/gas-slider.component.js')
-rw-r--r-- | ui/app/components/gas-customization/gas-slider/gas-slider.component.js | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/ui/app/components/gas-customization/gas-slider/gas-slider.component.js b/ui/app/components/gas-customization/gas-slider/gas-slider.component.js new file mode 100644 index 000000000..5836e7dfc --- /dev/null +++ b/ui/app/components/gas-customization/gas-slider/gas-slider.component.js @@ -0,0 +1,48 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' + +export default class AdvancedTabContent extends Component { + static propTypes = { + onChange: PropTypes.func, + lowLabel: PropTypes.string, + highLabel: PropTypes.string, + value: PropTypes.number, + step: PropTypes.number, + max: PropTypes.number, + min: PropTypes.number, + } + + render () { + const { + onChange, + lowLabel, + highLabel, + value, + step, + max, + min, + } = this.props + + return ( + <div className="gas-slider"> + <input + className="gas-slider__input" + type="range" + step={step} + max={max} + min={min} + value={value} + id="gasSlider" + onChange={event => onChange(event.target.value)} + /> + <div className="gas-slider__bar"> + <div className="gas-slider__colored"/> + </div> + <div className="gas-slider__labels"> + <span>{lowLabel}</span> + <span>{highLabel}</span> + </div> + </div> + ) + } +} |