From ad4f1b68201be7bb3b70f1b6327adcdf231c70e7 Mon Sep 17 00:00:00 2001
From: Antoine Detailleur <detailleur@fortiss.org>
Date: Fri, 9 Apr 2021 12:59:45 +0200
Subject: [PATCH] [NRRPLT-8136] First CSS processing, need bootstrap
refactoring
---
src/components/dialog/error-dialog.css | 13 +++++++------
src/components/dialog/error-dialog.js | 26 +++++++++++++-------------
2 files changed, 20 insertions(+), 19 deletions(-)
diff --git a/src/components/dialog/error-dialog.css b/src/components/dialog/error-dialog.css
index bc4f8cc..f375b00 100644
--- a/src/components/dialog/error-dialog.css
+++ b/src/components/dialog/error-dialog.css
@@ -6,10 +6,11 @@
z-index: 999;
}
-.modal-dialog {
- position: absolute;
- margin: 50px;
- left: 50%;
- -ms-transform: translateX(-50%);
- transform: translateX(-50%);
+.modal-header{
+ background-color: rgb(241, 185, 185);
+ color: rgb(138, 41, 41);
+}
+
+.details{
+ clear: left;
}
\ No newline at end of file
diff --git a/src/components/dialog/error-dialog.js b/src/components/dialog/error-dialog.js
index 54c4592..7596e2b 100644
--- a/src/components/dialog/error-dialog.js
+++ b/src/components/dialog/error-dialog.js
@@ -49,14 +49,24 @@ class ErrorDialog extends React.Component{
<div>
{error?
<div className="modal-dialog-wrapper">
- <Modal.Dialog className="modal-dialog">
- <Modal.Header>
+ <Modal.Dialog>
+ <Modal.Header className="modal-header">
<h4>{error.type}</h4>
</Modal.Header>
<Modal.Body>
<h5>Details</h5><pre>{error.message}</pre>
+ </Modal.Body>
+ <Modal.Footer>
+ <div>
+ <Button variant="warning" onClick={() => this.handleClose()}>
+ <span className="glyphicon glyphicon-remove"></span> Close
+ </Button>
+ <Button variant="light" onClick={() => this.sourceDisplay()}>
+ {this.state.isErrorSourceDisplayed ? 'Hide' : 'Show'} scary details <span></span>
+ </Button>
+ </div>
{this.state.isErrorSourceDisplayed
- ?<div>
+ ? <div className="details">
{!error.code && !error.data && !error.stack
? <h6>No scary details</h6>
: null}
@@ -72,16 +82,6 @@ class ErrorDialog extends React.Component{
</div>
: null
}
- </Modal.Body>
- <Modal.Footer>
- <div>
- <Button variant="outline-dark" onClick={() => this.handleClose()}>
- <span className="glyphicon glyphicon-remove"></span> Close
- </Button>
- <Button variant="outline-dark" className="pull-right" onClick={() => this.sourceDisplay()}>
- {this.state.isErrorSourceDisplayed ? 'Hide' : 'Show'} scary details <span className="caret"></span>
- </Button>
- </div>
</Modal.Footer>
</Modal.Dialog>
</div>
--
GitLab