diff --git a/react/src/components/dashboard/settings/settings.js b/react/src/components/dashboard/settings/settings.js
index 42434f6..59d5343 100644
--- a/react/src/components/dashboard/settings/settings.js
+++ b/react/src/components/dashboard/settings/settings.js
@@ -42,40 +42,12 @@ class Settings extends React.Component {
super();
this.state = {
activeTab: 0,
- activeTabHeight: '0',
tabElId: null,
seedInputVisibility: false,
nativeOnly: Config.iguanaLessMode,
disableWalletSpecificUI: false,
};
this.updateInput = this.updateInput.bind(this);
- this.updateTabDimensions = this.updateTabDimensions.bind(this);
- }
-
- updateTabDimensions() {
- setTimeout(() => {
- if(document.querySelector(`#${this.state.tabElId} .panel-collapse .panel-body`)){
- const _height = document.querySelector(`#${this.state.tabElId} .panel-collapse .panel-body`).offsetHeight;
- } else {
- _height = '100%';
- }
- this.setState(Object.assign({}, this.state, {
- activeTabHeight: _height,
- }));
- }, 100);
- }
-
- componentWillMount() {
- window.addEventListener('resize', this.updateTabDimensions);
- }
-
- componentWillUnmount() {
- window.removeEventListener('resize', this.updateTabDimensions);
-
- if (!this.state.disableWalletSpecificUI) {
- document.documentElement.style.height = '100%';
- document.body.style.height = '100%';
- }
}
componentDidMount(props) {
@@ -85,15 +57,14 @@ class Settings extends React.Component {
Store.dispatch(getAppConfig());
Store.dispatch(getAppInfo());
+
+ document.getElementById('section-iguana-wallet-settings').setAttribute("style", "height:auto; min-height: 100%");
}
componentWillReceiveProps(props) {
if (this.state.tabElId) {
- const _height = document.querySelector(`#${this.state.tabElId} .panel-collapse .panel-body`).offsetHeight;
-
this.setState(Object.assign({}, this.state, {
activeTab: this.state.activeTab,
- activeTabHeight: _height,
tabElId: this.state.tabElId,
disableWalletSpecificUI: this.props.disableWalletSpecificUI,
}));
@@ -101,26 +72,17 @@ class Settings extends React.Component {
}
openTab(elemId, tab) {
- setTimeout(() => {
- const _height = document.querySelector(`#${elemId} .panel-collapse .panel-body`).offsetHeight;
-
- this.setState(Object.assign({}, this.state, {
+ this.setState(Object.assign({}, this.state, {
activeTab: tab,
- activeTabHeight: _height,
tabElId: elemId,
}));
- // body size hack
- if (!this.state.disableWalletSpecificUI) {
- document.documentElement.style.height = '100%';
- document.body.style.height = '100%';
+ }
- setTimeout(() => {
- document.documentElement.style.height = _height <= 200 ? '100%' : 'inherit';
- document.body.style.height = _height <= 200 ? '100%' : 'inherit';
- }, 100);
- }
- }, 100);
+ updateInput(e) {
+ this.setState({
+ [e.target.name]: e.target.value,
+ });
}
renderAppInfoTab() {
@@ -176,12 +138,6 @@ class Settings extends React.Component {
return <SupportPanel />
}
- updateInput(e) {
- this.setState({
- [e.target.name]: e.target.value,
- });
- }
-
render() {
return SettingsRender.call(this);
}
diff --git a/react/src/components/dashboard/settings/settings.render.js b/react/src/components/dashboard/settings/settings.render.js
index ececb05..33682a8 100644
--- a/react/src/components/dashboard/settings/settings.render.js
+++ b/react/src/components/dashboard/settings/settings.render.js
@@ -28,7 +28,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 0 ? ' in' : '') }
- style={{ height: this.state.activeTab === 0 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 0 ? `auto` : '0' }}>
{ this.renderWalletInfo() }
</div>
</div>
@@ -45,7 +45,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 1 ? ' in' : '') }
- style={{ height: this.state.activeTab === 1 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 1 ? `auto` : '0' }}>
{ this.renderAddNode() }
</div>
</div>
@@ -62,7 +62,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 2 ? ' in' : '') }
- style={{ height: this.state.activeTab === 2 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 2 ? `auto` : '0' }}>
{ this.renderWalletBackup() }
</div>
</div>
@@ -79,7 +79,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 3 ? ' in' : '') }
- style={{ height: this.state.activeTab === 3 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 3 ? `auto` : '0' }}>
{ this.renderFiatCurrency() } </div>
</div>
}
@@ -95,7 +95,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 4 ? ' in' : '') }
- style={{ height: this.state.activeTab === 4 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 4 ? `auto` : '0' }}>
{ this.renderExportKeys() }
</div>
</div>
@@ -112,7 +112,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 5 ? ' in' : '') }
- style={{ height: this.state.activeTab === 5 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 5 ? `auto` : '0' }}>
{ this.renderImportKeys() }
</div>
</div>
@@ -129,7 +129,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 6 ? ' in' : '') }
- style={{ height: this.state.activeTab === 6 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 6 ? `auto` : '0' }}>
{ this.renderDebugLog() }
</div>
</div>
@@ -145,7 +145,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 7 ? ' in' : '') }
- style={{ height: this.state.activeTab === 7 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 7 ? `auto` : '0' }}>
{ this.renderAppSettings() }
</div>
</div>
@@ -161,7 +161,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 8 ? ' in' : '') }
- style={{ height: this.state.activeTab === 8 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 8 ? `auto` : '0' }}>
{ this.renderAppInfoTab() }
</div>
</div>
@@ -178,7 +178,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 9 ? ' in' : '') }
- style={{ height: this.state.activeTab === 9 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 9 ? `auto` : '0' }}>
{ this.renderCliPanel() }
</div>
</div>
@@ -195,7 +195,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 10 ? ' in' : '') }
- style={{ height: this.state.activeTab === 10 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 10 ? `auto` : '0' }}>
{ this.renderAppUpdateTab() }
</div>
</div>
@@ -211,7 +211,7 @@ export const SettingsRender = function() {
</div>
<div
className={ 'panel-collapse collapse' + (this.state.activeTab === 11 ? ' in' : '') }
- style={{ height: this.state.activeTab === 11 ? `${this.state.activeTabHeight}px` : '0' }}>
+ style={{ height: this.state.activeTab === 11 ? `auto` : '0' }}>
{ this.renderSupportPanel() }
</div>
</div>