senaduka/old-roraccounting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'fix-modal-dialogs' into 'master'

Browse Source 
improve modal dialogs

See merge request saburly/gangsta/roraccounting!29
This commit was merged in pull request #29.
This commit is contained in:
Bilal Catic
2020-10-09 06:04:02 +00:00
parent 6da39656f1 7c0a23251e
commit f2af0639f3
3 changed files with 11 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
client/src/common/InputModal.js
View File

@@ -1,5 +1,6 @@
import React, { useRef } from 'react'; import React, { useRef } from 'react';
import {Modal, Button, Row, Col} from 'react-materialize'; import {Modal, Button} from 'react-materialize';
import "./Modal.css";
const InputModal = (props) => { const InputModal = (props) => {
const { title, body, confirmAction, stopAction, triggerNode, defaultInputValue, inputLabel } = props; const { title, body, confirmAction, stopAction, triggerNode, defaultInputValue, inputLabel } = props;
@@ -8,17 +9,9 @@ const InputModal = (props) => {
return( return(
<Modal <Modal
actions={[ actions={[
<Row> <Button modal="confirm" node="button" className="orange" onClick={() => confirmAction(inputField.current.value)}>Do it</Button>,
<Col s={3}> <Button modal="close" node="button" className="bump" onClick={stopAction}>Nope</Button>
<Button modal="confirm" node="button" waves="green" onClick={() => confirmAction(inputField.current.value)}>Do it</Button>
</Col>
<Col s={3}>
<Button modal="close" node="button" waves="red" onClick={stopAction}>Stop</Button>
</Col>
</Row>
]} ]}
bottomSheet
fixedFooter={false}
header={title} header={title}
id="Modal-1" id="Modal-1"
open={false} open={false}

3
client/src/common/Modal.css Normal file
View File

@@ -0,0 +1,3 @@
.bump {
margin-left: 1em !important;
}

15
client/src/common/YesNoModal.js
View File

@@ -1,22 +1,15 @@
import React from 'react'; import React from 'react';
import { Modal, Button, Row, Col } from 'react-materialize'; import { Modal, Button } from 'react-materialize';
import "./Modal.css";
const YesNoModal = (props) => { const YesNoModal = (props) => {
const { title, body, yesAction, noAction, triggerNode } = props; const { title, body, yesAction, noAction, triggerNode } = props;
return( return(
<Modal <Modal
actions={[ actions={[
<Row> <Button modal="confirm" node="button" className="orange" onClick={yesAction}>Do it</Button>,
<Col s={3}> <Button modal="close" node="button" className="bump" onClick={noAction}>Nope</Button>
<Button modal="confirm" node="button" waves="green" onClick={yesAction}>Yes</Button>
</Col>
<Col s={3}>
<Button modal="close" node="button" waves="red" onClick={noAction}>No</Button>
</Col>
</Row>
]} ]}
bottomSheet
fixedFooter={false}
header={title} header={title}
id="Modal-0" id="Modal-0"
open={false} open={false}