Makes modal buttons the consistent throughout the app. (medium size, …

…right side, primary color for save)
CDAT · May 17, 2018 · b639c34 · b639c34
1 parent 76fdfab
commit b639c34
Show file tree

Hide file tree

Showing 7 changed files with 18 additions and 21 deletions.
diff --git a/frontend/src/js/components/modals/CachedFiles/RenameVariable.jsx b/frontend/src/js/components/modals/CachedFiles/RenameVariable.jsx
@@ -25,7 +25,7 @@ class RenameVariable extends Component{
                         </FormGroup>
                     </Modal.Body>
                     <Modal.Footer>
-                        <Button bsStyle="primary" bsSize="small"
+                        <Button bsStyle="primary"
                             onClick={() => {
                                 if (this.state.temporaryRedefinedVariableName) {
                                     this.doneRedefineVariable();
@@ -35,7 +35,7 @@ class RenameVariable extends Component{
                                     });
                                 }
                             }}>Confirm</Button>
-                        <Button bsSize="small" onClick={() => this.setState({ showRedefineVariableModal: false })}>Close</Button>
+                        <Button onClick={() => this.setState({ showRedefineVariableModal: false })}>Close</Button>
                     </Modal.Footer>
                 </Modal>
                 <Dialog ref="dialog" />

diff --git a/frontend/src/js/components/modals/CachedFiles/Tabs/FileTab.jsx b/frontend/src/js/components/modals/CachedFiles/Tabs/FileTab.jsx
@@ -483,16 +483,16 @@ class FileTab extends Component {
                     }
                 </Modal.Body>
                 <Modal.Footer>
-                    <Button bsStyle="primary" bsSize="small" onClick={(e) => {
+                    <Button bsStyle="primary" onClick={(e) => {
                         this.load()
                     }}>Load</Button>
-                    <Button bsStyle="primary" bsSize="small" onClick={(e) => {
+                    <Button bsStyle="primary" onClick={(e) => {
                         this.loadAndClose()
                     }}>Load and Close</Button>
-                    <Button bsStyle="primary" bsSize="small" onClick={(e) => {
+                    <Button bsStyle="primary" onClick={(e) => {
                         this.loadAs()
                     }}>Load As</Button>
-                    <Button bsStyle="default" bsSize="small" onClick={() => this.props.onTryClose()}>Close</Button>
+                    <Button bsStyle="default" onClick={() => this.props.onTryClose()}>Close</Button>
                 </Modal.Footer>
                 <Modal show={this.state.showRedefineVariableModal}>
                     <Modal.Header>
@@ -508,7 +508,7 @@ class FileTab extends Component {
                         </FormGroup>
                     </Modal.Body>
                     <Modal.Footer>
-                        <Button bsStyle="primary" bsSize="small"
+                        <Button bsStyle="primary"
                             onClick={() => {
                                 if (this.state.temporaryRedefinedVariableName) {
                                     this.doneRedefineVariable();
@@ -518,7 +518,7 @@ class FileTab extends Component {
                                     });
                                 }
                             }}>Confirm</Button>
-                        <Button bsSize="small" onClick={() => this.setState({ showRedefineVariableModal: false })}>Close</Button>
+                        <Button onClick={() => this.setState({ showRedefineVariableModal: false })}>Close</Button>
                     </Modal.Footer>
                 </Modal>
                 {this.state.showFileInfoModal &&

diff --git a/frontend/src/js/components/modals/ColormapEditor/ColormapEditor.jsx b/frontend/src/js/components/modals/ColormapEditor/ColormapEditor.jsx
@@ -406,7 +406,7 @@ class ColormapEditor extends Component {
                             onClick={() => {this.handleApplyColormap()}}>
                             Apply
                         </Button>
-                        <Button onClick={() => {this.saveColormap(this.state.selected_colormap_name)}}>Save</Button>
+                        <Button onClick={() => {this.saveColormap(this.state.selected_colormap_name)}} bsStyle="primary">Save</Button>
                         <Button onClick={this.openImportExportModal.bind(this)}>Import/Export</Button>
                         <Button onClick={this.props.close}>Close</Button>
                     </Modal.Footer>

diff --git a/frontend/src/js/components/modals/EditVariable.jsx b/frontend/src/js/components/modals/EditVariable.jsx
@@ -155,8 +155,8 @@ class EditVariable extends Component {
                     }
                 </Modal.Body>
                 <Modal.Footer>
-                    <Button id="edit-var-save" bsStyle="default" bsSize="small" onClick={() => this.save()}>Save</Button>
-                    <Button id="edit-var-close" bsStyle="default" bsSize="small" onClick={() => this.props.onTryClose()}>Close</Button>
+                    <Button id="edit-var-save" bsStyle="primary" onClick={() => this.save()}>Save</Button>
+                    <Button id="edit-var-close" bsStyle="default" onClick={() => this.props.onTryClose()}>Close</Button>
                 </Modal.Footer>
             </Modal>
         )

diff --git a/frontend/src/js/components/modals/FileInfoModal/FileInfoModal.jsx b/frontend/src/js/components/modals/FileInfoModal/FileInfoModal.jsx
@@ -88,7 +88,7 @@ class FileInfoModal extends Component{
                     </div>
                 </Modal.Body>
                 <Modal.Footer>
-                    <Button id="infotab-close" bsStyle="default" bsSize="small" onClick={() => this.props.onTryClose()}>Close</Button>
+                    <Button id="infotab-close" bsStyle="default" onClick={() => this.props.onTryClose()}>Close</Button>
                 </Modal.Footer>
             </Modal>
         )

diff --git a/frontend/src/js/components/modals/GraphicsMethodEditor.jsx b/frontend/src/js/components/modals/GraphicsMethodEditor.jsx
@@ -2,7 +2,7 @@ import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import widgets from 'vcs-widgets'
 import $ from 'jquery'
-import {Modal, ButtonToolbar, Button} from 'react-bootstrap'
+import {Modal, Button} from 'react-bootstrap'
 
 class GraphicsMethodEditor extends Component {
     constructor(props){
@@ -37,14 +37,13 @@ class GraphicsMethodEditor extends Component {
                             updateGraphicsMethod={this.updateGraphicsMethod} />
                 </Modal.Body>
                 <Modal.Footer>
-                    <ButtonToolbar>
-                        <Button onClick={this.props.onHide}>Cancel</Button>
                         <Button
+                            bsStyle="primary"
                             onClick={() => {
                                 this.props.updateGraphicsMethod(this.state.workingGraphicsMethod); this.props.onHide() 
                             }}>Save
                         </Button>
-                    </ButtonToolbar>
+                        <Button onClick={this.props.onHide}>Cancel</Button>
                 </Modal.Footer>
             </Modal>
         );

diff --git a/frontend/src/js/components/modals/TemplateEditor.jsx b/frontend/src/js/components/modals/TemplateEditor.jsx
@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
-import { Modal, ButtonToolbar, Button } from 'react-bootstrap'
+import { Modal, Button } from 'react-bootstrap'
 import widgets from 'vcs-widgets'
 import PubSub from 'pubsub-js'
 import PubSubEvents from '../../constants/PubSubEvents.js'
@@ -68,10 +68,8 @@ class TemplateEditor extends Component {
                     }
                 </Modal.Body>
                 <Modal.Footer>
-                    <ButtonToolbar>
-                        <Button onClick={this.props.close}>Cancel</Button>
-                        <Button onClick={this.saveTemplate}>Save</Button>
-                    </ButtonToolbar>
+                    <Button onClick={this.saveTemplate} bsStyle="primary">Save</Button>
+                    <Button onClick={this.props.close} bsStyle="default">Cancel</Button>    
                 </Modal.Footer>
             </Modal>
         );